bhetherman/open-webui
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refac

Browse Source
This commit is contained in:
Timothy Jaeryang Baek committed 2026-07-14 00:48:40 -04:00
1 parent 84e4d6ef82
commit f1584b5a37
46 files changed
+335 -378
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/lib/components/layout/Navbar/Menu.svelte
+31 -32
View File
@@ -25,6 +25,7 @@
import { getChatById } from '$lib/apis/chats';
import Dropdown from '$lib/components/common/Dropdown.svelte';
import DropdownMenu from '$lib/components/common/DropdownMenu.svelte';
import DropdownSub from '$lib/components/common/DropdownSub.svelte';
import Tags from '$lib/components/chat/Tags.svelte';
import Clipboard from '$lib/components/icons/Clipboard.svelte';
@@ -289,9 +290,7 @@
<slot />
<div slot="content">
<div
class="select-none min-w-[200px] max-w-[200px] rounded-2xl px-1 py-1 border border-gray-100 dark:border-gray-800 z-50 bg-white dark:bg-gray-850 dark:text-white shadow-lg transition"
>
<DropdownMenu className="select-none min-w-[200px] max-w-[200px] transition">
<!-- <DropdownMenu.Item draggable="false"
class="flex gap-2 items-center px-3 py-1.5 text-sm cursor-pointer dark:hover:bg-gray-800 rounded-xl"
on:click={async () => {
@@ -324,7 +323,7 @@
{#if scrollToTop}
<button
draggable="false"
class="flex gap-2 items-center px-3 py-1.5 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-xl select-none w-full"
class="flex h-[1.6875rem] w-full items-center gap-2 rounded-xl px-2 text-[13px] cursor-pointer select-none hover:bg-gray-50/60 dark:hover:bg-gray-800/60"
on:click={() => {
scrollToTop();
}}
@@ -335,7 +334,7 @@
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="size-4"
class="size-3.5"
>
<path
stroke-linecap="round"
@@ -346,13 +345,13 @@
<div class="flex items-center">{$i18n.t('Scroll to Top')}</div>
</button>
<hr class="border-gray-50/30 dark:border-gray-800/30 my-1" />
<hr class="border-gray-50/30 dark:border-gray-800/30 mx-1 my-0.5" />
{/if}
{#if ($artifactContents ?? []).length > 0}
<button
draggable="false"
class="flex gap-2 items-center px-3 py-1.5 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-xl select-none w-full"
class="flex h-[1.6875rem] w-full items-center gap-2 rounded-xl px-2 text-[13px] cursor-pointer select-none hover:bg-gray-50/60 dark:hover:bg-gray-800/60"
id="chat-artifacts-button"
on:click={async () => {
await showControls.set(true);
@@ -360,42 +359,42 @@
await showEmbeds.set(false);
}}
>
<Cube className=" size-4" strokeWidth="1.5" />
<Cube className="size-3.5" strokeWidth="1.5" />
<div class="flex items-center">{$i18n.t('Artifacts')}</div>
</button>
<hr class="border-gray-50/30 dark:border-gray-800/30 my-1" />
<hr class="border-gray-50/30 dark:border-gray-800/30 mx-1 my-0.5" />
{/if}
{#if !readOnly && !$temporaryChatEnabled && ($user?.role === 'admin' || ($user.permissions?.chat?.share ?? true))}
<button
draggable="false"
class="flex gap-2 items-center px-3 py-1.5 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-xl select-none w-full"
class="flex h-[1.6875rem] w-full items-center gap-2 rounded-xl px-2 text-[13px] cursor-pointer select-none hover:bg-gray-50/60 dark:hover:bg-gray-800/60"
id="chat-share-button"
on:click={() => {
shareHandler();
}}
>
<Share strokeWidth="1.5" />
<Share className="size-3.5" strokeWidth="1.5" />
<div class="flex items-center">{$i18n.t('Share')}</div>
</button>
{/if}
{#if $user?.role === 'admin' || ($user.permissions?.chat?.export ?? true)}
<DropdownSub>
<DropdownSub contentClass="select-none z-50">
<button
slot="trigger"
draggable="false"
class="flex gap-2 items-center px-3 py-1.5 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-xl select-none w-full"
class="flex h-[1.6875rem] w-full items-center gap-2 rounded-xl px-2 text-[13px] cursor-pointer select-none hover:bg-gray-50/60 dark:hover:bg-gray-800/60"
>
<Download strokeWidth="1.5" />
<Download className="size-3.5" strokeWidth="1.5" />
<div class="flex items-center">{$i18n.t('Download')}</div>
</button>
<button
draggable="false"
class="flex gap-2 items-center px-3 py-1.5 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-xl select-none w-full"
class="flex h-[1.6875rem] w-full items-center gap-2 rounded-xl px-2 text-[13px] cursor-pointer select-none hover:bg-gray-50/60 dark:hover:bg-gray-800/60"
on:click={() => {
downloadJSONExport();
}}
@@ -405,7 +404,7 @@
<button
draggable="false"
class="flex gap-2 items-center px-3 py-1.5 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-xl select-none w-full"
class="flex h-[1.6875rem] w-full items-center gap-2 rounded-xl px-2 text-[13px] cursor-pointer select-none hover:bg-gray-50/60 dark:hover:bg-gray-800/60"
on:click={() => {
downloadTxt();
}}
@@ -415,7 +414,7 @@
<button
draggable="false"
class="flex gap-2 items-center px-3 py-1.5 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-xl select-none w-full"
class="flex h-[1.6875rem] w-full items-center gap-2 rounded-xl px-2 text-[13px] cursor-pointer select-none hover:bg-gray-50/60 dark:hover:bg-gray-800/60"
on:click={() => {
downloadPdf();
}}
@@ -427,7 +426,7 @@
<button
draggable="false"
class="flex gap-2 items-center px-3 py-1.5 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-xl select-none w-full"
class="flex h-[1.6875rem] w-full items-center gap-2 rounded-xl px-2 text-[13px] cursor-pointer select-none hover:bg-gray-50/60 dark:hover:bg-gray-800/60"
id="chat-copy-button"
on:click={async () => {
const res = await copyToClipboard(await getChatAsText()).catch((e) => {
@@ -439,21 +438,21 @@
}
}}
>
<Clipboard className=" size-4" strokeWidth="1.5" />
<Clipboard className="size-3.5" strokeWidth="1.5" />
<div class="flex items-center">{$i18n.t('Copy')}</div>
</button>
{#if !readOnly && !$temporaryChatEnabled && chat?.id}
<hr class="border-gray-50/30 dark:border-gray-800/30 my-1" />
<hr class="border-gray-50/30 dark:border-gray-800/30 mx-1 my-0.5" />
{#if $folders.length > 0}
<DropdownSub maxWidth={200}>
<DropdownSub contentClass="select-none z-50" maxWidth={200}>
<button
slot="trigger"
draggable="false"
class="flex gap-2 items-center px-3 py-1.5 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-xl select-none w-full"
class="flex h-[1.6875rem] w-full items-center gap-2 rounded-xl px-2 text-[13px] cursor-pointer select-none hover:bg-gray-50/60 dark:hover:bg-gray-800/60"
>
<Folder strokeWidth="1.5" />
<Folder className="size-3.5" strokeWidth="1.5" />
<div class="flex items-center">{$i18n.t('Move')}</div>
</button>
@@ -461,13 +460,13 @@
{#if folder?.id}
<button
draggable="false"
class="flex gap-2 items-center px-3 py-1.5 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-xl overflow-hidden w-full"
class="flex h-[1.6875rem] w-full items-center gap-2 overflow-hidden rounded-xl px-2 text-[13px] cursor-pointer hover:bg-gray-50/60 dark:hover:bg-gray-800/60"
on:click={() => {
moveChatHandler(chat.id, folder.id);
}}
>
<div class="shrink-0">
<Folder strokeWidth="1.5" />
<Folder className="size-3.5" strokeWidth="1.5" />
</div>
<div class="truncate">{folder.name ?? 'Folder'}</div>
@@ -479,32 +478,32 @@
<button
draggable="false"
class="flex gap-2 items-center px-3 py-1.5 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-xl select-none w-full"
class="flex h-[1.6875rem] w-full items-center gap-2 rounded-xl px-2 text-[13px] cursor-pointer select-none hover:bg-gray-50/60 dark:hover:bg-gray-800/60"
on:click={() => {
archiveChatHandler();
}}
>
<ArchiveBox className="size-4" strokeWidth="1.5" />
<ArchiveBox className="size-3.5" strokeWidth="1.5" />
<div class="flex items-center">{$i18n.t('Archive')}</div>
</button>
<button
draggable="false"
class="flex gap-2 items-center px-3 py-1.5 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-xl select-none w-full"
class="flex h-[1.6875rem] w-full items-center gap-2 rounded-xl px-2 text-[13px] cursor-pointer select-none hover:bg-gray-50/60 dark:hover:bg-gray-800/60"
on:click={() => {
deleteChatHandler();
}}
>
<GarbageBin strokeWidth="1.5" />
<GarbageBin className="size-3.5" strokeWidth="1.5" />
<div class="flex items-center">{$i18n.t('Delete')}</div>
</button>
<hr class="border-gray-50/30 dark:border-gray-800/30 my-1" />
<hr class="border-gray-50/30 dark:border-gray-800/30 mx-1 my-0.5" />
<div class="flex p-1 max-h-28 overflow-y-auto">
<div class="flex max-h-28 overflow-y-auto px-2 py-1">
<Tags chatId={chat.id} />
</div>
{/if}
</div>
</DropdownMenu>
</div>
</Dropdown>