ti.sil/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui.git synced 2026-01-02 06:35:20 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

feat: add sidebar toggle to workspace and admin models pages (#20176)

Browse source
This commit is contained in:
G30 2025-12-28 15:45:45 -05:00 committed by GitHub
parent 3994d88c90
commit 9a9b5ef699
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 89 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
src/lib/components/admin/Settings/Models.svelte
View file

@ -17,6 +17,7 @@
} from '$lib/apis/models';
import { copyToClipboard } from '$lib/utils';
import { page } from '$app/stores';
import { updateUserSettings } from '$lib/apis/users';
import { getModels } from '$lib/apis';
import Search from '$lib/components/icons/Search.svelte';
@ -218,6 +219,19 @@
saveAs(blob, `${model.id}-${Date.now()}.json`);
};
const pinModelHandler = async (modelId) => {
let pinnedModels = $settings?.pinnedModels ?? [];
if (pinnedModels.includes(modelId)) {
pinnedModels = pinnedModels.filter((id) => id !== modelId);
} else {
pinnedModels = [...new Set([...pinnedModels, modelId])];
}
settings.set({ ...$settings, pinnedModels: pinnedModels });
await updateUserSettings(localStorage.token, { ui: $settings });
};
onMount(async () => {
await init();
const id = $page.url.searchParams.get('id');
@ -427,6 +441,9 @@
hideHandler={() => {
hideModelHandler(model);
}}
pinModelHandler={() => {
pinModelHandler(model.id);
}}
copyLinkHandler={() => {
copyLinkHandler(model);
}}

26
src/lib/components/admin/Settings/Models/ModelMenu.svelte
View file

@ -13,8 +13,10 @@
import DocumentDuplicate from '$lib/components/icons/DocumentDuplicate.svelte';
import Download from '$lib/components/icons/Download.svelte';
import ArrowUpCircle from '$lib/components/icons/ArrowUpCircle.svelte';
import Pin from '$lib/components/icons/Pin.svelte';
import PinSlash from '$lib/components/icons/PinSlash.svelte';
import { config } from '$lib/stores';
import { config, settings } from '$lib/stores';
import Link from '$lib/components/icons/Link.svelte';
const i18n = getContext('i18n');
@ -24,6 +26,7 @@
export let exportHandler: Function;
export let hideHandler: Function;
export let pinModelHandler: Function;
export let copyLinkHandler: Function;
export let cloneHandler: Function;
@ -104,6 +107,27 @@
</div>
</DropdownMenu.Item>
<DropdownMenu.Item
class="flex gap-2 items-center px-3 py-1.5 text-sm font-medium cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-md"
on:click={() => {
pinModelHandler(model?.id);
}}
>
{#if ($settings?.pinnedModels ?? []).includes(model?.id)}
<PinSlash />
{:else}
<Pin />
{/if}
<div class="flex items-center">
{#if ($settings?.pinnedModels ?? []).includes(model?.id)}
{$i18n.t('Hide from Sidebar')}
{:else}
{$i18n.t('Keep in Sidebar')}
{/if}
</div>
</DropdownMenu.Item>
<DropdownMenu.Item
class="flex gap-2 items-center px-3 py-1.5 text-sm font-medium cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-md"
on:click={() => {

9
src/lib/components/chat/ModelSelector/ModelItemMenu.svelte
View file

@ -5,9 +5,10 @@
import { getContext } from 'svelte';
import Tooltip from '$lib/components/common/Tooltip.svelte';
import Pin from '$lib/components/icons/Pin.svelte';
import PinSlash from '$lib/components/icons/PinSlash.svelte';
import DocumentDuplicate from '$lib/components/icons/DocumentDuplicate.svelte';
import Link from '$lib/components/icons/Link.svelte';
import Eye from '$lib/components/icons/Eye.svelte';
import EyeSlash from '$lib/components/icons/EyeSlash.svelte';
import { settings } from '$lib/stores';
const i18n = getContext('i18n');
@ -63,9 +64,9 @@
}}
>
{#if ($settings?.pinnedModels ?? []).includes(model?.id)}
<EyeSlash />
<PinSlash />
{:else}
<Eye />
<Pin />
{/if}
<div class="flex items-center">

17
src/lib/components/workspace/Models.svelte
View file

@ -24,6 +24,7 @@
import { getModels } from '$lib/apis';
import { getGroups } from '$lib/apis/groups';
import { updateUserSettings } from '$lib/apis/users';
import { capitalizeFirstLetter, copyToClipboard } from '$lib/utils';
@ -215,6 +216,19 @@
saveAs(blob, `${model.id}-${Date.now()}.json`);
};
const pinModelHandler = async (modelId) => {
let pinnedModels = $settings?.pinnedModels ?? [];
if (pinnedModels.includes(modelId)) {
pinnedModels = pinnedModels.filter((id) => id !== modelId);
} else {
pinnedModels = [...new Set([...pinnedModels, modelId])];
}
settings.set({ ...$settings, pinnedModels: pinnedModels });
await updateUserSettings(localStorage.token, { ui: $settings });
};
onMount(async () => {
viewOption = localStorage.workspaceViewOption ?? '';
page = 1;
@ -547,6 +561,9 @@
hideHandler={() => {
hideModelHandler(model);
}}
pinModelHandler={() => {
pinModelHandler(model.id);
}}
copyLinkHandler={() => {
copyLinkHandler(model);
}}

26
src/lib/components/workspace/Models/ModelMenu.svelte
View file

@ -13,8 +13,10 @@
import DocumentDuplicate from '$lib/components/icons/DocumentDuplicate.svelte';
import Download from '$lib/components/icons/Download.svelte';
import ArrowUpCircle from '$lib/components/icons/ArrowUpCircle.svelte';
import Pin from '$lib/components/icons/Pin.svelte';
import PinSlash from '$lib/components/icons/PinSlash.svelte';
import { config, user as currentUser } from '$lib/stores';
import { config, user as currentUser, settings } from '$lib/stores';
import Link from '$lib/components/icons/Link.svelte';
const i18n = getContext('i18n');
@ -29,6 +31,7 @@
export let copyLinkHandler: Function;
export let hideHandler: Function;
export let pinModelHandler: Function;
export let deleteHandler: Function;
export let onClose: Function;
@ -124,6 +127,27 @@
</div>
</DropdownMenu.Item>
<DropdownMenu.Item
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"
on:click={() => {
pinModelHandler(model?.id);
}}
>
{#if ($settings?.pinnedModels ?? []).includes(model?.id)}
<PinSlash />
{:else}
<Pin />
{/if}
<div class="flex items-center">
{#if ($settings?.pinnedModels ?? []).includes(model?.id)}
{$i18n.t('Hide from Sidebar')}
{:else}
{$i18n.t('Keep in Sidebar')}
{/if}
</div>
</DropdownMenu.Item>
<DropdownMenu.Item
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"
on:click={() => {