Support GPT-4

#50 add platform to docker-compose

components/ModelParameters.vue

@@ -1,11 +1,15 @@
 <script setup>
+
 const dialog = ref(false)
 const currentModel = useCurrentModel()
 const availableModels = [
-  DEFAULT_MODEL.name
+    'gpt-3.5-turbo',
+    'gpt-4'
 ]
+const currentModelDefault = ref(MODELS[currentModel.value.name])
 
 watch(currentModel, (newVal, oldVal) => {
+  currentModelDefault.value = MODELS[newVal.name]
   saveCurrentModel(newVal)
 }, { deep: true })
 
@@ -83,7 +87,7 @@ watch(currentModel, (newVal, oldVal) => {
                   single-line
                   density="compact"
                   type="number"
-                  max="2048"
+                  :max="currentModelDefault.total_tokens"
                   step="1"
                   style="width: 100px"
                   class="flex-grow-0"
@@ -93,7 +97,7 @@ watch(currentModel, (newVal, oldVal) => {
           <v-col cols="12">
             <v-slider
                 v-model="currentModel.max_tokens"
-                :max="2048"
+                :max="currentModelDefault.total_tokens"
                 :step="1"
                 hide-details
             >

composables/states.js

@@ -1,5 +1,5 @@
 
-export const useModels = () => useState('models', () => getStoredModels())
+// export const useModels = () => useState('models', () => getStoredModels())
 
 export const useCurrentModel = () => useState('currentModel', () => getCurrentModel())
 

docker-compose.yml

@@ -1,6 +1,7 @@
 version: '3'
 services:
   client:
+    platform: linux/x86_64
     image: wongsaang/chatgpt-ui-client:latest
     environment:
       - SERVER_DOMAIN=http://backend-web-server
@@ -15,6 +16,7 @@ services:
       - chatgpt_ui_network
     restart: always
   backend-wsgi-server:
+    platform: linux/x86_64
     image: wongsaang/chatgpt-ui-wsgi-server:latest
     environment:
       - APP_DOMAIN=${APP_DOMAIN:-localhost:9000}
@@ -36,6 +38,7 @@ services:
       - chatgpt_ui_network
     restart: always
   backend-web-server:
+    platform: linux/x86_64
     image: wongsaang/chatgpt-ui-web-server:latest
     environment:
       - BACKEND_URL=http://backend-wsgi-server:8000

layouts/default.vue

@@ -98,6 +98,15 @@ const signOut = async () => {
   }
 }
 
+const settings = useSettings()
+const showApiKeySetting = ref(false)
+watchEffect(() => {
+  if (settings.value) {
+    const settingsValue = toRaw(settings.value)
+    showApiKeySetting.value = settingsValue.open_api_key_setting && settingsValue.open_api_key_setting === 'True'
+  }
+})
+
 onMounted(async () => {
   loadConversations()
   loadSettings()
@@ -239,6 +248,10 @@ onMounted(async () => {
               </v-card>
             </v-dialog>
 
+            <ApiKeyDialog
+                v-if="showApiKeySetting"
+            />
+
             <ModelParameters/>
 
             <v-menu

nuxt.config.ts

@@ -1,5 +1,5 @@
 // https://nuxt.com/docs/api/configuration/nuxt-config
-const appName = 'ChatGPT UI'
+const appName = process.env.NUXT_PUBLIC_APP_NAME ?? 'ChatGPT UI'
 
 export default defineNuxtConfig({
     dev: false,
@@ -14,6 +14,7 @@ export default defineNuxtConfig({
             appName: appName,
             typewriter: false,
             typewriterDelay: 50,
+            customApiKey: false
         }
     },
     build: {

pages/index.vue

@@ -60,7 +60,7 @@ const fetchReply = async (message) => {
   }
 
   const data = Object.assign({}, currentModel.value, {
-    openaiApiKey: openaiApiKey.value,
+    openaiApiKey: enableCustomApiKey.value ? openaiApiKey.value : null,
     message: message,
     conversationId: currentConversation.value.id
   }, webSearchParams)
@@ -90,12 +90,13 @@ const fetchReply = async (message) => {
         throw err;
       },
       async onmessage(message) {
-        // console.log(message)
         const event = message.event
         const data = JSON.parse(message.data)
 
         if (event === 'error') {
-          throw new Error(data.error);
+          abortFetch()
+          showSnackbar(data.error)
+          return;
         }
 
         if (event === 'userMessageId') {
@@ -165,6 +166,7 @@ const deleteMessage = (index) => {
 
 const showWebSearchToggle = ref(false)
 const enableWebSearch = ref(false)
+const enableCustomApiKey = ref(false)
 
 const settings = useSettings()
 
@@ -172,6 +174,7 @@ watchEffect(() => {
   if (settings.value) {
     const settingsValue = toRaw(settings.value)
     showWebSearchToggle.value = settingsValue.open_web_search && settingsValue.open_web_search === 'True'
+    enableCustomApiKey.value = settingsValue.open_api_key_setting && settingsValue.open_api_key_setting === 'True'
   }
 })
 

utils/enums.js

@@ -5,11 +5,25 @@ export const STORAGE_KEY = {
     OPENAI_API_KEY: 'openai_api_key',
 }
 
-export const DEFAULT_MODEL = {
+export const MODELS = {
+    'gpt-3.5-turbo': {
         name: 'gpt-3.5-turbo',
         frequency_penalty: 0.0,
         presence_penalty: 0.0,
+        total_tokens: 4096,
         max_tokens: 1000,
         temperature: 0.7,
         top_p: 1.0
+    },
+    'gpt-4': {
+        name: 'gpt-4',
+        frequency_penalty: 0.0,
+        presence_penalty: 0.0,
+        total_tokens: 8192,
+        max_tokens: 2000,
+        temperature: 0.7,
+        top_p: 1.0
     }
+}
+
+export const DEFAULT_MODEL_NAME = 'gpt-3.5-turbo'

utils/localStorage.js

@@ -1,3 +1,4 @@
+import {MODELS} from "~/utils/enums";
 
 const get = (key) => {
     let val = localStorage.getItem(key)
@@ -17,13 +18,13 @@ export const setModels = (val) => {
     models.value = val
 }
 
-export const getStoredModels = () => {
-    let models = get(STORAGE_KEY.MODELS)
-    if (!models) {
-        models = [DEFAULT_MODEL]
-    }
-    return models
-}
+// export const getStoredModels = () => {
+//     let models = get(STORAGE_KEY.MODELS)
+//     if (!models) {
+//         models = [DEFAULT_MODEL]
+//     }
+//     return models
+// }
 
 export const saveCurrentModel = (val) => {
     set(STORAGE_KEY.CURRENT_MODEL, val)
@@ -32,7 +33,7 @@ export const saveCurrentModel = (val) => {
 export const getCurrentModel = () => {
     let model = get(STORAGE_KEY.CURRENT_MODEL)
     if (!model) {
-        model = DEFAULT_MODEL
+        model = MODELS[DEFAULT_MODEL_NAME]
     }
     return model
 }