ti.sil/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui.git synced 2025-12-13 21:05:19 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

refac: images

Browse source
This commit is contained in:
Timothy Jaeryang Baek 2025-11-05 00:54:25 -05:00
parent 314cac0113
commit 72900cd686
12 changed files with 660 additions and 477 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/lib/components/admin/Settings/Audio.svelte
View file

@ -210,7 +210,7 @@
<div class=" space-y-3 overflow-y-scroll scrollbar-hidden h-full"> <div class=" space-y-3 overflow-y-scroll scrollbar-hidden h-full">
<div class="flex flex-col gap-3"> <div class="flex flex-col gap-3">
<div> <div>
<div class=" mb-2.5 text-base font-medium">{$i18n.t('Speech-to-Text')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('Speech-to-Text')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />
@ -498,7 +498,7 @@
</div> </div>
<div> <div>
<div class=" mb-2.5 text-base font-medium">{$i18n.t('Text-to-Speech')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('Text-to-Speech')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />

4
src/lib/components/admin/Settings/CodeExecution.svelte
View file

@ -41,7 +41,7 @@
{#if config} {#if config}
<div> <div>
<div class="mb-3.5"> <div class="mb-3.5">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('General')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('General')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />
@ -164,7 +164,7 @@
</div> </div>
<div class="mb-3.5"> <div class="mb-3.5">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('Code Interpreter')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('Code Interpreter')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />

2
src/lib/components/admin/Settings/Connections.svelte
View file

@ -219,7 +219,7 @@
<div class=" overflow-y-scroll scrollbar-hidden h-full"> <div class=" overflow-y-scroll scrollbar-hidden h-full">
{#if ENABLE_OPENAI_API !== null && ENABLE_OLLAMA_API !== null && connectionsConfig !== null} {#if ENABLE_OPENAI_API !== null && ENABLE_OLLAMA_API !== null && connectionsConfig !== null}
<div class="mb-3.5"> <div class="mb-3.5">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('General')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('General')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />

12
src/lib/components/admin/Settings/Documents.svelte
View file

@ -317,7 +317,7 @@
<div class=" space-y-2.5 overflow-y-scroll scrollbar-hidden h-full pr-1.5"> <div class=" space-y-2.5 overflow-y-scroll scrollbar-hidden h-full pr-1.5">
<div class=""> <div class="">
<div class="mb-3"> <div class="mb-3">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('General')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('General')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />
@ -914,7 +914,7 @@
{#if !RAGConfig.BYPASS_EMBEDDING_AND_RETRIEVAL} {#if !RAGConfig.BYPASS_EMBEDDING_AND_RETRIEVAL}
<div class="mb-3"> <div class="mb-3">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('Embedding')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('Embedding')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />
@ -1089,7 +1089,7 @@
</div> </div>
<div class="mb-3"> <div class="mb-3">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('Retrieval')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('Retrieval')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />
@ -1332,7 +1332,7 @@
{/if} {/if}
<div class="mb-3"> <div class="mb-3">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('Files')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('Files')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />
@ -1444,7 +1444,7 @@
</div> </div>
<div class="mb-3"> <div class="mb-3">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('Integration')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('Integration')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />
@ -1464,7 +1464,7 @@
</div> </div>
<div class="mb-3"> <div class="mb-3">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('Danger Zone')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('Danger Zone')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />

4
src/lib/components/admin/Settings/Evaluations.svelte
View file

@ -104,7 +104,7 @@
{#if evaluationConfig !== null} {#if evaluationConfig !== null}
<div class=""> <div class="">
<div class="mb-3"> <div class="mb-3">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('General')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('General')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />
@ -119,7 +119,7 @@
{#if evaluationConfig.ENABLE_EVALUATION_ARENA_MODELS} {#if evaluationConfig.ENABLE_EVALUATION_ARENA_MODELS}
<div class="mb-3"> <div class="mb-3">
<div class=" mb-2.5 text-base font-medium flex justify-between items-center"> <div class=" mt-0.5 mb-2.5 text-base font-medium flex justify-between items-center">
<div> <div>
{$i18n.t('Manage')} {$i18n.t('Manage')}
</div> </div>

8
src/lib/components/admin/Settings/General.svelte
View file

@ -118,11 +118,11 @@
updateHandler(); updateHandler();
}} }}
> >
<div class="mt-0.5 space-y-3 overflow-y-scroll scrollbar-hidden h-full"> <div class="space-y-3 overflow-y-scroll scrollbar-hidden h-full">
{#if adminConfig !== null} {#if adminConfig !== null}
<div class=""> <div class="">
<div class="mb-3.5"> <div class="mb-3.5">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('General')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('General')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />
@ -280,7 +280,7 @@
</div> </div>
<div class="mb-3"> <div class="mb-3">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('Authentication')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('Authentication')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />
@ -637,7 +637,7 @@
</div> </div>
<div class="mb-3"> <div class="mb-3">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('Features')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('Features')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />

996
src/lib/components/admin/Settings/Images.svelte
View file

File diff suppressed because it is too large Load diff

4
src/lib/components/admin/Settings/Interface.svelte
View file

@ -111,7 +111,7 @@
> >
<div class=" overflow-y-scroll scrollbar-hidden h-full pr-1.5"> <div class=" overflow-y-scroll scrollbar-hidden h-full pr-1.5">
<div class="mb-3.5"> <div class="mb-3.5">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('Tasks')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('Tasks')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />
@ -384,7 +384,7 @@
</div> </div>
<div class="mb-3.5"> <div class="mb-3.5">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('UI')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('UI')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />

2
src/lib/components/admin/Settings/Tools.svelte
View file

@ -59,7 +59,7 @@
{#if servers !== null} {#if servers !== null}
<div class=""> <div class="">
<div class="mb-3"> <div class="mb-3">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('General')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('General')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />

4
src/lib/components/admin/Settings/WebSearch.svelte
View file

@ -95,7 +95,7 @@
{#if webConfig} {#if webConfig}
<div class=""> <div class="">
<div class="mb-3"> <div class="mb-3">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('General')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('General')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />
@ -724,7 +724,7 @@
</div> </div>
<div class="mb-3"> <div class="mb-3">
<div class=" mb-2.5 text-base font-medium">{$i18n.t('Loader')}</div> <div class=" mt-0.5 mb-2.5 text-base font-medium">{$i18n.t('Loader')}</div>
<hr class=" border-gray-100 dark:border-gray-850 my-2" /> <hr class=" border-gray-100 dark:border-gray-850 my-2" />

65
src/lib/components/common/CodeEditorModal.svelte Normal file
View file

@ -0,0 +1,65 @@
<script lang="ts">
import { onMount, getContext } from 'svelte';
import CodeEditor from './CodeEditor.svelte';
import Drawer from './Drawer.svelte';
const i18n = getContext('i18n');
let {
show = $bindable(),
value = $bindable(),
lang = 'python',
onChange = () => {},
onSave = () => {}
} = $props();
let boilerplate = ``;
let codeEditor = $state(null);
let _content = $state(value);
$effect(() => {
if (_content) {
value = _content;
}
});
</script>
<Drawer bind:show>
<div class="flex h-full flex-col">
<div
class=" sticky top-0 z-30 flex justify-between bg-white px-4.5 pt-3 pb-3 dark:bg-gray-900 dark:text-gray-100"
>
<div class=" font-primary self-center text-lg font-medium">
{$i18n.t('Code Editor')}
</div>
<button
class="self-center"
aria-label="Close"
onclick={() => {
show = false;
}}
>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
class="h-5 w-5"
>
<path
d="M6.28 5.22a.75.75 0 00-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 101.06 1.06L10 11.06l3.72 3.72a.75.75 0 101.06-1.06L11.06 10l3.72-3.72a.75.75 0 00-1.06-1.06L10 8.94 6.28 5.22z"
/>
</svg>
</button>
</div>
<div
class="flex h-full w-full flex-1 flex-col md:flex-row md:space-x-4 dark:text-gray-200 overflow-y-auto"
>
<div class=" flex h-full w-full flex-col sm:flex-row sm:justify-center sm:space-x-6">
<CodeEditor bind:this={codeEditor} {value} {boilerplate} {lang} {onChange} {onSave} />
</div>
</div>
</div>
</Drawer>

32
src/lib/components/common/Drawer.svelte
View file

@ -2,7 +2,6 @@
import { onDestroy, onMount } from 'svelte'; import { onDestroy, onMount } from 'svelte';
import { flyAndScale } from '$lib/utils/transitions'; import { flyAndScale } from '$lib/utils/transitions';
import { fade, fly, slide } from 'svelte/transition'; import { fade, fly, slide } from 'svelte/transition';
import { isApp } from '$lib/stores';
export let show = false; export let show = false;
export let className = ''; export let className = '';
@ -54,26 +53,25 @@
<!-- svelte-ignore a11y-click-events-have-key-events --> <!-- svelte-ignore a11y-click-events-have-key-events -->
<!-- svelte-ignore a11y-no-static-element-interactions --> <!-- svelte-ignore a11y-no-static-element-interactions -->
{#if show}
<div
bind:this={modalElement}
class="modal fixed right-0 {$isApp
? ' ml-[4.5rem] max-w-[calc(100%-4.5rem)]'
: ''} left-0 bottom-0 bg-black/60 w-full h-screen max-h-[100dvh] flex justify-center z-999 overflow-hidden overscroll-contain"
in:fly={{ y: 100, duration: 100 }}
on:mousedown={() => {
show = false;
}}
>
<div <div
class=" mt-auto w-full bg-gray-50 dark:bg-gray-900 dark:text-gray-100 {className} max-h-[100dvh] overflow-y-auto scrollbar-hidden" bind:this={modalElement}
on:mousedown={(e) => { class="modal fixed right-0 bottom-0 left-0 z-999 flex h-screen max-h-[100dvh] w-full justify-center overflow-hidden overscroll-contain bg-black/60"
e.stopPropagation(); in:fly={{ y: 100, duration: 100 }}
on:mousedown={() => {
show = false;
}} }}
> >
<slot /> <div
class=" mt-auto w-full bg-gray-50 dark:bg-gray-900 dark:text-gray-100 {className} scrollbar-hidden max-h-[100dvh] overflow-y-auto"
on:mousedown={(e) => {
e.stopPropagation();
}}
>
<slot />
</div>
</div> </div>
</div> {/if}
<style> <style>
.modal-content { .modal-content {