UniqAI/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui synced 2025-01-22 10:45:47 +00:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

refac: styling
Some checks failed
Deploy to HuggingFace Spaces / check-secret (push) Has been cancelled
Details
Create and publish Docker images with specific build args / build-main-image (linux/amd64) (push) Has been cancelled
Details
Create and publish Docker images with specific build args / build-main-image (linux/arm64) (push) Has been cancelled
Details
Create and publish Docker images with specific build args / build-cuda-image (linux/amd64) (push) Has been cancelled
Details
Create and publish Docker images with specific build args / build-cuda-image (linux/arm64) (push) Has been cancelled
Details
Create and publish Docker images with specific build args / build-ollama-image (linux/amd64) (push) Has been cancelled
Details
Create and publish Docker images with specific build args / build-ollama-image (linux/arm64) (push) Has been cancelled
Details
Python CI / Format Backend (3.11) (push) Has been cancelled
Details
Frontend Build / Format & Build Frontend (push) Has been cancelled
Details
Frontend Build / Frontend Unit Tests (push) Has been cancelled
Details
Integration Test / Run Cypress Integration Tests (push) Has been cancelled
Details
Integration Test / Run Migration Tests (push) Has been cancelled
Details
Deploy to HuggingFace Spaces / deploy (push) Has been cancelled
Details
Create and publish Docker images with specific build args / merge-main-images (push) Has been cancelled
Details
Create and publish Docker images with specific build args / merge-cuda-images (push) Has been cancelled
Details
Create and publish Docker images with specific build args / merge-ollama-images (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Timothy Jaeryang Baek 2025-01-19 12:46:02 -08:00
parent bdc60e7850
commit 59c349de00
4 changed files with 103 additions and 87 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/app.css
View File

@ -115,12 +115,12 @@ li p {
select {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236B7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");
background-position: right 0.5rem center;
background-position: right 0rem center;
background-repeat: no-repeat;
background-size: 1.5em 1.5em;
padding-right: 2.5rem;
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
/* padding-right: 2.5rem; */
/* for Firefox */
-moz-appearance: none;
/* for Chrome */

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

@ -26,6 +26,7 @@
import ConfirmDialog from '$lib/components/common/ConfirmDialog.svelte';
import Cog6 from '$lib/components/icons/Cog6.svelte';
import ConfigureModelsModal from './Models/ConfigureModelsModal.svelte';
import Wrench from '$lib/components/icons/Wrench.svelte';
let importFiles;
let modelsImportInputElement: HTMLInputElement;
@ -151,10 +152,22 @@
>
</div>
<div>
<div class="flex items-center">
<!-- <Tooltip content={$i18n.t('Manage')}>
<button
class=" p-1 rounded-full flex gap-1 items-center"
type="button"
on:click={() => {
showConfigModal = true;
}}
>
<Wrench />
</button>
</Tooltip> -->
<Tooltip content={$i18n.t('Configure')}>
<button
class=" px-2.5 py-1 rounded-full flex gap-1 items-center"
class=" p-1 rounded-full flex gap-1 items-center"
type="button"
on:click={() => {
showConfigModal = true;

74
src/lib/components/admin/Settings/Models/ConfigureModelsModal.svelte
View File

@ -33,6 +33,24 @@
init();
}
$: if (selectedModelId) {
onModelSelect();
}
const onModelSelect = () => {
if (selectedModelId === '') {
return;
}
if (defaultModelIds.includes(selectedModelId)) {
selectedModelId = '';
return;
}
defaultModelIds = [...defaultModelIds, selectedModelId];
selectedModelId = '';
};
const init = async () => {
config = await getModelsConfig(localStorage.token);
@ -143,6 +161,24 @@
<div class="text-xs text-gray-500">{$i18n.t('Default Models')}</div>
</div>
<div class="flex items-center -mr-1">
<select
class="w-full py-1 text-sm rounded-lg bg-transparent {selectedModelId
? ''
: 'text-gray-500'} placeholder:text-gray-300 dark:placeholder:text-gray-700 outline-none"
bind:value={selectedModelId}
>
<option value="">{$i18n.t('Select a model')}</option>
{#each $models as model}
<option value={model.id} class="bg-gray-50 dark:bg-gray-700"
>{model.name}</option
>
{/each}
</select>
</div>
<!-- <hr class=" border-gray-100 dark:border-gray-700/10 my-2.5 w-full" /> -->
{#if defaultModelIds.length > 0}
<div class="flex flex-col">
{#each defaultModelIds as modelId, modelIdx}
@ -170,44 +206,6 @@
{$i18n.t('No models selected')}
</div>
{/if}
<hr class=" border-gray-100 dark:border-gray-700/10 my-2.5 w-full" />
<div class="flex items-center">
<select
class="w-full py-1 text-sm rounded-lg bg-transparent {selectedModelId
? ''
: 'text-gray-500'} placeholder:text-gray-300 dark:placeholder:text-gray-700 outline-none"
bind:value={selectedModelId}
>
<option value="">{$i18n.t('Select a model')}</option>
{#each $models as model}
<option value={model.id} class="bg-gray-50 dark:bg-gray-700"
>{model.name}</option
>
{/each}
</select>
<div>
<button
type="button"
on:click={() => {
if (selectedModelId === '') {
return;
}
if (defaultModelIds.includes(selectedModelId)) {
return;
}
defaultModelIds = [...defaultModelIds, selectedModelId];
selectedModelId = '';
}}
>
<Plus className="size-3.5" strokeWidth="2" />
</button>
</div>
</div>
</div>
</div>

95
src/lib/components/workspace/common/AccessControl.svelte
View File

@ -37,6 +37,18 @@
});
$: onChange(accessControl);
$: if (selectedGroupId) {
onSelectGroup();
}
const onSelectGroup = () => {
if (selectedGroupId !== '') {
accessControl.read.group_ids = [...accessControl.read.group_ids, selectedGroupId];
selectedGroupId = '';
}
};
</script>
<div class=" rounded-lg flex flex-col gap-2">
@ -126,7 +138,42 @@
</div>
</div>
<div class="flex flex-col gap-2">
<div class="mb-1">
<div class="flex w-full">
<div class="flex flex-1 items-center">
<div class="w-full px-0.5">
<select
class="outline-none bg-transparent text-sm rounded-lg block w-full pr-10 max-w-full
{selectedGroupId ? '' : 'text-gray-500'}
dark:placeholder-gray-500"
bind:value={selectedGroupId}
>
<option class=" text-gray-700" value="" disabled selected
>{$i18n.t('Select a group')}</option
>
{#each groups.filter((group) => !accessControl.read.group_ids.includes(group.id)) as group}
<option class=" text-gray-700" value={group.id}>{group.name}</option>
{/each}
</select>
</div>
<!-- <div>
<Tooltip content={$i18n.t('Add Group')}>
<button
class=" p-1 rounded-xl bg-transparent dark:hover:bg-white/5 hover:bg-black/5 transition font-medium text-sm flex items-center space-x-1"
type="button"
on:click={() => {}}
>
<Plus className="size-3.5" />
</button>
</Tooltip>
</div> -->
</div>
</div>
</div>
<hr class=" border-gray-100 dark:border-gray-700/10 mt-1.5 mb-2.5 w-full" />
<div class="flex flex-col gap-2 mb-1 px-0.5">
{#if accessGroups.length > 0}
{#each accessGroups as group}
<div class="flex items-center gap-3 justify-between text-xs w-full transition">
@ -140,9 +187,9 @@
</div>
</div>
<div class="w-full flex justify-end">
<div class="w-full flex justify-end items-center gap-0.5">
<button
class=" translate-y-0.5"
class=""
type="button"
on:click={() => {
if (accessControl.write.group_ids.includes(group.id)) {
@ -188,48 +235,6 @@
{/if}
</div>
</div>
<hr class=" my-2 border-black/5 dark:border-white/5" />
<div class="mb-1">
<div class="flex w-full">
<div class="flex flex-1 items-center">
<div class="w-full">
<select
class="outline-none bg-transparent text-sm font-medium rounded-lg block w-full pr-10 max-w-full dark:placeholder-gray-700"
bind:value={selectedGroupId}
>
<option class=" text-gray-700" value="" disabled selected
>{$i18n.t('Select a group')}</option
>
{#each groups.filter((group) => !accessControl.read.group_ids.includes(group.id)) as group}
<option class=" text-gray-700" value={group.id}>{group.name}</option>
{/each}
</select>
</div>
<div>
<Tooltip content={$i18n.t('Add Group')}>
<button
class=" p-1 rounded-xl bg-transparent dark:hover:bg-white/5 hover:bg-black/5 transition font-medium text-sm flex items-center space-x-1"
type="button"
on:click={() => {
if (selectedGroupId !== '') {
accessControl.read.group_ids = [
...accessControl.read.group_ids,
selectedGroupId
];
selectedGroupId = '';
}
}}
>
<Plus className="size-3.5" />
</button>
</Tooltip>
</div>
</div>
</div>
</div>
</div>
{/if}
</div>