diff --git a/src/lib/components/layout/Sidebar.svelte b/src/lib/components/layout/Sidebar.svelte index b46bbb245b..f8d192458d 100644 --- a/src/lib/components/layout/Sidebar.svelte +++ b/src/lib/components/layout/Sidebar.svelte @@ -60,6 +60,7 @@ import Sidebar from '../icons/Sidebar.svelte'; import PinnedModelList from './Sidebar/PinnedModelList.svelte'; import Note from '../icons/Note.svelte'; + import { slide } from 'svelte/transition'; const BREAKPOINT = 768; @@ -495,8 +496,8 @@ {#if !$mobile}
- -
- -
-
-
- -
+ + -
-
{$i18n.t('New Chat')}
+ +
+ {$WEBUI_NAME}
+ + +
-
- -
- - {#if ($config?.features?.enable_notes ?? false) && ($user?.role === 'admin' || ($user?.permissions?.features?.notes ?? true))} +
- +
-
{$i18n.t('Notes')}
+
{$i18n.t('New Chat')}
- {/if} - {#if $user?.role === 'admin' || $user?.permissions?.workspace?.models || $user?.permissions?.workspace?.knowledge || $user?.permissions?.workspace?.prompts || $user?.permissions?.workspace?.tools}
- { + showSearch.set(true); + }} draggable="false" >
- - - +
-
{$i18n.t('Workspace')}
+
{$i18n.t('Search')}
- +
- {/if} -
-
- {#if ($models ?? []).length > 0 && ($settings?.pinnedModels ?? []).length > 0} - - {/if} + {#if ($config?.features?.enable_notes ?? false) && ($user?.role === 'admin' || ($user?.permissions?.features?.notes ?? true))} +
+ +
+ +
+ +
+
{$i18n.t('Notes')}
+
+ +
+ {/if} + + {#if $user?.role === 'admin' || $user?.permissions?.workspace?.models || $user?.permissions?.workspace?.knowledge || $user?.permissions?.workspace?.prompts || $user?.permissions?.workspace?.tools} +
+ +
+ + + +
+ +
+
{$i18n.t('Workspace')}
+
+ +
+ {/if} +
+ +
+ {#if ($models ?? []).length > 0 && ($settings?.pinnedModels ?? []).length > 0} + + {/if} + + {#if $config?.features?.enable_channels && ($user?.role === 'admin' || $channels.length > 0)} + { + if ($user?.role === 'admin') { + await tick(); + + setTimeout(() => { + showCreateChannel = true; + }, 0); + } + }} + onAddLabel={$i18n.t('Create Channel')} + > + {#each $channels as channel} + { + await initChannels(); + }} + /> + {/each} + + {/if} - {#if $config?.features?.enable_channels && ($user?.role === 'admin' || $channels.length > 0)} { - if ($user?.role === 'admin') { - await tick(); - - setTimeout(() => { - showCreateChannel = true; - }, 0); - } + name={$i18n.t('Chats')} + onAdd={() => { + showCreateFolderModal = true; }} - onAddLabel={$i18n.t('Create Channel')} - > - {#each $channels as channel} - { - await initChannels(); - }} - /> - {/each} - - {/if} + onAddLabel={$i18n.t('New Folder')} + on:change={async (e) => { + selectedFolder.set(null); + await goto('/'); + }} + on:import={(e) => { + importChatHandler(e.detail); + }} + on:drop={async (e) => { + const { type, id, item } = e.detail; - { - showCreateFolderModal = true; - }} - onAddLabel={$i18n.t('New Folder')} - on:change={async (e) => { - selectedFolder.set(null); - await goto('/'); - }} - on:import={(e) => { - importChatHandler(e.detail); - }} - on:drop={async (e) => { - const { type, id, item } = e.detail; - - if (type === 'chat') { - let chat = await getChatById(localStorage.token, id).catch((error) => { - return null; - }); - if (!chat && item) { - chat = await importChat( - localStorage.token, - item.chat, - item?.meta ?? {}, - false, - null, - item?.created_at ?? null, - item?.updated_at ?? null - ); - } - - if (chat) { - console.log(chat); - if (chat.folder_id) { - const res = await updateChatFolderIdById(localStorage.token, chat.id, null).catch( - (error) => { - toast.error(`${error}`); - return null; - } + if (type === 'chat') { + let chat = await getChatById(localStorage.token, id).catch((error) => { + return null; + }); + if (!chat && item) { + chat = await importChat( + localStorage.token, + item.chat, + item?.meta ?? {}, + false, + null, + item?.created_at ?? null, + item?.updated_at ?? null ); } - if (chat.pinned) { - const res = await toggleChatPinnedStatusById(localStorage.token, chat.id); + if (chat) { + console.log(chat); + if (chat.folder_id) { + const res = await updateChatFolderIdById(localStorage.token, chat.id, null).catch( + (error) => { + toast.error(`${error}`); + return null; + } + ); + } + + if (chat.pinned) { + const res = await toggleChatPinnedStatusById(localStorage.token, chat.id); + } + + initChatList(); + } + } else if (type === 'folder') { + if (folders[id].parent_id === null) { + return; } - initChatList(); - } - } else if (type === 'folder') { - if (folders[id].parent_id === null) { - return; - } + const res = await updateFolderParentIdById(localStorage.token, id, null).catch( + (error) => { + toast.error(`${error}`); + return null; + } + ); - const res = await updateFolderParentIdById(localStorage.token, id, null).catch( - (error) => { - toast.error(`${error}`); - return null; + if (res) { + await initFolders(); } - ); - - if (res) { - await initFolders(); } - } - }} - > - {#if $pinnedChats.length > 0} -
- { - localStorage.setItem('showPinnedChat', e.detail); - console.log(e.detail); + }} + > + {#if $pinnedChats.length > 0} +
+ { + localStorage.setItem('showPinnedChat', e.detail); + console.log(e.detail); + }} + on:import={(e) => { + importChatHandler(e.detail, true); + }} + on:drop={async (e) => { + const { type, id, item } = e.detail; + + if (type === 'chat') { + let chat = await getChatById(localStorage.token, id).catch((error) => { + return null; + }); + if (!chat && item) { + chat = await importChat( + localStorage.token, + item.chat, + item?.meta ?? {}, + false, + null, + item?.created_at ?? null, + item?.updated_at ?? null + ); + } + + if (chat) { + console.log(chat); + if (chat.folder_id) { + const res = await updateChatFolderIdById( + localStorage.token, + chat.id, + null + ).catch((error) => { + toast.error(`${error}`); + return null; + }); + } + + if (!chat.pinned) { + const res = await toggleChatPinnedStatusById(localStorage.token, chat.id); + } + + initChatList(); + } + } + }} + name={$i18n.t('Pinned')} + > +
+ {#each $pinnedChats as chat, idx (`pinned-chat-${chat?.id ?? idx}`)} + { + selectedChatId = chat.id; + }} + on:unselect={() => { + selectedChatId = null; + }} + on:change={async () => { + initChatList(); + }} + on:tag={(e) => { + const { type, name } = e.detail; + tagEventHandler(type, name, chat.id); + }} + /> + {/each} +
+ +
+ {/if} + + {#if folders} + { + selectedFolder.set(null); + initChatList(); + }} + on:update={() => { + initChatList(); }} on:import={(e) => { - importChatHandler(e.detail, true); + const { folderId, items } = e.detail; + importChatHandler(items, false, folderId); }} - on:drop={async (e) => { - const { type, id, item } = e.detail; - - if (type === 'chat') { - let chat = await getChatById(localStorage.token, id).catch((error) => { - return null; - }); - if (!chat && item) { - chat = await importChat( - localStorage.token, - item.chat, - item?.meta ?? {}, - false, - null, - item?.created_at ?? null, - item?.updated_at ?? null - ); - } - - if (chat) { - console.log(chat); - if (chat.folder_id) { - const res = await updateChatFolderIdById( - localStorage.token, - chat.id, - null - ).catch((error) => { - toast.error(`${error}`); - return null; - }); - } - - if (!chat.pinned) { - const res = await toggleChatPinnedStatusById(localStorage.token, chat.id); - } - - initChatList(); - } - } + on:change={async () => { + initChatList(); }} - name={$i18n.t('Pinned')} - > -
- {#each $pinnedChats as chat, idx (`pinned-chat-${chat?.id ?? idx}`)} + /> + {/if} + +
+
+ {#if $chats} + {#each $chats as chat, idx (`chat-${chat?.id ?? idx}`)} + {#if idx === 0 || (idx > 0 && chat.time_range !== $chats[idx - 1].time_range)} +
+ {$i18n.t(chat.time_range)} + +
+ {/if} + {/each} -
- -
- {/if} - {#if folders} - { - selectedFolder.set(null); - initChatList(); - }} - on:update={() => { - initChatList(); - }} - on:import={(e) => { - const { folderId, items } = e.detail; - importChatHandler(items, false, folderId); - }} - on:change={async () => { - initChatList(); - }} - /> - {/if} - -
-
- {#if $chats} - {#each $chats as chat, idx (`chat-${chat?.id ?? idx}`)} - {#if idx === 0 || (idx > 0 && chat.time_range !== $chats[idx - 1].time_range)} -
{ + if (!chatListLoading) { + loadMoreChats(); + } + }} > - {$i18n.t(chat.time_range)} - -
+
+ +
Loading...
+
+ {/if} - - { - selectedChatId = chat.id; - }} - on:unselect={() => { - selectedChatId = null; - }} - on:change={async () => { - initChatList(); - }} - on:tag={(e) => { - const { type, name } = e.detail; - tagEventHandler(type, name, chat.id); - }} - /> - {/each} - - {#if $scrollPaginationEnabled && !allChatsLoaded} - { - if (!chatListLoading) { - loadMoreChats(); - } - }} + {:else} +
-
- -
Loading...
-
- + +
Loading...
+
{/if} - {:else} -
- -
Loading...
-
- {/if} -
-
- -
- -
-
- {#if $user !== undefined && $user !== null} - { - if (e.detail === 'archived-chat') { - showArchivedChats.set(true); - } - }} - > -
-
- {$i18n.t('Open -
-
{$user?.name}
- - {/if} +
+ +
+ +
+
+ {#if $user !== undefined && $user !== null} + { + if (e.detail === 'archived-chat') { + showArchivedChats.set(true); + } + }} + > +
+
+ {$i18n.t('Open +
+
{$user?.name}
+
+ + {/if} +
-
+{/if}