github-starred/open-webui
2
0
Fork 0
mirror of https://github.com/open-webui/open-webui.git synced 2026-05-04 03:16:03 -05:00
Code Issues 915 Packages Projects Releases 126 Wiki Activity

refac: models

Browse Source
This commit is contained in:
Timothy Jaeryang Baek
2024-11-15 18:21:41 -08:00
parent 1c16920dba
commit 9dae7d0572
11 changed files with 186 additions and 119 deletions
Download Patch File Download Diff File Expand all files Collapse all files

117
src/lib/components/workspace/Models.svelte
View File

@@ -16,6 +16,7 @@
createNewModel,
deleteModelById,
getWorkspaceModels,
toggleModelById,
updateModelById
} from '$lib/apis/models';
@@ -30,10 +31,10 @@
import Plus from '../icons/Plus.svelte';
import { get } from 'svelte/store';
import ChevronRight from '../icons/ChevronRight.svelte';
import Switch from '../common/Switch.svelte';
let shiftKey = false;
let localModelfiles = [];
let importFiles;
let modelsImportInputElement: HTMLInputElement;
@@ -255,13 +256,13 @@
>
<a
class=" flex flex-1 space-x-3.5 cursor-pointer w-full"
href={`/?models=${encodeURIComponent(model.id)}`}
href={`/?models=open-webui.${encodeURIComponent(model.id)}`}
>
<div class=" self-start w-8 pt-0.5">
<div class=" self-center w-8">
<div
class=" rounded-full object-cover {(model?.meta?.hidden ?? false)
? 'brightness-90 dark:brightness-50'
: ''} "
class=" rounded-full object-cover {model.is_active
? ''
: 'opacity-50 dark:opacity-50'} "
>
<img
src={model?.meta?.profile_image_url ?? '/static/favicon.png'}
@@ -271,7 +272,7 @@
</div>
</div>
<div class=" flex-1 self-center {(model?.meta?.hidden ?? false) ? 'text-gray-500' : ''}">
<div class=" flex-1 self-center {model.is_active ? '' : 'text-gray-500'}">
<Tooltip
content={marked.parse(model?.meta?.description ?? model.id)}
className=" w-fit"
@@ -284,57 +285,8 @@
</div>
</div>
</a>
<div class="flex flex-row gap-0.5 self-center">
{#if $user?.role === 'admin' && shiftKey}
<Tooltip
content={(model?.meta?.hidden ?? false) ? $i18n.t('Show Model') : $i18n.t('Hide Model')}
>
<button
class="self-center w-fit text-sm px-2 py-2 dark:text-gray-300 dark:hover:text-white hover:bg-black/5 dark:hover:bg-white/5 rounded-xl"
type="button"
on:click={() => {
hideModelHandler(model);
}}
>
{#if model?.meta?.hidden ?? false}
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="size-4"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M3.98 8.223A10.477 10.477 0 0 0 1.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.451 10.451 0 0 1 12 4.5c4.756 0 8.773 3.162 10.065 7.498a10.522 10.522 0 0 1-4.293 5.774M6.228 6.228 3 3m3.228 3.228 3.65 3.65m7.894 7.894L21 21m-3.228-3.228-3.65-3.65m0 0a3 3 0 1 0-4.243-4.243m4.242 4.242L9.88 9.88"
/>
</svg>
{:else}
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="size-4"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z"
/>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"
/>
</svg>
{/if}
</button>
</Tooltip>
<div class="flex flex-row gap-0.5 items-center self-center">
{#if shiftKey}
<Tooltip content={$i18n.t('Delete')}>
<button
class="self-center w-fit text-sm px-2 py-2 dark:text-gray-300 dark:hover:text-white hover:bg-black/5 dark:hover:bg-white/5 rounded-xl"
@@ -398,6 +350,18 @@
<EllipsisHorizontal className="size-5" />
</button>
</ModelMenu>
<div class="ml-1">
<Tooltip content={model.is_active ? $i18n.t('Enabled') : $i18n.t('Disabled')}>
<Switch
bind:state={model.is_active}
on:change={async (e) => {
toggleModelById(localStorage.token, model.id);
_models.set(await getModels(localStorage.token));
}}
/>
</Tooltip>
</div>
{/if}
</div>
</div>
@@ -492,43 +456,6 @@
</div>
</button>
</div>
{#if localModelfiles.length > 0}
<div class="flex">
<div class=" self-center text-sm font-medium mr-4">
{localModelfiles.length} Local Modelfiles Detected
</div>
<div class="flex space-x-1">
<button
class="self-center w-fit text-sm p-1.5 border dark:border-gray-600 rounded-xl flex"
on:click={async () => {
downloadModels(localModelfiles);
localStorage.removeItem('modelfiles');
localModelfiles = JSON.parse(localStorage.getItem('modelfiles') ?? '[]');
}}
>
<div class=" self-center">
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="w-4 h-4"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0"
/>
</svg>
</div>
</button>
</div>
</div>
{/if}
</div>
{/if}