mirror of
https://github.com/open-webui/open-webui
synced 2025-01-16 07:48:32 +00:00
refac
This commit is contained in:
Timothy Jaeryang Baek
parent
2914c29ab3
commit
eaecd15e69
@ -53,6 +53,7 @@
|
||||
import { getChannels, createNewChannel } from '$lib/apis/channels';
|
||||
import CreateChannelModal from './Sidebar/CreateChannelModal.svelte';
|
||||
import ChannelItem from './Sidebar/ChannelItem.svelte';
|
||||
import PencilSquare from '../icons/PencilSquare.svelte';
|
||||
|
||||
const BREAKPOINT = 768;
|
||||
|
||||
@ -433,36 +434,6 @@
|
||||
: 'invisible'}"
|
||||
>
|
||||
<div class="px-1.5 flex justify-between space-x-1 text-gray-600 dark:text-gray-400">
|
||||
<a
|
||||
id="sidebar-new-chat-button"
|
||||
class="flex flex-1 rounded-lg px-2 py-1 h-full hover:bg-gray-100 dark:hover:bg-gray-900 transition"
|
||||
href="/"
|
||||
draggable="false"
|
||||
on:click={async () => {
|
||||
selectedChatId = null;
|
||||
await goto('/');
|
||||
const newChatButton = document.getElementById('new-chat-button');
|
||||
setTimeout(() => {
|
||||
newChatButton?.click();
|
||||
if ($mobile) {
|
||||
showSidebar.set(false);
|
||||
}
|
||||
}, 0);
|
||||
}}
|
||||
>
|
||||
<div class="self-center mx-1.5">
|
||||
<img
|
||||
crossorigin="anonymous"
|
||||
src="{WEBUI_BASE_URL}/static/favicon.png"
|
||||
class=" size-5 -translate-x-1.5 rounded-full"
|
||||
alt="logo"
|
||||
/>
|
||||
</div>
|
||||
<div class=" self-center font-medium text-sm text-gray-850 dark:text-white font-primary">
|
||||
{$i18n.t('New Chat')}
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<button
|
||||
class=" cursor-pointer p-[7px] flex rounded-xl hover:bg-gray-100 dark:hover:bg-gray-900 transition"
|
||||
on:click={() => {
|
||||
@ -486,6 +457,42 @@
|
||||
</svg>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<a
|
||||
id="sidebar-new-chat-button"
|
||||
class="flex justify-between items-center flex-1 rounded-lg px-2 py-1 h-full text-right hover:bg-gray-100 dark:hover:bg-gray-900 transition"
|
||||
href="/"
|
||||
draggable="false"
|
||||
on:click={async () => {
|
||||
selectedChatId = null;
|
||||
await goto('/');
|
||||
const newChatButton = document.getElementById('new-chat-button');
|
||||
setTimeout(() => {
|
||||
newChatButton?.click();
|
||||
if ($mobile) {
|
||||
showSidebar.set(false);
|
||||
}
|
||||
}, 0);
|
||||
}}
|
||||
>
|
||||
<div class="flex items-center">
|
||||
<div class="self-center mx-1.5">
|
||||
<img
|
||||
crossorigin="anonymous"
|
||||
src="{WEBUI_BASE_URL}/static/favicon.png"
|
||||
class=" size-5 -translate-x-1.5 rounded-full"
|
||||
alt="logo"
|
||||
/>
|
||||
</div>
|
||||
<div class=" self-center font-medium text-sm text-gray-850 dark:text-white font-primary">
|
||||
{$i18n.t('New Chat')}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<PencilSquare className=" size-5" strokeWidth="2" />
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
{#if $user?.role === 'admin' || $user?.permissions?.workspace?.models || $user?.permissions?.workspace?.knowledge || $user?.permissions?.workspace?.prompts || $user?.permissions?.workspace?.tools}
|
||||
@ -544,87 +551,10 @@
|
||||
? 'opacity-20'
|
||||
: ''}"
|
||||
>
|
||||
{#if ($user.role === 'admin' || $channels.length > 0) && !search}
|
||||
<Folder
|
||||
className="px-2 mt-0.5"
|
||||
name={$i18n.t('Channels')}
|
||||
dragAndDrop={false}
|
||||
onAdd={$user.role === 'admin'
|
||||
? () => {
|
||||
showCreateChannel = true;
|
||||
}
|
||||
: null}
|
||||
onAddLabel={$i18n.t('Create Channel')}
|
||||
>
|
||||
{#each $channels as channel}
|
||||
<ChannelItem id={channel.id} name={channel.name} />
|
||||
{/each}
|
||||
</Folder>
|
||||
{/if}
|
||||
|
||||
<Folder
|
||||
collapsible={!search}
|
||||
className="px-2 mt-0.5"
|
||||
name={$i18n.t('Chats')}
|
||||
onAdd={createFolder}
|
||||
onAddLabel={$i18n.t('New Folder')}
|
||||
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 ?? {});
|
||||
}
|
||||
|
||||
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;
|
||||
}
|
||||
|
||||
const res = await updateFolderParentIdById(localStorage.token, id, null).catch(
|
||||
(error) => {
|
||||
toast.error(error);
|
||||
return null;
|
||||
}
|
||||
);
|
||||
|
||||
if (res) {
|
||||
await initFolders();
|
||||
}
|
||||
}
|
||||
}}
|
||||
>
|
||||
{#if $temporaryChatEnabled}
|
||||
<div class="absolute z-40 w-full h-full flex justify-center"></div>
|
||||
{/if}
|
||||
|
||||
{#if !search && $pinnedChats.length > 0}
|
||||
<div class="flex flex-col space-y-1 rounded-xl">
|
||||
<Folder
|
||||
className=""
|
||||
className="px-2"
|
||||
bind:open={showPinnedChat}
|
||||
on:change={(e) => {
|
||||
localStorage.setItem('showPinnedChat', e.detail);
|
||||
@ -697,7 +627,24 @@
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div class=" flex-1 flex flex-col overflow-y-auto scrollbar-hidden">
|
||||
{#if ($user.role === 'admin' || $channels.length > 0) && !search}
|
||||
<Folder
|
||||
className="px-2 mt-0.5"
|
||||
name={$i18n.t('Channels')}
|
||||
dragAndDrop={false}
|
||||
onAdd={$user.role === 'admin'
|
||||
? () => {
|
||||
showCreateChannel = true;
|
||||
}
|
||||
: null}
|
||||
onAddLabel={$i18n.t('Create Channel')}
|
||||
>
|
||||
{#each $channels as channel}
|
||||
<ChannelItem id={channel.id} name={channel.name} />
|
||||
{/each}
|
||||
</Folder>
|
||||
{/if}
|
||||
|
||||
{#if !search && folders}
|
||||
<Folders
|
||||
{folders}
|
||||
@ -714,6 +661,64 @@
|
||||
/>
|
||||
{/if}
|
||||
|
||||
<Folder
|
||||
collapsible={!search}
|
||||
className="px-2 mt-0.5"
|
||||
name={$i18n.t('Chats')}
|
||||
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 ?? {});
|
||||
}
|
||||
|
||||
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;
|
||||
}
|
||||
|
||||
const res = await updateFolderParentIdById(localStorage.token, id, null).catch(
|
||||
(error) => {
|
||||
toast.error(error);
|
||||
return null;
|
||||
}
|
||||
);
|
||||
|
||||
if (res) {
|
||||
await initFolders();
|
||||
}
|
||||
}
|
||||
}}
|
||||
>
|
||||
{#if $temporaryChatEnabled}
|
||||
<div class="absolute z-40 w-full h-full flex justify-center"></div>
|
||||
{/if}
|
||||
|
||||
<div class=" flex-1 flex flex-col overflow-y-auto scrollbar-hidden">
|
||||
<div class="pt-1.5">
|
||||
{#if $chats}
|
||||
{#each $chats as chat, idx}
|
||||
|
||||
@ -19,6 +19,7 @@
|
||||
|
||||
{#each folderList as folderId (folderId)}
|
||||
<RecursiveFolder
|
||||
className="px-2"
|
||||
{folders}
|
||||
{folderId}
|
||||
on:import={(e) => {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user