From e980945d59d5bf7d45b63eea9f667ee207e369ab Mon Sep 17 00:00:00 2001 From: blue-eyed Date: Mon, 17 Jun 2024 21:03:56 +0800 Subject: [PATCH] Add OpenaiURL --- src/config.ts | 3 + src/lib/providers.ts | 42 ++++- src/routes/config.ts | 4 +- ui/components/SettingsDialog.tsx | 278 +++++++++++++------------------ 4 files changed, 159 insertions(+), 168 deletions(-) diff --git a/src/config.ts b/src/config.ts index 7c0c7f1..c80d7aa 100644 --- a/src/config.ts +++ b/src/config.ts @@ -16,6 +16,7 @@ interface Config { API_ENDPOINTS: { SEARXNG: string; OLLAMA: string; + OPENAI: string; }; } @@ -41,6 +42,8 @@ export const getSearxngApiEndpoint = () => loadConfig().API_ENDPOINTS.SEARXNG; export const getOllamaApiEndpoint = () => loadConfig().API_ENDPOINTS.OLLAMA; +export const getOpenaiApiEndpoint = () => loadConfig().API_ENDPOINTS.OPENAI; + export const updateConfig = (config: RecursivePartial) => { const currentConfig = loadConfig(); diff --git a/src/lib/providers.ts b/src/lib/providers.ts index 3223193..03ab2a9 100644 --- a/src/lib/providers.ts +++ b/src/lib/providers.ts @@ -6,6 +6,7 @@ import { getGroqApiKey, getOllamaApiEndpoint, getOpenaiApiKey, + getOpenaiApiEndpoint, } from '../config'; import logger from '../utils/logger'; @@ -13,6 +14,7 @@ export const getAvailableChatModelProviders = async () => { const openAIApiKey = getOpenaiApiKey(); const groqApiKey = getGroqApiKey(); const ollamaEndpoint = getOllamaApiEndpoint(); + const openAIEndpoint = getOpenaiApiEndpoint(); const models = {}; @@ -23,22 +25,38 @@ export const getAvailableChatModelProviders = async () => { openAIApiKey, modelName: 'gpt-3.5-turbo', temperature: 0.7, - }), + }, + { + baseURL:openAIEndpoint, + }, + ), 'GPT-4': new ChatOpenAI({ openAIApiKey, modelName: 'gpt-4', temperature: 0.7, - }), + }, + { + baseURL:openAIEndpoint, + }, + ), 'GPT-4 turbo': new ChatOpenAI({ openAIApiKey, modelName: 'gpt-4-turbo', temperature: 0.7, - }), + }, + { + baseURL:openAIEndpoint, + }, + ), 'GPT-4 omni': new ChatOpenAI({ openAIApiKey, modelName: 'gpt-4o', temperature: 0.7, - }), + }, + { + baseURL:openAIEndpoint, + }, + ), }; } catch (err) { logger.error(`Error loading OpenAI models: ${err}`); @@ -117,6 +135,8 @@ export const getAvailableChatModelProviders = async () => { } } + + models['custom_openai'] = {}; return models; @@ -125,6 +145,7 @@ export const getAvailableChatModelProviders = async () => { export const getAvailableEmbeddingModelProviders = async () => { const openAIApiKey = getOpenaiApiKey(); const ollamaEndpoint = getOllamaApiEndpoint(); + const openAIEndpoint = getOpenaiApiEndpoint(); const models = {}; @@ -134,11 +155,19 @@ export const getAvailableEmbeddingModelProviders = async () => { 'Text embedding 3 small': new OpenAIEmbeddings({ openAIApiKey, modelName: 'text-embedding-3-small', - }), + }, + { + baseURL:openAIEndpoint, + }, + ), 'Text embedding 3 large': new OpenAIEmbeddings({ openAIApiKey, modelName: 'text-embedding-3-large', - }), + }, + { + baseURL:openAIEndpoint, + }, + ), }; } catch (err) { logger.error(`Error loading OpenAI embeddings: ${err}`); @@ -167,6 +196,7 @@ export const getAvailableEmbeddingModelProviders = async () => { } } + try { models['local'] = { 'BGE Small': new HuggingFaceTransformersEmbeddings({ diff --git a/src/routes/config.ts b/src/routes/config.ts index bf13b63..43174f6 100644 --- a/src/routes/config.ts +++ b/src/routes/config.ts @@ -7,6 +7,7 @@ import { getGroqApiKey, getOllamaApiEndpoint, getOpenaiApiKey, + getOpenaiApiEndpoint, updateConfig, } from '../config'; @@ -38,7 +39,7 @@ router.get('/', async (_, res) => { config['openaiApiKey'] = getOpenaiApiKey(); config['ollamaApiUrl'] = getOllamaApiEndpoint(); config['groqApiKey'] = getGroqApiKey(); - + config['openaiApiUrl'] = getOpenaiApiEndpoint(); res.status(200).json(config); }); @@ -52,6 +53,7 @@ router.post('/', async (req, res) => { }, API_ENDPOINTS: { OLLAMA: config.ollamaApiUrl, + OPENAI: config.openaiApiUrl, }, }; diff --git a/ui/components/SettingsDialog.tsx b/ui/components/SettingsDialog.tsx index e932cee..30aa4fb 100644 --- a/ui/components/SettingsDialog.tsx +++ b/ui/components/SettingsDialog.tsx @@ -1,52 +1,6 @@ -import { cn } from '@/lib/utils'; import { Dialog, Transition } from '@headlessui/react'; import { CloudUpload, RefreshCcw, RefreshCw } from 'lucide-react'; -import React, { - Fragment, - useEffect, - useMemo, - useState, - type SelectHTMLAttributes, -} from 'react'; -import ThemeSwitcher from './theme/Switcher'; - -interface InputProps extends React.InputHTMLAttributes {} - -const Input = ({ className, ...restProps }: InputProps) => { - return ( - - ); -}; - -interface SelectProps extends SelectHTMLAttributes { - options: { value: string; label: string; disabled?: boolean }[]; -} - -export const Select = ({ className, options, ...restProps }: SelectProps) => { - return ( - - ); -}; +import React, { Fragment, useEffect, useState } from 'react'; interface SettingsType { chatModelProviders: { @@ -58,6 +12,7 @@ interface SettingsType { openaiApiKey: string; groqApiKey: string; ollamaApiUrl: string; + openaiApiUrl: string; } const SettingsDialog = ({ @@ -191,7 +146,7 @@ const SettingsDialog = ({ leaveFrom="opacity-100" leaveTo="opacity-0" > -
+
@@ -204,24 +159,18 @@ const SettingsDialog = ({ leaveFrom="opacity-100 scale-200" leaveTo="opacity-0 scale-95" > - - + + Settings {config && !isLoading && (
-
-

- Theme -

- -
{config.chatModelProviders && (
-

+

Chat model Provider

-
)} {selectedChatModelProvider && selectedChatModelProvider != 'custom_openai' && (
-

- Chat Model -

- setSelectedChatModel(e.target.value) } - options={(() => { - const chatModelProvider = + className="bg-[#111111] px-3 py-2 flex items-center overflow-hidden border border-[#1C1C1C] text-white rounded-lg text-sm" + > + {config.chatModelProviders[ + selectedChatModelProvider + ] ? ( + config.chatModelProviders[ + selectedChatModelProvider + ].length > 0 ? ( config.chatModelProviders[ selectedChatModelProvider - ]; - - return chatModelProvider - ? chatModelProvider.length > 0 - ? chatModelProvider.map((model) => ({ - value: model, - label: model, - })) - : [ - { - value: '', - label: 'No models available', - disabled: true, - }, - ] - : [ - { - value: '', - label: - 'Invalid provider, please check backend logs', - disabled: true, - }, - ]; - })()} - /> + ].map((model) => ( + + )) + ) : ( + + ) + ) : ( + + )} +
)} {selectedChatModelProvider && selectedChatModelProvider === 'custom_openai' && ( <>
-

- Model name -

- Model name

+ setSelectedChatModel(e.target.value) } + className="bg-[#111111] px-3 py-2 flex items-center overflow-hidden border border-[#1C1C1C] text-white rounded-lg text-sm" />
-

+

Custom OpenAI API Key

- setCustomOpenAIApiKey(e.target.value) } + className="bg-[#111111] px-3 py-2 flex items-center overflow-hidden border border-[#1C1C1C] text-white rounded-lg text-sm" />
-

+

Custom OpenAI Base URL

- setCustomOpenAIBaseURL(e.target.value) } + className="bg-[#111111] px-3 py-2 flex items-center overflow-hidden border border-[#1C1C1C] text-white rounded-lg text-sm" />
@@ -329,10 +276,10 @@ const SettingsDialog = ({ {/* Embedding models */} {config.embeddingModelProviders && (
-

+

Embedding model Provider

-
)} {selectedEmbeddingModelProvider && (
-

- Embedding Model -

- setSelectedEmbeddingModel(e.target.value) } - options={(() => { - const embeddingModelProvider = + className="bg-[#111111] px-3 py-2 flex items-center overflow-hidden border border-[#1C1C1C] text-white rounded-lg text-sm" + > + {config.embeddingModelProviders[ + selectedEmbeddingModelProvider + ] ? ( + config.embeddingModelProviders[ + selectedEmbeddingModelProvider + ].length > 0 ? ( config.embeddingModelProviders[ selectedEmbeddingModelProvider - ]; - - return embeddingModelProvider - ? embeddingModelProvider.length > 0 - ? embeddingModelProvider.map((model) => ({ - label: model, - value: model, - })) - : [ - { - label: 'No embedding models available', - value: '', - disabled: true, - }, - ] - : [ - { - label: - 'Invalid provider, please check backend logs', - value: '', - disabled: true, - }, - ]; - })()} - /> + ].map((model) => ( + + )) + ) : ( + + ) + ) : ( + + )} +
)}
-

- OpenAI API Key -

- OpenAI API Key

+
-

- Ollama API URL -

- Ollama API URL

+
-

- GROQ API Key -

- OpenAI API URL

+ + setConfig({ + ...config, + openaiApiUrl: e.target.value, + }) + } + className="bg-[#111111] px-3 py-2 flex items-center overflow-hidden border border-[#1C1C1C] text-white rounded-lg text-sm" + /> +
+
+

GROQ API Key

+
)} {isLoading && ( -
+
)}
-

+

We'll refresh the page after updating the settings.