mirror of
https://github.com/open-webui/open-webui.git
synced 2026-11-15 09:31:21 +00:00
refac
This commit is contained in:
Timothy Jaeryang Baek
parent
517f824eb4
commit
cb83239a8a
2 changed files with 92 additions and 102 deletions
|
|
@ -58,7 +58,6 @@
|
|||
import ChatParticipants from '$lib/components/common/ChatParticipants.svelte';
|
||||
import ChatIcon from './icons/Chat.svelte';
|
||||
import MoreHorizontalIcon from './icons/MoreHorizontal.svelte';
|
||||
import EditPencilIcon from './icons/EditPencil.svelte';
|
||||
import SparklesIcon from './icons/Sparkles.svelte';
|
||||
import ArchiveBoxIcon from '$lib/components/icons/ArchiveBox.svelte';
|
||||
import GarbageBinIcon from '$lib/components/icons/GarbageBin.svelte';
|
||||
|
|
@ -773,7 +772,7 @@
|
|||
</div>
|
||||
{/if}
|
||||
|
||||
{#if (!readonly || canRename) && !selecting}
|
||||
{#if (!readonly || (canRename && !confirmEdit)) && !selecting}
|
||||
<div
|
||||
id="sidebar-chat-item-menu"
|
||||
class="{$mobile
|
||||
|
|
@ -784,20 +783,7 @@
|
|||
? 'right-[0.5rem]'
|
||||
: 'right-1'} inset-y-0 mr-1.5 flex items-center"
|
||||
>
|
||||
{#if readonly}
|
||||
{#if !confirmEdit}
|
||||
<Tooltip content={$i18n.t('Rename')} className="flex self-center z-10 items-end">
|
||||
<button
|
||||
type="button"
|
||||
aria-label={$i18n.t('Rename')}
|
||||
class="flex size-5 items-center justify-center self-center dark:hover:text-white transition"
|
||||
on:click={renameHandler}
|
||||
>
|
||||
<EditPencilIcon className="size-3.5" strokeWidth="1.5" />
|
||||
</button>
|
||||
</Tooltip>
|
||||
{/if}
|
||||
{:else if confirmEdit}
|
||||
{#if confirmEdit}
|
||||
<div
|
||||
class="flex self-center items-center space-x-1.5 z-10 translate-y-[0.5px] -translate-x-[0.5px]"
|
||||
>
|
||||
|
|
@ -814,7 +800,7 @@
|
|||
</button>
|
||||
</Tooltip>
|
||||
</div>
|
||||
{:else if shiftKey && mouseOver && !chatSelection}
|
||||
{:else if !readonly && shiftKey && mouseOver && !chatSelection}
|
||||
<div class=" flex items-center self-center space-x-1.5">
|
||||
{#if $visibleControls['chat.archive']}
|
||||
<Tooltip content={$i18n.t('Archive')} className="flex items-center">
|
||||
|
|
@ -849,6 +835,7 @@
|
|||
{:else}
|
||||
<div class="flex self-center z-10 items-end">
|
||||
<ChatMenu
|
||||
{readonly}
|
||||
chatId={id}
|
||||
cloneChatHandler={() => {
|
||||
cloneChatHandler(id);
|
||||
|
|
|
|||
|
|
@ -44,6 +44,7 @@
|
|||
|
||||
export let chatId = '';
|
||||
export let archived = false;
|
||||
export let readonly = false;
|
||||
|
||||
let show = false;
|
||||
let pinned = false;
|
||||
|
|
@ -305,7 +306,7 @@
|
|||
}
|
||||
};
|
||||
|
||||
$: if (show) {
|
||||
$: if (show && !readonly) {
|
||||
checkPinned();
|
||||
}
|
||||
</script>
|
||||
|
|
@ -348,7 +349,7 @@
|
|||
|
||||
<div slot="content">
|
||||
<DropdownMenu className="select-none min-w-[12.5rem] transition">
|
||||
{#if $user?.role === 'admin' || ($user.permissions?.chat?.share ?? true)}
|
||||
{#if !readonly && ($user?.role === 'admin' || ($user.permissions?.chat?.share ?? true))}
|
||||
<button
|
||||
role="menuitem"
|
||||
draggable="false"
|
||||
|
|
@ -362,7 +363,7 @@
|
|||
</button>
|
||||
{/if}
|
||||
|
||||
{#if $user?.role === 'admin' || ($user.permissions?.chat?.export ?? true)}
|
||||
{#if !readonly && ($user?.role === 'admin' || ($user.permissions?.chat?.export ?? true))}
|
||||
<DropdownSub contentClass="select-none z-50">
|
||||
<button
|
||||
role="menuitem"
|
||||
|
|
@ -421,110 +422,112 @@
|
|||
<div class="flex items-center">{$i18n.t('Rename')}</div>
|
||||
</button>
|
||||
|
||||
<button
|
||||
role="menuitem"
|
||||
draggable="false"
|
||||
class="flex h-[1.6875rem] gap-2 items-center rounded-xl px-2 text-[0.8125rem] cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-900 w-full"
|
||||
on:click={() => {
|
||||
markUnreadHandler();
|
||||
}}
|
||||
>
|
||||
<ChatCheckIcon className="size-3.5" strokeWidth="1.5" />
|
||||
<div class="flex items-center">{$i18n.t('Mark as unread')}</div>
|
||||
</button>
|
||||
|
||||
<hr class="border-gray-50/30 dark:border-gray-800/30 mx-1 my-0.5" />
|
||||
|
||||
<button
|
||||
role="menuitem"
|
||||
draggable="false"
|
||||
class="flex h-[1.6875rem] gap-2 items-center rounded-xl px-2 text-[0.8125rem] cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-900 w-full"
|
||||
on:click={() => {
|
||||
pinHandler();
|
||||
}}
|
||||
>
|
||||
{#if pinned}
|
||||
<PinSlashIcon className="size-3.5" strokeWidth="1.5" />
|
||||
<div class="flex items-center">{$i18n.t('Unpin')}</div>
|
||||
{:else}
|
||||
<PinIcon className="size-3.5" strokeWidth="1.5" />
|
||||
<div class="flex items-center">{$i18n.t('Pin')}</div>
|
||||
{/if}
|
||||
</button>
|
||||
|
||||
{#if $user?.role === 'admin' || ($user?.permissions?.chat?.import ?? true)}
|
||||
{#if !readonly}
|
||||
<button
|
||||
role="menuitem"
|
||||
draggable="false"
|
||||
class="flex h-[1.6875rem] gap-2 items-center rounded-xl px-2 text-[0.8125rem] cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-900 w-full"
|
||||
on:click={() => {
|
||||
cloneChatHandler();
|
||||
markUnreadHandler();
|
||||
}}
|
||||
>
|
||||
<CopyIcon className="size-3.5" strokeWidth="1.5" />
|
||||
<div class="flex items-center">{$i18n.t('Clone')}</div>
|
||||
<ChatCheckIcon className="size-3.5" strokeWidth="1.5" />
|
||||
<div class="flex items-center">{$i18n.t('Mark as unread')}</div>
|
||||
</button>
|
||||
{/if}
|
||||
|
||||
{#if chatId && $folders.length > 0}
|
||||
<DropdownSub contentClass="select-none z-50 max-h-52 overflow-y-auto scrollbar-hidden">
|
||||
<hr class="border-gray-50/30 dark:border-gray-800/30 mx-1 my-0.5" />
|
||||
|
||||
<button
|
||||
role="menuitem"
|
||||
draggable="false"
|
||||
class="flex h-[1.6875rem] gap-2 items-center rounded-xl px-2 text-[0.8125rem] cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-900 w-full"
|
||||
on:click={() => {
|
||||
pinHandler();
|
||||
}}
|
||||
>
|
||||
{#if pinned}
|
||||
<PinSlashIcon className="size-3.5" strokeWidth="1.5" />
|
||||
<div class="flex items-center">{$i18n.t('Unpin')}</div>
|
||||
{:else}
|
||||
<PinIcon className="size-3.5" strokeWidth="1.5" />
|
||||
<div class="flex items-center">{$i18n.t('Pin')}</div>
|
||||
{/if}
|
||||
</button>
|
||||
|
||||
{#if $user?.role === 'admin' || ($user?.permissions?.chat?.import ?? true)}
|
||||
<button
|
||||
role="menuitem"
|
||||
slot="trigger"
|
||||
draggable="false"
|
||||
class="flex h-[1.6875rem] gap-2 items-center rounded-xl px-2 text-[0.8125rem] cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-900 select-none w-full"
|
||||
class="flex h-[1.6875rem] gap-2 items-center rounded-xl px-2 text-[0.8125rem] cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-900 w-full"
|
||||
on:click={() => {
|
||||
cloneChatHandler();
|
||||
}}
|
||||
>
|
||||
<FolderIcon className="size-3.5" />
|
||||
<div class="flex items-center">{$i18n.t('Move')}</div>
|
||||
<CopyIcon className="size-3.5" strokeWidth="1.5" />
|
||||
<div class="flex items-center">{$i18n.t('Clone')}</div>
|
||||
</button>
|
||||
{/if}
|
||||
|
||||
{#each $folders.sort((a, b) => b.updated_at - a.updated_at) as folder}
|
||||
{#if chatId && $folders.length > 0}
|
||||
<DropdownSub contentClass="select-none z-50 max-h-52 overflow-y-auto scrollbar-hidden">
|
||||
<button
|
||||
role="menuitem"
|
||||
slot="trigger"
|
||||
draggable="false"
|
||||
class="flex h-[1.6875rem] gap-2 items-center rounded-xl px-2 text-[0.8125rem] cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-900 overflow-hidden w-full"
|
||||
on:click={() => {
|
||||
moveChatHandler(chatId, folder.id);
|
||||
}}
|
||||
class="flex h-[1.6875rem] gap-2 items-center rounded-xl px-2 text-[0.8125rem] cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-900 select-none w-full"
|
||||
>
|
||||
<div class="shrink-0">
|
||||
<FolderIcon className="size-3.5" />
|
||||
</div>
|
||||
|
||||
<div class="truncate">{folder?.name ?? 'Folder'}</div>
|
||||
<FolderIcon className="size-3.5" />
|
||||
<div class="flex items-center">{$i18n.t('Move')}</div>
|
||||
</button>
|
||||
{/each}
|
||||
</DropdownSub>
|
||||
{/if}
|
||||
|
||||
{#if $visibleControls['chat.archive']}
|
||||
<button
|
||||
role="menuitem"
|
||||
draggable="false"
|
||||
class="flex h-[1.6875rem] gap-2 items-center rounded-xl px-2 text-[0.8125rem] cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-900 w-full"
|
||||
on:click={() => {
|
||||
archiveChatHandler();
|
||||
}}
|
||||
>
|
||||
<ArchiveBoxIcon className="size-3.5" strokeWidth="1.7" />
|
||||
<div class="flex items-center">
|
||||
{archived ? $i18n.t('Unarchive') : $i18n.t('Archive')}
|
||||
</div>
|
||||
</button>
|
||||
{/if}
|
||||
{#each $folders.sort((a, b) => b.updated_at - a.updated_at) as folder}
|
||||
<button
|
||||
role="menuitem"
|
||||
draggable="false"
|
||||
class="flex h-[1.6875rem] gap-2 items-center rounded-xl px-2 text-[0.8125rem] cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-900 overflow-hidden w-full"
|
||||
on:click={() => {
|
||||
moveChatHandler(chatId, folder.id);
|
||||
}}
|
||||
>
|
||||
<div class="shrink-0">
|
||||
<FolderIcon className="size-3.5" />
|
||||
</div>
|
||||
|
||||
{#if $user?.role === 'admin' || ($user?.permissions?.chat?.delete ?? true)}
|
||||
<button
|
||||
role="menuitem"
|
||||
draggable="false"
|
||||
class="flex h-[1.6875rem] gap-2 items-center rounded-xl px-2 text-[0.8125rem] cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-900 w-full"
|
||||
on:click={() => {
|
||||
deleteHandler();
|
||||
}}
|
||||
>
|
||||
<TrashIcon className="size-3.5" strokeWidth="1.5" />
|
||||
<div class="flex items-center">{$i18n.t('Delete')}</div>
|
||||
</button>
|
||||
<div class="truncate">{folder?.name ?? 'Folder'}</div>
|
||||
</button>
|
||||
{/each}
|
||||
</DropdownSub>
|
||||
{/if}
|
||||
|
||||
{#if $visibleControls['chat.archive']}
|
||||
<button
|
||||
role="menuitem"
|
||||
draggable="false"
|
||||
class="flex h-[1.6875rem] gap-2 items-center rounded-xl px-2 text-[0.8125rem] cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-900 w-full"
|
||||
on:click={() => {
|
||||
archiveChatHandler();
|
||||
}}
|
||||
>
|
||||
<ArchiveBoxIcon className="size-3.5" strokeWidth="1.7" />
|
||||
<div class="flex items-center">
|
||||
{archived ? $i18n.t('Unarchive') : $i18n.t('Archive')}
|
||||
</div>
|
||||
</button>
|
||||
{/if}
|
||||
|
||||
{#if $user?.role === 'admin' || ($user?.permissions?.chat?.delete ?? true)}
|
||||
<button
|
||||
role="menuitem"
|
||||
draggable="false"
|
||||
class="flex h-[1.6875rem] gap-2 items-center rounded-xl px-2 text-[0.8125rem] cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-900 w-full"
|
||||
on:click={() => {
|
||||
deleteHandler();
|
||||
}}
|
||||
>
|
||||
<TrashIcon className="size-3.5" strokeWidth="1.5" />
|
||||
<div class="flex items-center">{$i18n.t('Delete')}</div>
|
||||
</button>
|
||||
{/if}
|
||||
{/if}
|
||||
</DropdownMenu>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue