UniqAI/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui synced 2025-03-04 11:29:59 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

refac: message timestamp

Browse Source
This commit is contained in:
Timothy Jaeryang Baek 2025-01-22 01:02:52 -08:00
parent 10ffbca34b
commit 2b1c2942a8
4 changed files with 38 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/lib/components/channel/Messages/Message.svelte
View File

@ -30,6 +30,7 @@
import FaceSmile from '$lib/components/icons/FaceSmile.svelte';
import ReactionPicker from './Message/ReactionPicker.svelte';
import ChevronRight from '$lib/components/icons/ChevronRight.svelte';
import { formatDate } from '$lib/utils';
export let message;
export let showUserProfile = true;
@ -45,19 +46,6 @@
let edit = false;
let editedContent = null;
let showDeleteConfirmDialog = false;
const formatDate = (inputDate) => {
const date = dayjs(inputDate);
const now = dayjs();
if (date.isToday()) {
return `Today at ${date.format('HH:mm')}`;
} else if (date.isYesterday()) {
return `Yesterday at ${date.format('HH:mm')}`;
} else {
return `${date.format('DD/MM/YYYY')} at ${date.format('HH:mm')}`;
}
};
</script>
<ConfirmDialog

13
src/lib/components/chat/Messages/ResponseMessage.svelte
View File

@ -17,7 +17,8 @@
approximateToHumanReadable,
getMessageContentParts,
sanitizeResponseContent,
createMessagesList
createMessagesList,
formatDate
} from '$lib/utils';
import { WEBUI_BASE_URL } from '$lib/constants';
@ -496,11 +497,13 @@
</Tooltip>
{#if message.timestamp}
<span
class=" self-center shrink-0 translate-y-0.5 invisible group-hover:visible text-gray-400 text-xs font-medium uppercase ml-0.5 -mt-0.5"
<div
class=" self-center text-xs invisible group-hover:visible text-gray-400 font-medium first-letter:capitalize ml-0.5 translate-y-[1px]"
>
{dayjs(message.timestamp * 1000).format($i18n.t('h:mm a'))}
</span>
<Tooltip content={dayjs(message.timestamp * 1000).format('dddd, DD MMMM YYYY HH:mm')}>
<span class="line-clamp-1">{formatDate(message.timestamp * 1000)}</span>
</Tooltip>
</div>
{/if}
</Name>

12
src/lib/components/chat/Messages/UserMessage.svelte
View File

@ -5,7 +5,7 @@
import { models, settings } from '$lib/stores';
import { user as _user } from '$lib/stores';
import { copyToClipboard as _copyToClipboard } from '$lib/utils';
import { copyToClipboard as _copyToClipboard, formatDate } from '$lib/utils';
import Name from './Name.svelte';
import ProfileImage from './ProfileImage.svelte';
@ -109,11 +109,13 @@
{/if}
{#if message.timestamp}
<span
class=" invisible group-hover:visible text-gray-400 text-xs font-medium uppercase ml-0.5 -mt-0.5"
<div
class=" self-center text-xs invisible group-hover:visible text-gray-400 font-medium first-letter:capitalize ml-0.5 translate-y-[1px]"
>
{dayjs(message.timestamp * 1000).format($i18n.t('h:mm a'))}
</span>
<Tooltip content={dayjs(message.timestamp * 1000).format('dddd, DD MMMM YYYY HH:mm')}>
<span class="line-clamp-1">{formatDate(message.timestamp * 1000)}</span>
</Tooltip>
</div>
{/if}
</Name>
</div>

22
src/lib/utils/index.ts
View File

@ -1,6 +1,15 @@
import { v4 as uuidv4 } from 'uuid';
import sha256 from 'js-sha256';
import dayjs from 'dayjs';
import relativeTime from 'dayjs/plugin/relativeTime';
import isToday from 'dayjs/plugin/isToday';
import isYesterday from 'dayjs/plugin/isYesterday';
dayjs.extend(relativeTime);
dayjs.extend(isToday);
dayjs.extend(isYesterday);
import { WEBUI_BASE_URL } from '$lib/constants';
import { TTS_RESPONSE_SPLIT } from '$lib/types';
@ -281,6 +290,19 @@ export const generateInitialsImage = (name) => {
return canvas.toDataURL();
};
export const formatDate = (inputDate) => {
const date = dayjs(inputDate);
const now = dayjs();
if (date.isToday()) {
return `Today at ${date.format('HH:mm')}`;
} else if (date.isYesterday()) {
return `Yesterday at ${date.format('HH:mm')}`;
} else {
return `${date.format('DD/MM/YYYY')} at ${date.format('HH:mm')}`;
}
};
export const copyToClipboard = async (text) => {
let result = false;
if (!navigator.clipboard) {