tdpeuter/open-webui
tdpeuter/open-webui
1
Fork 0
forked from open-webui/open-webui
Code Issues Pull requests 1 Projects 1 Releases 2 Packages 1 Activity Actions

feat: frontend whitelist model selector

Browse source
This commit is contained in:
Timothy J. Baek 2024-03-09 01:50:31 -08:00
parent 219466374d
commit 6d5ff8d469
1 changed files with 64 additions and 40 deletions
Download patch file Download diff file Expand all files Collapse all files

48
src/lib/components/admin/Settings/Users.svelte
View file

@ -7,9 +7,7 @@
export let saveHandler: Function; export let saveHandler: Function;
let whitelistEnabled = false; let whitelistEnabled = false;
let whitelistModels = []; let whitelistModels = [''];
let selectedModelId = '';
let permissions = { let permissions = {
chat: { chat: {
deletion: true deletion: true
@ -102,17 +100,13 @@
{#if whitelistEnabled} {#if whitelistEnabled}
<div> <div>
<div class="flex justify-between items-center text-xs"> <div class=" space-y-1.5">
<div class=" text-xs font-medium"> {#each whitelistModels as modelId, modelIdx}
{whitelistModels.length} Model(s) Whitelisted
</div>
</div>
<div class="flex w-full"> <div class="flex w-full">
<div class="flex-1 mr-2"> <div class="flex-1 mr-2">
<select <select
class="w-full rounded-lg py-2 px-4 text-sm dark:text-gray-300 dark:bg-gray-850 outline-none" class="w-full rounded-lg py-2 px-4 text-sm dark:text-gray-300 dark:bg-gray-850 outline-none"
bind:value={selectedModelId} bind:value={modelId}
placeholder="Select a model" placeholder="Select a model"
> >
<option value="" disabled selected>Select a model</option> <option value="" disabled selected>Select a model</option>
@ -123,11 +117,14 @@
{/each} {/each}
</select> </select>
</div> </div>
{#if modelIdx === 0}
<button <button
class="px-2.5 bg-gray-100 hover:bg-gray-200 text-gray-800 dark:bg-gray-900 dark:text-white rounded-lg transition" class="px-2.5 bg-gray-100 hover:bg-gray-200 text-gray-800 dark:bg-gray-900 dark:text-white rounded-lg transition"
type="button"
on:click={() => { on:click={() => {
if (!whitelistModels.includes(selectedModelId)) { if (whitelistModels.at(-1) !== '') {
whitelistModels.push(selectedModelId); whitelistModels = [...whitelistModels, ''];
} }
}} }}
> >
@ -142,6 +139,33 @@
/> />
</svg> </svg>
</button> </button>
{:else}
<button
class="px-2.5 bg-gray-100 hover:bg-gray-200 text-gray-800 dark:bg-gray-900 dark:text-white rounded-lg transition"
type="button"
on:click={() => {
whitelistModels.splice(modelIdx, 1);
whitelistModels = whitelistModels;
}}
>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 16 16"
fill="currentColor"
class="w-4 h-4"
>
<path d="M3.75 7.25a.75.75 0 0 0 0 1.5h8.5a.75.75 0 0 0 0-1.5h-8.5Z" />
</svg>
</button>
{/if}
</div>
{/each}
</div>
<div class="flex justify-end items-center text-xs mt-1.5 text-right">
<div class=" text-xs font-medium">
{whitelistModels.length} Model(s) Whitelisted
</div>
</div> </div>
</div> </div>
{/if} {/if}