mirror of
https://github.com/open-webui/open-webui.git
synced 2025-12-13 21:05:19 +00:00
refac
This commit is contained in:
Timothy Jaeryang Baek
parent
001dab0439
commit
8a9f862701
5 changed files with 91 additions and 61 deletions
|
|
@ -31,6 +31,7 @@
|
||||||
|
|
||||||
let url = '';
|
let url = '';
|
||||||
let key = '';
|
let key = '';
|
||||||
|
let auth_type = 'bearer';
|
||||||
|
|
||||||
let connectionType = 'external';
|
let connectionType = 'external';
|
||||||
let azure = false;
|
let azure = false;
|
||||||
|
|
@ -73,6 +74,7 @@
|
||||||
{
|
{
|
||||||
url,
|
url,
|
||||||
key,
|
key,
|
||||||
|
auth_type,
|
||||||
config: {
|
config: {
|
||||||
azure: azure,
|
azure: azure,
|
||||||
api_version: apiVersion
|
api_version: apiVersion
|
||||||
|
|
@ -140,6 +142,7 @@
|
||||||
const connection = {
|
const connection = {
|
||||||
url,
|
url,
|
||||||
key,
|
key,
|
||||||
|
auth_type,
|
||||||
config: {
|
config: {
|
||||||
enable: enable,
|
enable: enable,
|
||||||
tags: tags,
|
tags: tags,
|
||||||
|
|
@ -157,6 +160,7 @@
|
||||||
|
|
||||||
url = '';
|
url = '';
|
||||||
key = '';
|
key = '';
|
||||||
|
auth_type = 'bearer';
|
||||||
prefixId = '';
|
prefixId = '';
|
||||||
tags = [];
|
tags = [];
|
||||||
modelIds = [];
|
modelIds = [];
|
||||||
|
|
@ -167,6 +171,8 @@
|
||||||
url = connection.url;
|
url = connection.url;
|
||||||
key = connection.key;
|
key = connection.key;
|
||||||
|
|
||||||
|
auth_type = connection.auth_type ?? 'bearer';
|
||||||
|
|
||||||
enable = connection.config?.enable ?? true;
|
enable = connection.config?.enable ?? true;
|
||||||
tags = connection.config?.tags ?? [];
|
tags = connection.config?.tags ?? [];
|
||||||
prefixId = connection.config?.prefix_id ?? '';
|
prefixId = connection.config?.prefix_id ?? '';
|
||||||
|
|
@ -305,23 +311,63 @@
|
||||||
|
|
||||||
<div class="flex gap-2 mt-2">
|
<div class="flex gap-2 mt-2">
|
||||||
<div class="flex flex-col w-full">
|
<div class="flex flex-col w-full">
|
||||||
<div
|
<label
|
||||||
class={`mb-0.5 text-xs text-gray-500
|
for="select-bearer-or-session"
|
||||||
${($settings?.highContrastMode ?? false) ? 'text-gray-800 dark:text-gray-100' : ''}`}
|
class={`text-xs ${($settings?.highContrastMode ?? false) ? 'text-gray-800 dark:text-gray-100' : 'text-gray-500'}`}
|
||||||
|
>{$i18n.t('Auth')}</label
|
||||||
>
|
>
|
||||||
{$i18n.t('Key')}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="flex-1">
|
<div class="flex gap-2">
|
||||||
<SensitiveInput
|
<div class="flex-shrink-0 self-start">
|
||||||
inputClassName={`w-full text-sm bg-transparent ${($settings?.highContrastMode ?? false) ? 'placeholder:text-gray-700 dark:placeholder:text-gray-100' : 'outline-hidden placeholder:text-gray-300 dark:placeholder:text-gray-700'}`}
|
<select
|
||||||
bind:value={key}
|
id="select-bearer-or-session"
|
||||||
placeholder={$i18n.t('API Key')}
|
class={`w-full text-sm bg-transparent pr-5 ${($settings?.highContrastMode ?? false) ? 'placeholder:text-gray-700 dark:placeholder:text-gray-100' : 'outline-hidden placeholder:text-gray-300 dark:placeholder:text-gray-700'}`}
|
||||||
required={false}
|
bind:value={auth_type}
|
||||||
/>
|
>
|
||||||
|
<option value="none">{$i18n.t('None')}</option>
|
||||||
|
<option value="bearer">{$i18n.t('Bearer')}</option>
|
||||||
|
|
||||||
|
{#if !ollama}
|
||||||
|
<option value="session">{$i18n.t('Session')}</option>
|
||||||
|
{#if !direct}
|
||||||
|
<option value="oauth">{$i18n.t('OAuth')}</option>
|
||||||
|
{/if}
|
||||||
|
{/if}
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex flex-1 items-center">
|
||||||
|
{#if auth_type === 'bearer'}
|
||||||
|
<SensitiveInput
|
||||||
|
bind:value={key}
|
||||||
|
placeholder={$i18n.t('API Key')}
|
||||||
|
required={false}
|
||||||
|
/>
|
||||||
|
{:else if auth_type === 'none'}
|
||||||
|
<div
|
||||||
|
class={`text-xs self-center translate-y-[1px] ${($settings?.highContrastMode ?? false) ? 'text-gray-800 dark:text-gray-100' : 'text-gray-500'}`}
|
||||||
|
>
|
||||||
|
{$i18n.t('No authentication')}
|
||||||
|
</div>
|
||||||
|
{:else if auth_type === 'session'}
|
||||||
|
<div
|
||||||
|
class={`text-xs self-center translate-y-[1px] ${($settings?.highContrastMode ?? false) ? 'text-gray-800 dark:text-gray-100' : 'text-gray-500'}`}
|
||||||
|
>
|
||||||
|
{$i18n.t('Forwards system user session credentials to authenticate')}
|
||||||
|
</div>
|
||||||
|
{:else if auth_type === 'oauth'}
|
||||||
|
<div
|
||||||
|
class={`text-xs self-center translate-y-[1px] ${($settings?.highContrastMode ?? false) ? 'text-gray-800 dark:text-gray-100' : 'text-gray-500'}`}
|
||||||
|
>
|
||||||
|
{$i18n.t('Forwards system user OAuth access token to authenticate')}
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex gap-2 mt-2">
|
||||||
<div class="flex flex-col w-full">
|
<div class="flex flex-col w-full">
|
||||||
<label
|
<label
|
||||||
for="prefix-id-input"
|
for="prefix-id-input"
|
||||||
|
|
@ -397,35 +443,7 @@
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
<div class="flex gap-2 mt-2">
|
<hr class=" border-gray-50 dark:border-gray-850 my-2.5 w-full" />
|
||||||
<div class="flex flex-col w-full">
|
|
||||||
<div
|
|
||||||
class={`mb-0.5 text-xs text-gray-500
|
|
||||||
${($settings?.highContrastMode ?? false) ? 'text-gray-800 dark:text-gray-100' : ''}`}
|
|
||||||
>
|
|
||||||
{$i18n.t('Tags')}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="flex-1">
|
|
||||||
<Tags
|
|
||||||
bind:tags
|
|
||||||
on:add={(e) => {
|
|
||||||
tags = [
|
|
||||||
...tags,
|
|
||||||
{
|
|
||||||
name: e.detail
|
|
||||||
}
|
|
||||||
];
|
|
||||||
}}
|
|
||||||
on:delete={(e) => {
|
|
||||||
tags = tags.filter((tag) => tag.name !== e.detail);
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<hr class=" border-gray-100 dark:border-gray-700/10 my-2.5 w-full" />
|
|
||||||
|
|
||||||
<div class="flex flex-col w-full">
|
<div class="flex flex-col w-full">
|
||||||
<div class="mb-1 flex justify-between">
|
<div class="mb-1 flex justify-between">
|
||||||
|
|
@ -512,6 +530,36 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<hr class=" border-gray-50 dark:border-gray-850 my-2.5 w-full" />
|
||||||
|
|
||||||
|
<div class="flex gap-2">
|
||||||
|
<div class="flex flex-col w-full">
|
||||||
|
<div
|
||||||
|
class={`mb-0.5 text-xs text-gray-500
|
||||||
|
${($settings?.highContrastMode ?? false) ? 'text-gray-800 dark:text-gray-100' : ''}`}
|
||||||
|
>
|
||||||
|
{$i18n.t('Tags')}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex-1 mt-0.5">
|
||||||
|
<Tags
|
||||||
|
bind:tags
|
||||||
|
on:add={(e) => {
|
||||||
|
tags = [
|
||||||
|
...tags,
|
||||||
|
{
|
||||||
|
name: e.detail
|
||||||
|
}
|
||||||
|
];
|
||||||
|
}}
|
||||||
|
on:delete={(e) => {
|
||||||
|
tags = tags.filter((tag) => tag.name !== e.detail);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="flex justify-end pt-3 text-sm font-medium gap-1.5">
|
<div class="flex justify-end pt-3 text-sm font-medium gap-1.5">
|
||||||
{#if edit}
|
{#if edit}
|
||||||
<button
|
<button
|
||||||
|
|
|
||||||
|
|
@ -288,7 +288,6 @@
|
||||||
|
|
||||||
{#if !direct}
|
{#if !direct}
|
||||||
<option value="oauth">{$i18n.t('OAuth')}</option>
|
<option value="oauth">{$i18n.t('OAuth')}</option>
|
||||||
<option value="request_headers">{$i18n.t('Request Headers')}</option>
|
|
||||||
{/if}
|
{/if}
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -312,12 +311,6 @@
|
||||||
>
|
>
|
||||||
{$i18n.t('Forwards system user OAuth access token to authenticate')}
|
{$i18n.t('Forwards system user OAuth access token to authenticate')}
|
||||||
</div>
|
</div>
|
||||||
{:else if auth_type === 'request_headers'}
|
|
||||||
<div
|
|
||||||
class={`text-xs self-center translate-y-[1px] ${($settings?.highContrastMode ?? false) ? 'text-gray-800 dark:text-gray-100' : 'text-gray-500'}`}
|
|
||||||
>
|
|
||||||
{$i18n.t('Forwards system user headers to authenticate')}
|
|
||||||
</div>
|
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -71,6 +71,7 @@
|
||||||
class="w-full text-sm bg-transparent outline-hidden"
|
class="w-full text-sm bg-transparent outline-hidden"
|
||||||
placeholder={$i18n.t('Enter URL (e.g. http://localhost:11434)')}
|
placeholder={$i18n.t('Enter URL (e.g. http://localhost:11434)')}
|
||||||
bind:value={url}
|
bind:value={url}
|
||||||
|
readonly={true}
|
||||||
/>
|
/>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -69,6 +69,7 @@
|
||||||
placeholder={$i18n.t('API Base URL')}
|
placeholder={$i18n.t('API Base URL')}
|
||||||
bind:value={url}
|
bind:value={url}
|
||||||
autocomplete="off"
|
autocomplete="off"
|
||||||
|
readonly={true}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{#if pipeline}
|
{#if pipeline}
|
||||||
|
|
@ -94,13 +95,6 @@
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<SensitiveInput
|
|
||||||
inputClassName=" outline-hidden bg-transparent w-full"
|
|
||||||
placeholder={$i18n.t('API Key')}
|
|
||||||
required={false}
|
|
||||||
bind:value={key}
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -72,12 +72,6 @@
|
||||||
autocomplete="off"
|
autocomplete="off"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<SensitiveInput
|
|
||||||
inputClassName="bg-transparent w-full"
|
|
||||||
placeholder={$i18n.t('API Key')}
|
|
||||||
bind:value={key}
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue