From 8daa549146a47c6c7a5ca0ca5dffbf815bfb967c Mon Sep 17 00:00:00 2001 From: Timothy Jaeryang Baek Date: Tue, 11 Feb 2025 23:12:00 -0800 Subject: [PATCH] refac --- backend/open_webui/config.py | 8 +- backend/open_webui/main.py | 10 +- backend/open_webui/routers/configs.py | 20 +-- src/lib/apis/configs/index.ts | 8 +- .../AddConnectionModal.svelte | 0 .../admin/Settings/Connections.svelte | 34 +++--- .../Connections/OllamaConnection.svelte | 2 +- .../Connections/OpenAIConnection.svelte | 3 +- .../chat/Settings/Connections.svelte | 114 ++++++++++++++++++ .../Settings/Connections/Connection.svelte | 106 ++++++++++++++++ src/lib/components/chat/SettingsModal.svelte | 41 ++++++- 11 files changed, 306 insertions(+), 40 deletions(-) rename src/lib/components/{admin/Settings/Connections => }/AddConnectionModal.svelte (100%) create mode 100644 src/lib/components/chat/Settings/Connections.svelte create mode 100644 src/lib/components/chat/Settings/Connections/Connection.svelte diff --git a/backend/open_webui/config.py b/backend/open_webui/config.py index 3cc2d49bc..ff298dc5b 100644 --- a/backend/open_webui/config.py +++ b/backend/open_webui/config.py @@ -685,13 +685,13 @@ Path(CACHE_DIR).mkdir(parents=True, exist_ok=True) #################################### -# DIRECT API +# DIRECT CONNECTIONS #################################### -ENABLE_DIRECT_API = PersistentConfig( - "ENABLE_DIRECT_API", +ENABLE_DIRECT_CONNECTIONS = PersistentConfig( + "ENABLE_DIRECT_CONNECTIONS", "direct.enable", - os.environ.get("ENABLE_DIRECT_API", "True").lower() == "true", + os.environ.get("ENABLE_DIRECT_CONNECTIONS", "True").lower() == "true", ) #################################### diff --git a/backend/open_webui/main.py b/backend/open_webui/main.py index 72a314c01..1de0348c3 100644 --- a/backend/open_webui/main.py +++ b/backend/open_webui/main.py @@ -97,8 +97,8 @@ from open_webui.config import ( OPENAI_API_BASE_URLS, OPENAI_API_KEYS, OPENAI_API_CONFIGS, - # Direct API - ENABLE_DIRECT_API, + # Direct Connections + ENABLE_DIRECT_CONNECTIONS, # Code Interpreter ENABLE_CODE_INTERPRETER, CODE_INTERPRETER_ENGINE, @@ -407,11 +407,11 @@ app.state.OPENAI_MODELS = {} ######################################## # -# DIRECT API +# DIRECT CONNECTIONS # ######################################## -app.state.config.ENABLE_DIRECT_API = ENABLE_DIRECT_API +app.state.config.ENABLE_DIRECT_CONNECTIONS = ENABLE_DIRECT_CONNECTIONS ######################################## # @@ -1056,7 +1056,7 @@ async def get_app_config(request: Request): "enable_websocket": ENABLE_WEBSOCKET_SUPPORT, **( { - "enable_direct_api": app.state.config.ENABLE_DIRECT_API, + "enable_direct_connections": app.state.config.ENABLE_DIRECT_CONNECTIONS, "enable_channels": app.state.config.ENABLE_CHANNELS, "enable_web_search": app.state.config.ENABLE_RAG_WEB_SEARCH, "enable_code_interpreter": app.state.config.ENABLE_CODE_INTERPRETER, diff --git a/backend/open_webui/routers/configs.py b/backend/open_webui/routers/configs.py index 9156a99e6..1759c9f30 100644 --- a/backend/open_webui/routers/configs.py +++ b/backend/open_webui/routers/configs.py @@ -37,28 +37,30 @@ async def export_config(user=Depends(get_admin_user)): ############################ -# Direct API Config +# Direct Connections Config ############################ class DirectAPIConfigForm(BaseModel): - ENABLE_DIRECT_API: bool + ENABLE_DIRECT_CONNECTIONS: bool -@router.get("/direct_api", response_model=DirectAPIConfigForm) -async def get_direct_api_config(request: Request, user=Depends(get_admin_user)): +@router.get("/direct_connections", response_model=DirectAPIConfigForm) +async def get_direct_connections_config(request: Request, user=Depends(get_admin_user)): return { - "ENABLE_DIRECT_API": request.app.state.config.ENABLE_DIRECT_API, + "ENABLE_DIRECT_CONNECTIONS": request.app.state.config.ENABLE_DIRECT_CONNECTIONS, } -@router.post("/direct_api", response_model=DirectAPIConfigForm) -async def set_direct_api_config( +@router.post("/direct_connections", response_model=DirectAPIConfigForm) +async def set_direct_connections_config( request: Request, form_data: DirectAPIConfigForm, user=Depends(get_admin_user) ): - request.app.state.config.ENABLE_DIRECT_API = form_data.ENABLE_DIRECT_API + request.app.state.config.ENABLE_DIRECT_CONNECTIONS = ( + form_data.ENABLE_DIRECT_CONNECTIONS + ) return { - "ENABLE_DIRECT_API": request.app.state.config.ENABLE_DIRECT_API, + "ENABLE_DIRECT_CONNECTIONS": request.app.state.config.ENABLE_DIRECT_CONNECTIONS, } diff --git a/src/lib/apis/configs/index.ts b/src/lib/apis/configs/index.ts index 22620c0c3..d7f02564c 100644 --- a/src/lib/apis/configs/index.ts +++ b/src/lib/apis/configs/index.ts @@ -58,10 +58,10 @@ export const exportConfig = async (token: string) => { return res; }; -export const getDirectApiConfig = async (token: string) => { +export const getDirectConnectionsConfig = async (token: string) => { let error = null; - const res = await fetch(`${WEBUI_API_BASE_URL}/configs/direct_api`, { + const res = await fetch(`${WEBUI_API_BASE_URL}/configs/direct_connections`, { method: 'GET', headers: { 'Content-Type': 'application/json', @@ -85,10 +85,10 @@ export const getDirectApiConfig = async (token: string) => { return res; }; -export const setDirectApiConfig = async (token: string, config: object) => { +export const setDirectConnectionsConfig = async (token: string, config: object) => { let error = null; - const res = await fetch(`${WEBUI_API_BASE_URL}/configs/direct_api`, { + const res = await fetch(`${WEBUI_API_BASE_URL}/configs/direct_connections`, { method: 'POST', headers: { 'Content-Type': 'application/json', diff --git a/src/lib/components/admin/Settings/Connections/AddConnectionModal.svelte b/src/lib/components/AddConnectionModal.svelte similarity index 100% rename from src/lib/components/admin/Settings/Connections/AddConnectionModal.svelte rename to src/lib/components/AddConnectionModal.svelte diff --git a/src/lib/components/admin/Settings/Connections.svelte b/src/lib/components/admin/Settings/Connections.svelte index b1cdc2ca4..893f45602 100644 --- a/src/lib/components/admin/Settings/Connections.svelte +++ b/src/lib/components/admin/Settings/Connections.svelte @@ -7,7 +7,7 @@ import { getOllamaConfig, updateOllamaConfig } from '$lib/apis/ollama'; import { getOpenAIConfig, updateOpenAIConfig, getOpenAIModels } from '$lib/apis/openai'; import { getModels as _getModels } from '$lib/apis'; - import { getDirectApiConfig, setDirectApiConfig } from '$lib/apis/configs'; + import { getDirectConnectionsConfig, setDirectConnectionsConfig } from '$lib/apis/configs'; import { models, user } from '$lib/stores'; @@ -17,7 +17,7 @@ import Plus from '$lib/components/icons/Plus.svelte'; import OpenAIConnection from './Connections/OpenAIConnection.svelte'; - import AddConnectionModal from './Connections/AddConnectionModal.svelte'; + import AddConnectionModal from '$lib/components/AddConnectionModal.svelte'; import OllamaConnection from './Connections/OllamaConnection.svelte'; const i18n = getContext('i18n'); @@ -38,7 +38,7 @@ let ENABLE_OPENAI_API: null | boolean = null; let ENABLE_OLLAMA_API: null | boolean = null; - let directApiConfig = null; + let directConnectionsConfig = null; let pipelineUrls = {}; let showAddOpenAIConnectionModal = false; @@ -101,13 +101,15 @@ } }; - const updateDirectAPIHandler = async () => { - const res = await setDirectApiConfig(localStorage.token, directApiConfig).catch((error) => { - toast.error(`${error}`); - }); + const updateDirectConnectionsHandler = async () => { + const res = await setDirectConnectionsConfig(localStorage.token, directConnectionsConfig).catch( + (error) => { + toast.error(`${error}`); + } + ); if (res) { - toast.success($i18n.t('Direct API settings updated')); + toast.success($i18n.t('Direct Connections settings updated')); await models.set(await getModels()); } }; @@ -143,7 +145,7 @@ openaiConfig = await getOpenAIConfig(localStorage.token); })(), (async () => { - directApiConfig = await getDirectApiConfig(localStorage.token); + directConnectionsConfig = await getDirectConnectionsConfig(localStorage.token); })() ]); @@ -191,7 +193,7 @@ const submitHandler = async () => { updateOpenAIHandler(); updateOllamaHandler(); - updateDirectAPIHandler(); + updateDirectConnectionsHandler(); dispatch('save'); }; @@ -210,7 +212,7 @@
- {#if ENABLE_OPENAI_API !== null && ENABLE_OLLAMA_API !== null && directApiConfig !== null} + {#if ENABLE_OPENAI_API !== null && ENABLE_OLLAMA_API !== null && directConnectionsConfig !== null}
@@ -356,14 +358,14 @@
-
{$i18n.t('Direct API')}
+
{$i18n.t('Direct Connections')}
{ - updateDirectAPIHandler(); + updateDirectConnectionsHandler(); }} />
@@ -372,7 +374,9 @@
- {$i18n.t('Direct API allows users to use the models directly from their browser.')} + {$i18n.t( + 'Direct Connections allow users to connect to their own OpenAI compatible API endpoints.' + )}
diff --git a/src/lib/components/admin/Settings/Connections/OllamaConnection.svelte b/src/lib/components/admin/Settings/Connections/OllamaConnection.svelte index 45aaa8efc..52bfa7915 100644 --- a/src/lib/components/admin/Settings/Connections/OllamaConnection.svelte +++ b/src/lib/components/admin/Settings/Connections/OllamaConnection.svelte @@ -4,7 +4,7 @@ import Tooltip from '$lib/components/common/Tooltip.svelte'; import SensitiveInput from '$lib/components/common/SensitiveInput.svelte'; - import AddConnectionModal from './AddConnectionModal.svelte'; + import AddConnectionModal from '$lib/components/AddConnectionModal.svelte'; import Cog6 from '$lib/components/icons/Cog6.svelte'; import Wrench from '$lib/components/icons/Wrench.svelte'; diff --git a/src/lib/components/admin/Settings/Connections/OpenAIConnection.svelte b/src/lib/components/admin/Settings/Connections/OpenAIConnection.svelte index e6953bd78..45e3f8797 100644 --- a/src/lib/components/admin/Settings/Connections/OpenAIConnection.svelte +++ b/src/lib/components/admin/Settings/Connections/OpenAIConnection.svelte @@ -5,7 +5,8 @@ import Tooltip from '$lib/components/common/Tooltip.svelte'; import SensitiveInput from '$lib/components/common/SensitiveInput.svelte'; import Cog6 from '$lib/components/icons/Cog6.svelte'; - import AddConnectionModal from './AddConnectionModal.svelte'; + import AddConnectionModal from '$lib/components/AddConnectionModal.svelte'; + import { connect } from 'socket.io-client'; export let onDelete = () => {}; diff --git a/src/lib/components/chat/Settings/Connections.svelte b/src/lib/components/chat/Settings/Connections.svelte new file mode 100644 index 000000000..699bebf6f --- /dev/null +++ b/src/lib/components/chat/Settings/Connections.svelte @@ -0,0 +1,114 @@ + + + + + +
+
+
+
+
{$i18n.t('Direct Connections')}
+
+ +
+
+ {$i18n.t('Connect to your own OpenAI compatible API endpoints.')} +
+
+ + {#if false} +
+ +
+
+
{$i18n.t('Manage Connections')}
+ + + + +
+ +
+ {#each config?.OPENAI_API_BASE_URLS ?? [] as url, idx} + { + updateHandler(); + }} + onDelete={() => { + config.OPENAI_API_BASE_URLS = config.OPENAI_API_BASE_URLS.filter( + (url, urlIdx) => idx !== urlIdx + ); + config.OPENAI_API_KEYS = config.OPENAI_API_KEYS.filter( + (key, keyIdx) => idx !== keyIdx + ); + + let newConfig = {}; + config.OPENAI_API_BASE_URLS.forEach((url, newIdx) => { + newConfig[newIdx] = + config.OPENAI_API_CONFIGS[newIdx < idx ? newIdx : newIdx + 1]; + }); + config.OPENAI_API_CONFIGS = newConfig; + }} + /> + {/each} +
+
+ {/if} +
+
+ +
+
+ +
+ +
+ diff --git a/src/lib/components/chat/Settings/Connections/Connection.svelte b/src/lib/components/chat/Settings/Connections/Connection.svelte new file mode 100644 index 000000000..6c8475b4b --- /dev/null +++ b/src/lib/components/chat/Settings/Connections/Connection.svelte @@ -0,0 +1,106 @@ + + + { + url = connection.url; + key = connection.key; + config = connection.config; + onSubmit(connection); + }} +/> + +
+ + {#if !(config?.enable ?? true)} +
+ {/if} +
+
+ + + {#if pipeline} +
+ + + + + + + +
+ {/if} +
+ + +
+ + +
+ + + +
+
diff --git a/src/lib/components/chat/SettingsModal.svelte b/src/lib/components/chat/SettingsModal.svelte index 93ed327c1..fdf6d7ace 100644 --- a/src/lib/components/chat/SettingsModal.svelte +++ b/src/lib/components/chat/SettingsModal.svelte @@ -1,7 +1,7 @@