diff --git a/backend/open_webui/routers/channels.py b/backend/open_webui/routers/channels.py index 9a15b0fc1..f97a31c67 100644 --- a/backend/open_webui/routers/channels.py +++ b/backend/open_webui/routers/channels.py @@ -213,6 +213,8 @@ async def post_new_message( "user": UserNameResponse(**user.model_dump()).model_dump(), }, }, + "user": UserNameResponse(**user.model_dump()).model_dump(), + "channel": channel.model_dump(), }, to=f"channel:{channel.id}", ) @@ -275,6 +277,8 @@ async def update_message_by_id( "user": UserNameResponse(**user.model_dump()).model_dump(), }, }, + "user": UserNameResponse(**user.model_dump()).model_dump(), + "channel": channel.model_dump(), }, to=f"channel:{channel.id}", ) @@ -334,6 +338,8 @@ async def delete_message_by_id( "user": UserNameResponse(**user.model_dump()).model_dump(), }, }, + "user": UserNameResponse(**user.model_dump()).model_dump(), + "channel": channel.model_dump(), }, to=f"channel:{channel.id}", ) diff --git a/src/lib/components/NotificationToast.svelte b/src/lib/components/NotificationToast.svelte index 6adcd01a8..8cf5807e9 100644 --- a/src/lib/components/NotificationToast.svelte +++ b/src/lib/components/NotificationToast.svelte @@ -24,7 +24,7 @@
{#if title} -
{title}
+
{title}
{/if}
diff --git a/src/lib/components/channel/Channel.svelte b/src/lib/components/channel/Channel.svelte index 51c813765..1bfd03d97 100644 --- a/src/lib/components/channel/Channel.svelte +++ b/src/lib/components/channel/Channel.svelte @@ -102,7 +102,7 @@ }); onDestroy(() => { - $socket?.off('channel-events', channelEventHandler); + // $socket?.off('channel-events', channelEventHandler); }); diff --git a/src/lib/components/chat/Chat.svelte b/src/lib/components/chat/Chat.svelte index 8d3fe0fb0..9ede63d9f 100644 --- a/src/lib/components/chat/Chat.svelte +++ b/src/lib/components/chat/Chat.svelte @@ -323,33 +323,6 @@ history.messages[event.message_id] = message; } - } else { - await tick(); - const type = event?.data?.type ?? null; - const data = event?.data?.data ?? null; - - if (type === 'chat:completion') { - const { done, content, title } = data; - - if (done) { - toast.custom(NotificationToast, { - componentProps: { - onClick: () => { - goto(`/c/${event.chat_id}`); - }, - content: content, - title: title - }, - duration: 15000, - unstyled: true - }); - } - } else if (type === 'chat:title') { - currentChatPage.set(1); - await chats.set(await getChatList(localStorage.token, $currentChatPage)); - } else if (type === 'chat:tags') { - allTags.set(await getAllTags(localStorage.token)); - } } }; @@ -453,7 +426,7 @@ onDestroy(() => { chatIdUnsubscriber?.(); window.removeEventListener('message', onMessageHandler); - $socket?.off('chat-events'); + // $socket?.off('chat-events'); }); // File upload functions diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index b14f52a08..05982a82d 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -15,7 +15,11 @@ mobile, socket, activeUserCount, - USAGE_POOL + USAGE_POOL, + chatId, + chats, + currentChatPage, + tags } from '$lib/stores'; import { goto } from '$app/navigation'; import { page } from '$app/stores'; @@ -32,6 +36,8 @@ import { WEBUI_BASE_URL, WEBUI_HOSTNAME } from '$lib/constants'; import i18n, { initI18n, getLanguages } from '$lib/i18n'; import { bestMatchingLanguage } from '$lib/utils'; + import { getAllTags, getChatList } from '$lib/apis/chats'; + import NotificationToast from '$lib/components/NotificationToast.svelte'; setContext('i18n', i18n); @@ -85,6 +91,62 @@ }); }; + const chatEventHandler = async (event) => { + if (event.chat_id !== $chatId) { + await tick(); + const type = event?.data?.type ?? null; + const data = event?.data?.data ?? null; + + if (type === 'chat:completion') { + const { done, content, title } = data; + + if (done) { + toast.custom(NotificationToast, { + componentProps: { + onClick: () => { + goto(`/c/${event.chat_id}`); + }, + content: content, + title: title + }, + duration: 15000, + unstyled: true + }); + } + } else if (type === 'chat:title') { + currentChatPage.set(1); + await chats.set(await getChatList(localStorage.token, $currentChatPage)); + } else if (type === 'chat:tags') { + tags.set(await getAllTags(localStorage.token)); + } + } + }; + + const channelEventHandler = async (event) => { + // check url path + const channel = $page.url.pathname.includes(`/channels/${event.channel_id}`); + + if (!channel && event?.user?.id !== $user?.id) { + await tick(); + const type = event?.data?.type ?? null; + const data = event?.data?.data ?? null; + + if (type === 'message') { + toast.custom(NotificationToast, { + componentProps: { + onClick: () => { + goto(`/channels/${event.channel_id}`); + }, + content: data?.content, + title: event?.channel?.name + }, + duration: 15000, + unstyled: true + }); + } + } + }; + onMount(async () => { theme.set(localStorage.theme); @@ -140,6 +202,9 @@ // Save Session User to Store $socket.emit('user-join', { auth: { token: sessionUser.token } }); + $socket?.on('chat-events', chatEventHandler); + $socket?.on('channel-events', channelEventHandler); + await user.set(sessionUser); await config.set(await getBackendConfig()); } else {