Fix the bug of being unable to delete messages.

add DEBUT_PWA env variable
Merge remote-tracking branch 'origin/main' into main
2023-03-22 15:55:06 +08:00 · 2023-03-22 14:12:49 +08:00 · 2023-03-22 13:50:53 +08:00 · 2023-03-21 22:13:02 +08:00 · 2023-03-21 18:48:35 +08:00 · 2023-03-21 18:06:44 +08:00
27 changed files with 3117 additions and 220 deletions
--- a/README.md
+++ b/README.md
@@ -1,5 +1,5 @@
 <p align="center">
-  <img alt="demo" src="./demos/demo.png?v=1">
+  <img alt="demo" src="./demos/demo.gif?v=1">
 </p>

 [English](./README.md) | [中文](./docs/zh/README.md)
@@ -9,6 +9,23 @@
 A ChatGPT web client that supports multiple users, multiple database connections for persistent data storage, supports i18n. Provides Docker images and quick deployment scripts.

 ## 📢Updates
+<details open>
+<summary><strong>2023-03-15</strong></summary>
+
+Add "open_registration" setting option in the admin panel to control whether user registration is enabled. You can log in to the admin panel and find this setting option under `Chat->Setting`. The default value of this setting is `True` (allow user registration). If you do not need it, please change it to `False`.
+
+
+</details>
+
+<details open>
+<summary><strong>2023-03-10</strong></summary>
+
+Add 2 environment variables to control the typewriter effect:
+
+- `NUXT_PUBLIC_TYPEWRITER=true` to enable/disable the typewriter effect
+- `NUXT_PUBLIC_TYPEWRITER_DELAY=50` to set the delay time for each character in milliseconds.
+
+</details>

 <details open>
 <summary><strong>2023-03-04</strong></summary>
@@ -19,22 +36,22 @@ A ChatGPT web client that supports multiple users, multiple database connections

 </details>

-<details open>
+<details>

 <summary><strong>2023-02-24</strong></summary>
 Version 2 is a major update that separates the backend functionality as an independent project, hosted at [chatgpt-ui-server](https://github.com/WongSaang/chatgpt-ui-server). 

 If you still wish to use the old version, please visit the [v1 branch](https://github.com/WongSaang/chatgpt-ui/tree/v1).

-Version 2 introduces the following new features:
+</details>
+
+## Version 2 introduces the following new features:

 - 😉 Separation of the frontend and backend, with the backend now using the Python-based Django framework.
 - 😘 User authentication, supporting multiple users.
 - 😀 Ability to store data in an external database (defaulting to Sqlite).
 - 😎 Session persistence, allowing the API to answer questions based on your context.

-</details>
-
 ## 🚀 One-click deployment <a name="one-click-depolyment"></a>

 Note: This script has only been tested on Ubuntu Server 22.04 LTS.
@@ -73,6 +90,9 @@ services:
    image: wongsaang/chatgpt-ui-client:latest
    environment:
      - SERVER_DOMAIN=http://backend-web-server
+      - NUXT_PUBLIC_APP_NAME='ChatGPT UI' # App name
+      - NUXT_PUBLIC_TYPEWRITER=true # Enable typewriter effect, default is false
+      - NUXT_PUBLIC_TYPEWRITER_DELAY=100 # Typewriter effect delay time, default is 50ms
    depends_on:
      - backend-web-server
    ports:
@@ -88,6 +108,7 @@ services:
      - DJANGO_SUPERUSER_USERNAME=admin # default superuser name
      - DJANGO_SUPERUSER_PASSWORD=password # default superuser password
      - DJANGO_SUPERUSER_EMAIL=admin@example.com # default superuser email
+      - ACCOUNT_EMAIL_VERIFICATION=none # Determines the e-mail verification method during signup – choose one of "none", "optional", or "mandatory". Default is "optional". If you don't need to verify the email, you can set it to "none".
      # If you want to use the email verification function, you need to configure the following parameters
    #      - EMAIL_HOST=SMTP server address
    #      - EMAIL_PORT=SMTP server port
--- a/app.vue
+++ b/app.vue
@@ -0,0 +1,8 @@
+<template>
+  <div>
+    <NuxtLoadingIndicator />
+    <NuxtLayout>
+      <NuxtPage />
+    </NuxtLayout>
+  </div>
+</template>
--- a/components/MessageActions.vue
+++ b/components/MessageActions.vue
@@ -0,0 +1,98 @@
+<script setup>
+import copy from 'copy-to-clipboard'
+
+const props = defineProps({
+  message: {
+    type: Object,
+    required: true
+  },
+  messageIndex: {
+    type: Number,
+    required: true
+  },
+  usePrompt: {
+    type: Function,
+    required: true
+  },
+  deleteMessage: {
+    type: Function,
+    required: true
+  }
+})
+
+const snackbar = ref(false)
+const snackbarText = ref('')
+const showSnackbar = (text) => {
+  snackbarText.value = text
+  snackbar.value = true
+}
+
+const copyMessage = () => {
+  copy(props.message.message)
+  showSnackbar('Copied!')
+}
+
+const editMessage = () => {
+  props.usePrompt(props.message.message)
+}
+
+const deleteMessage = async () => {
+  const { data, error } = await useAuthFetch(`/api/chat/messages/${props.message.id}/`, {
+    method: 'DELETE'
+  })
+  if (!error.value) {
+    props.deleteMessage(props.messageIndex)
+    showSnackbar('Deleted!')
+  }
+  showSnackbar('Delete failed')
+}
+
+</script>
+
+<template>
+  <v-menu
+  >
+    <template v-slot:activator="{ props }">
+      <v-btn
+          v-bind="props"
+          icon
+          variant="text"
+          class="mx-1"
+      >
+        <v-icon icon="more_horiz"></v-icon>
+      </v-btn>
+    </template>
+    <v-list>
+      <v-list-item
+          @click="copyMessage()"
+          :title="$t('copy')"
+          prepend-icon="content_copy"
+      >
+      </v-list-item>
+      <v-list-item
+          @click="editMessage()"
+          :title="$t('edit')"
+          prepend-icon="edit"
+      >
+      </v-list-item>
+      <v-list-item
+          @click="deleteMessage()"
+          :title="$t('delete')"
+          prepend-icon="delete"
+      >
+      </v-list-item>
+    </v-list>
+  </v-menu>
+
+  <v-snackbar
+      v-model="snackbar"
+      location="top"
+      timeout="2000"
+  >
+    {{ snackbarText }}
+  </v-snackbar>
+</template>
+
+<style scoped>
+
+</style>
--- a/components/ModelParameters.vue
+++ b/components/ModelParameters.vue
@@ -0,0 +1,191 @@
+<script setup>
+const dialog = ref(false)
+const currentModel = useCurrentModel()
+const availableModels = [
+  DEFAULT_MODEL.name
+]
+
+watch(currentModel, (newVal, oldVal) => {
+  saveCurrentModel(newVal)
+}, { deep: true })
+
+</script>
+
+<template>
+  <v-dialog
+      v-model="dialog"
+      persistent
+  >
+    <template v-slot:activator="{ props }">
+      <v-list-item
+          v-bind="props"
+          rounded="xl"
+          prepend-icon="tune"
+          :title="$t('modelParameters')"
+      ></v-list-item>
+    </template>
+    <v-card>
+      <v-toolbar
+          density="compact"
+      >
+        <v-toolbar-title>{{ $t('modelParameters') }}</v-toolbar-title>
+
+        <v-spacer></v-spacer>
+
+        <v-btn icon="close" @click="dialog = false"></v-btn>
+      </v-toolbar>
+      <v-card-text>
+        <v-select
+            v-model="currentModel.name"
+            :label="$t('model')"
+            :items="availableModels"
+            variant="underlined"
+        ></v-select>
+
+        <v-row
+            no-gutters
+        >
+          <v-col cols="12">
+            <div class="d-flex justify-space-between align-center">
+              <v-list-subheader>{{ $t('temperature') }}</v-list-subheader>
+              <v-text-field
+                  v-model="currentModel.temperature"
+                  hide-details
+                  single-line
+                  density="compact"
+                  type="number"
+                  max="1"
+                  step="0.01"
+                  style="width: 100px"
+                  class="flex-grow-0"
+              ></v-text-field>
+            </div>
+          </v-col>
+          <v-col cols="12">
+            <v-slider
+                v-model="currentModel.temperature"
+                :max="1"
+                :step="0.01"
+                hide-details
+            >
+            </v-slider>
+          </v-col>
+        </v-row>
+        <v-row
+            no-gutters
+        >
+          <v-col cols="12">
+            <div class="d-flex justify-space-between align-center">
+              <v-list-subheader>{{ $t('maxTokens') }}</v-list-subheader>
+              <v-text-field
+                  v-model="currentModel.max_tokens"
+                  hide-details
+                  single-line
+                  density="compact"
+                  type="number"
+                  max="2048"
+                  step="1"
+                  style="width: 100px"
+                  class="flex-grow-0"
+              ></v-text-field>
+            </div>
+          </v-col>
+          <v-col cols="12">
+            <v-slider
+                v-model="currentModel.max_tokens"
+                :max="2048"
+                :step="1"
+                hide-details
+            >
+            </v-slider>
+          </v-col>
+        </v-row>
+        <v-row
+            no-gutters
+        >
+          <v-col cols="12">
+            <div class="d-flex justify-space-between align-center">
+              <v-list-subheader>{{ $t('topP') }}</v-list-subheader>
+              <v-text-field
+                  v-model="currentModel.top_p"
+                  hide-details
+                  single-line
+                  density="compact"
+                  type="number"
+                  max="1"
+                  step="0.01"
+                  style="width: 100px"
+                  class="flex-grow-0"
+              ></v-text-field>
+            </div>
+          </v-col>
+          <v-col cols="12">
+            <v-slider
+                v-model="currentModel.top_p"
+                :max="1"
+                :step="0.01"
+                hide-details
+            >
+            </v-slider>
+          </v-col>
+        </v-row>
+        <v-row no-gutters>
+          <v-col cols="12">
+            <div class="d-flex justify-space-between align-center">
+              <v-list-subheader>{{ $t('frequencyPenalty') }}</v-list-subheader>
+              <v-text-field
+                  v-model="currentModel.frequency_penalty"
+                  hide-details
+                  single-line
+                  density="compact"
+                  type="number"
+                  max="2"
+                  step="0.01"
+                  style="width: 100px"
+                  class="flex-grow-0"
+              ></v-text-field>
+            </div>
+          </v-col>
+          <v-col cols="12">
+            <v-slider
+                v-model="currentModel.frequency_penalty"
+                :max="2"
+                :step="0.01"
+                hide-details
+            ></v-slider>
+          </v-col>
+        </v-row>
+        <v-row no-gutters>
+          <v-col cols="12">
+            <div class="d-flex justify-space-between align-center">
+              <v-list-subheader>{{ $t('presencePenalty') }}</v-list-subheader>
+              <v-text-field
+                  v-model="currentModel.presence_penalty"
+                  hide-details
+                  single-line
+                  density="compact"
+                  type="number"
+                  max="2"
+                  step="0.01"
+                  style="width: 100px"
+                  class="flex-grow-0"
+              ></v-text-field>
+            </div>
+          </v-col>
+          <v-col cols="12">
+            <v-slider
+                v-model="currentModel.presence_penalty"
+                :max="2"
+                :step="0.01"
+                hide-details
+            ></v-slider>
+          </v-col>
+        </v-row>
+      </v-card-text>
+    </v-card>
+  </v-dialog>
+</template>
+
+<style scoped>
+
+</style>
--- a/components/MsgContent.vue
+++ b/components/MsgContent.vue
@@ -1,34 +1,41 @@
 <script setup>
-import { marked } from "marked"
 import hljs from "highlight.js"
+import MarkdownIt from 'markdown-it'
 import copy from 'copy-to-clipboard'

-// Part of the code comes from this project https://github.com/arronhunt/highlightjs-copy, thanks to the author's contribution

-hljs.addPlugin({
-  'after:highlightElement': ({ el, result, text }) => {
-    let header = el.parentElement.querySelector(".hljs-code-header");
-    if (header) {
-      header.remove();
+const md = new MarkdownIt({
+  linkify: true,
+  highlight(code, lang) {
+    const language = hljs.getLanguage(lang) ? lang : 'plaintext'
+    return `<pre class="hljs-code-container my-3"><div class="hljs-code-header d-flex align-center justify-space-between bg-grey-darken-3 pa-1"><span class="pl-2 text-caption">${language}</span><button class="hljs-copy-button" data-copied="false">Copy</button></div><code class="hljs language-${language}">${hljs.highlight(code, { language: language, ignoreIllegals: true }).value}</code></pre>`
+  },
+})
+
+const props = defineProps({
+  message: {
+    type: Object,
+    required: true
  }
+})

-    header = Object.assign(document.createElement("div"), {
-      className: "hljs-code-header d-flex align-center justify-space-between bg-black pa-1",
-      innerHTML: `<div class="pl-2 text-caption">${result.language}</div>`
-    });
+const contentHtml = ref('')

-    let copyButton = Object.assign(document.createElement("button"), {
-      innerHTML: "Copy",
-      className: "hljs-copy-button",
-    });
-    copyButton.dataset.copied = false;
+const contentElm = ref(null)

-    header.append(copyButton);
-    //
-    el.parentElement.classList.add("d-flex","flex-column", "my-3");
-    el.parentElement.prepend(header);
+watchEffect(() => {
+  contentHtml.value = props.message.message ? md.render(props.message.message) : ''
+})
+
+const bindCopyCodeToButtons = () => {
+  if (!contentElm.value) {
+    return
+  }
+  contentElm.value.querySelectorAll('.hljs-code-container').forEach((codeContainer) => {
+    const copyButton = codeContainer.querySelector('.hljs-copy-button');
+    const codeBody = codeContainer.querySelector('code');
    copyButton.onclick = function () {
-      copy(text);
+      copy(codeBody.textContent ?? '');

      copyButton.innerHTML = "Copied!";
      copyButton.dataset.copied = 'true';
@@ -38,49 +45,42 @@ hljs.addPlugin({
        copyButton.dataset.copied = 'false';
      }, 2000);
    };
-  }
-});
-
-marked.setOptions({
-  // highlight: function (code, lang) {
-  //   const language = hljs.getLanguage(lang) ? lang : 'plaintext'
-  //   return hljs.highlight(code, { language }).value
-  // },
-  langPrefix: 'hljs language-', // highlight.js css class prefix
-})
-
-const props = defineProps(['content'])
-
-const contentHtml = ref('')
-
-const contentElm = ref(null)
-
-const highlightCode = () => {
-  contentElm.value.querySelectorAll('pre code').forEach((block) => {
-    hljs.highlightElement(block)
  })
 }

-watchEffect(() => {
-  contentHtml.value = props.content ? marked(props.content) : ''
-  nextTick(() => {
-    highlightCode()
+onMounted(() => {
+  bindCopyCodeToButtons()
 })
+
+onUpdated(() => {
+  bindCopyCodeToButtons()
 })

 </script>

 <template>
+  <v-card
+      :color="message.is_bot ? '' : 'primary'"
+      rounded="lg"
+      elevation="2"
+  >
+    <v-card-text>
      <div
          ref="contentElm"
          v-html="contentHtml"
-      class="chat-msg-content text-justify"
+          class="chat-msg-content"
      ></div>
+    </v-card-text>
+  </v-card>
 </template>

 <style>
 .chat-msg-content ol {
-  list-style-position: inside;
+  padding-left: 2em;
+}
+.hljs-code-container {
+  border-radius: 3px;
+  overflow: hidden;
 }
 .hljs-copy-button{
  width:2rem;height:2rem;text-indent:-9999px;color:#fff;
--- a/components/MsgEditor.vue
+++ b/components/MsgEditor.vue
@@ -1,18 +1,29 @@
 <template>
+  <div
+      class="flex-grow-1 d-flex align-center justify-space-between"
+  >
    <v-textarea
        v-model="message"
        :label="$t('writeAMessage')"
-      :placeholder="$t('writeAMessage') + '...'"
-      rows="1"
+        :placeholder="hint"
+        :rows="rows"
+        max-rows="8"
        :auto-grow="autoGrow"
        :disabled="disabled"
        :loading="loading"
-      :hint="hint"
-      :hide-details="loading"
-      append-inner-icon="send"
-      @keyup.enter.exact="enterOnly"
-      @click:appendInner="clickSendBtn"
+        :hide-details="true"
+        clearable
+        variant="outlined"
+        @keydown.enter.exact="enterOnly"
    ></v-textarea>
+    <v-btn
+        :disabled="loading"
+        icon="send"
+        title="Send"
+        class="ml-3"
+        @click="clickSendBtn"
+    ></v-btn>
+  </div>
 </template>

 <script>
@@ -40,7 +51,7 @@ export default {
    message(val) {
      const lines = val.split(/\r\n|\r|\n/).length;
      if (lines > 8) {
-        this.rows = lines;
+        this.rows = 8;
        this.autoGrow = false;
      } else {
        this.rows = 1;
@@ -60,10 +71,14 @@ export default {
      }
      this.message = ""
    },
+    usePrompt(prompt) {
+      this.message = prompt
+    },
    clickSendBtn () {
      this.send()
    },
-    enterOnly () {
+    enterOnly (event) {
+      event.preventDefault();
      if (!isMobile()) {
        this.send()
      }
--- a/components/Prompt.vue
+++ b/components/Prompt.vue
@@ -0,0 +1,224 @@
+<script setup>
+const menu = ref(false)
+const prompts = ref([])
+const editingPrompt = ref(null)
+const newPrompt = ref('')
+const submittingNewPrompt = ref(false)
+const promptInputErrorMessage = ref('')
+const loadingPrompts = ref(false)
+const deletingPromptIndex = ref(null)
+
+const props = defineProps({
+  usePrompt: {
+    type: Function,
+    required: true
+  }
+})
+
+const addPrompt = async () => {
+  if (!newPrompt.value) {
+    promptInputErrorMessage.value = 'Please enter a prompt'
+    return
+  }
+  submittingNewPrompt.value = true
+  const { data, error } = await useAuthFetch('/api/chat/prompts/', {
+    method: 'POST',
+    body: JSON.stringify({
+      prompt: newPrompt.value
+    })
+  })
+  if (!error.value) {
+    prompts.value.push(data.value)
+    newPrompt.value = ''
+  }
+  submittingNewPrompt.value = false
+}
+
+const editPrompt = (index) => {
+  editingPrompt.value = Object.assign({}, prompts.value[index])
+}
+
+const updatePrompt = async (index) => {
+  editingPrompt.value.updating = true
+  const { data, error } = await useAuthFetch(`/api/chat/prompts/${editingPrompt.value.id}/`, {
+    method: 'PUT',
+    body: JSON.stringify({
+      prompt: editingPrompt.value.prompt
+    })
+  })
+  if (!error.value) {
+    prompts.value[index] = editingPrompt.value
+  }
+  editingPrompt.value.updating = false
+  editingPrompt.value = null
+}
+
+const cancelEditPrompt = () => {
+  editingPrompt.value = null
+}
+
+const deletePrompt = async (index) => {
+  deletingPromptIndex.value = index
+  const { data, error } = await useAuthFetch(`/api/chat/prompts/${prompts.value[index].id}/`, {
+    method: 'DELETE'
+  })
+  deletingPromptIndex.value = null
+  if (!error.value) {
+    prompts.value.splice(index, 1)
+  }
+}
+
+const loadPrompts = async () => {
+  loadingPrompts.value = true
+  const { data, error } = await useAuthFetch('/api/chat/prompts/')
+  if (!error.value) {
+    prompts.value = data.value
+  }
+  loadingPrompts.value = false
+}
+
+const selectPrompt = (prompt) => {
+  props.usePrompt(prompt.prompt)
+  menu.value = false
+}
+
+onMounted( () => {
+  loadPrompts()
+})
+</script>
+
+<template>
+  <div>
+    <v-menu
+        v-model="menu"
+        :close-on-content-click="false"
+    >
+      <template v-slot:activator="{ props }">
+        <v-btn
+            v-bind="props"
+            icon="speaker_notes"
+            title="Common prompts"
+            class="mr-3"
+        ></v-btn>
+      </template>
+
+      <v-container>
+        <v-card
+            min-width="300"
+            max-width="500"
+        >
+          <v-card-title>
+            <span class="headline">Frequently prompts</span>
+          </v-card-title>
+
+          <v-divider></v-divider>
+
+          <v-list>
+            <v-list-item v-show="loadingPrompts">
+              <v-list-item-title class="d-flex justify-center">
+                <v-progress-circular indeterminate></v-progress-circular>
+              </v-list-item-title>
+            </v-list-item>
+            <template
+                v-for="(prompt, idx) in prompts"
+                :key="prompt.id"
+            >
+              <v-list-item
+                  active-color="primary"
+                  rounded="xl"
+                  v-if="editingPrompt && editingPrompt.id === prompt.id"
+              >
+                <v-textarea
+                    rows="2"
+                    v-model="editingPrompt.prompt"
+                    :loading="editingPrompt.updating"
+                    variant="underlined"
+                    hide-details
+                    density="compact"
+                >
+                  <template v-slot:append>
+                    <div class="d-flex flex-column">
+                      <v-btn
+                          icon="done"
+                          variant="text"
+                          :loading="editingPrompt.updating"
+                          @click="updatePrompt(idx)"
+                      >
+                      </v-btn>
+                      <v-btn
+                          icon="close"
+                          variant="text"
+                          @click="cancelEditPrompt()"
+                      >
+                      </v-btn>
+                    </div>
+                  </template>
+                </v-textarea>
+              </v-list-item>
+              <v-list-item
+                  v-if="!editingPrompt || editingPrompt.id !== prompt.id"
+                  rounded="xl"
+                  active-color="primary"
+                  @click="selectPrompt(prompt)"
+              >
+                <v-list-item-title>{{ prompt.prompt }}</v-list-item-title>
+                <template v-slot:append>
+                  <v-btn
+                      icon="edit"
+                      size="small"
+                      variant="text"
+                      @click="editPrompt(idx)"
+                  >
+                  </v-btn>
+                  <v-btn
+                      icon="delete"
+                      size="small"
+                      variant="text"
+                      :loading="deletingPromptIndex === idx"
+                      @click="deletePrompt(idx)"
+                  >
+                  </v-btn>
+                </template>
+              </v-list-item>
+            </template>
+
+            <v-list-item
+                active-color="primary"
+            >
+              <div
+                  class="pt-3"
+              >
+                <v-textarea
+                    rows="2"
+                    v-model="newPrompt"
+                    label="Add a new prompt"
+                    variant="outlined"
+                    density="compact"
+                    :error-messages="promptInputErrorMessage"
+                    @update:modelValue="promptInputErrorMessage = ''"
+                    clearable
+                >
+                </v-textarea>
+              </div>
+            </v-list-item>
+            <v-list-item>
+              <v-btn
+                  variant="text"
+                  block
+                  :loading="submittingNewPrompt"
+                  @click="addPrompt()"
+              >
+                <v-icon icon="add"></v-icon>
+                Add prompt
+              </v-btn>
+            </v-list-item>
+          </v-list>
+        </v-card>
+      </v-container>
+    </v-menu>
+  </div>
+</template>
+
+<style scoped>
+
+</style>
--- a/components/settings/Languages.vue
+++ b/components/settings/Languages.vue
@@ -15,26 +15,23 @@
    </template>
    <v-card>
      <v-toolbar
-          dark
-          color="primary"
      >
        <v-btn
            icon
-            dark
            @click="dialog = false"
        >
-          <v-icon>close</v-icon>
+          <v-icon icon="close"></v-icon>
        </v-btn>
        <v-toolbar-title>{{ $t('language') }}</v-toolbar-title>
        <v-spacer></v-spacer>
-        <!--          <v-toolbar-items>-->
-        <!--            <v-btn-->
-        <!--                variant="text"-->
-        <!--                @click="dialog = false"-->
-        <!--            >-->
-        <!--              Save-->
-        <!--            </v-btn>-->
-        <!--          </v-toolbar-items>-->
+                  <v-toolbar-items>
+                    <v-btn
+                        variant="text"
+                        @click="dialog = false"
+                    >
+                      Save
+                    </v-btn>
+                  </v-toolbar-items>
      </v-toolbar>
      <v-list
      >
--- a/demos/demo.gif
+++ b/demos/demo.gif
--- a/demos/demo.png
+++ b/demos/demo.png
--- a/deployment.sh
+++ b/deployment.sh
@@ -1,6 +1,28 @@
 #!/bin/bash

-read -p "Please enter a resolved domain name: " domain
+read -p "Please enter a domain name or external IP address [default: localhost]: " APP_DOMAIN
+
+if [ -z "$APP_DOMAIN" ]; then
+  APP_DOMAIN="localhost"
+fi
+
+read -p "Please set a port for the frontend server [default: 80]: " CLIENT_PORT
+
+if [ -z "$CLIENT_PORT" ]; then
+  CLIENT_PORT="80"
+fi
+
+read -p "Please set a port for the backend server [default: 9000]: " SERVER_PORT
+
+if [ -z "$SERVER_PORT" ]; then
+  SERVER_PORT="9000"
+fi
+
+read -p "Please set a port for the backend WSGI server [default: 8000]: " WSGI_PORT
+
+if [ -z "$WSGI_PORT" ]; then
+  WSGI_PORT="8000"
+fi

 if [[ $(which docker) ]]; then
    echo "Docker is already installed"
@@ -43,6 +65,6 @@ sudo curl -L "https://raw.githubusercontent.com/WongSaang/chatgpt-ui/main/docker

 echo "Starting services..."

-sudo APP_DOMAIN="${domain}:9000" docker-compose up -d
+sudo APP_DOMAIN="${APP_DOMAIN}:${SERVER_PORT}" CLIENT_PORT=${CLIENT_PORT} SERVER_PORT=${SERVER_PORT} WSGI_PORT=${WSGI_PORT}  docker-compose up --pull always -d

 echo "Done"
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -4,12 +4,16 @@ services:
    image: wongsaang/chatgpt-ui-client:latest
    environment:
      - SERVER_DOMAIN=http://backend-web-server
+      - NUXT_PUBLIC_APP_NAME='ChatGPT UI'
+      - NUXT_PUBLIC_TYPEWRITER=true
+      - NUXT_PUBLIC_TYPEWRITER_DELAY=100
    depends_on:
      - backend-web-server
    ports:
-      - '80:80'
+      - '${CLIENT_PORT:-80}:80'
    networks:
      - chatgpt_ui_network
+    restart: always
  backend-wsgi-server:
    image: wongsaang/chatgpt-ui-wsgi-server:latest
    environment:
@@ -18,6 +22,7 @@ services:
      - DJANGO_SUPERUSER_USERNAME=admin # default superuser name
      - DJANGO_SUPERUSER_PASSWORD=password # default superuser password
      - DJANGO_SUPERUSER_EMAIL=admin@example.com # default superuser email
+      - ACCOUNT_EMAIL_VERIFICATION=${ACCOUNT_EMAIL_VERIFICATION:-none} # Determines the e-mail verification method during signup – choose one of "none", "optional", or "mandatory". Default is "optional". If you don't need to verify the email, you can set it to "none".
      # If you want to use the email verification function, you need to configure the following parameters
 #      - EMAIL_HOST=SMTP server address
 #      - EMAIL_PORT=SMTP server port
@@ -25,19 +30,21 @@ services:
 #      - EMAIL_HOST_PASSWORD=
 #      - EMAIL_USE_TLS=True
    ports:
-      - '8000:8000'
+      - '${WSGI_PORT:-8000}:8000'
    networks:
      - chatgpt_ui_network
+    restart: always
  backend-web-server:
    image: wongsaang/chatgpt-ui-web-server:latest
    environment:
      - BACKEND_URL=http://backend-wsgi-server:8000
    ports:
-      - '9000:80'
+      - '${SERVER_PORT:-9000}:80'
    depends_on:
      - backend-wsgi-server
    networks:
      - chatgpt_ui_network
+    restart: always

 networks:
  chatgpt_ui_network:
--- a/docs/zh/README.md
+++ b/docs/zh/README.md
@@ -1,14 +1,30 @@
 <p align="center">
-  <img alt="demo" src="./demos/demo.png?v=1">
+  <img alt="demo" src="../../demos/demo.gif?v=1">
 </p>

-[English](./README.md) | [中文](./docs/zh/README.md)
+[English](../../README.md) | [中文](./docs/zh/README.md)

 # ChatGPT UI

 ChatGPT Web 客户端，支持多用户，支持 Mysql、PostgreSQL 等多种数据库连接进行数据持久化存储，支持多语言。提供 Docker 镜像和快速部署脚本。

 ## 📢 更新
+<details open>
+<summary><strong>2023-03-15</strong></summary>
+
+在管理后台增加 `open_registration` 设置项，用于控制是否开放用户注册。你可以登录管理后台，在 `Chat->Setting` 中看到这个设置项，默认是 `True` (允许用户注册)，如果不需要，请改成 `False`。
+
+</details>
+
+<details open>
+<summary><strong>2023-03-10</strong></summary>
+
+增加 2 个环境变量来控制打字机效果, 详见下方 docker-compose 配置的环境变量说明
+
+- `NUXT_PUBLIC_TYPEWRITER` 是否开启打字机效果
+- `NUXT_PUBLIC_TYPEWRITER_DELAY` 每个字的延迟时间，单位：毫秒
+
+</details>

 <details open>
 <summary><strong>2023-03-04</strong></summary>
@@ -19,7 +35,7 @@ ChatGPT Web 客户端，支持多用户，支持 Mysql、PostgreSQL 等多种数

 </details>

-<details open>
+<details>

 <summary><strong>2023-02-24</strong></summary>
 V2 是一个重要的更新，将后端功能分离为一个独立的项目，托管在 [chatgpt-ui-server](https://github.com/WongSaang/chatgpt-ui-server), 该项目使用基于 Python 的 Django 框架。 
@@ -72,6 +88,9 @@ services:
    image: wongsaang/chatgpt-ui-client:latest
    environment:
      - SERVER_DOMAIN=http://backend-web-server
+      - NUXT_PUBLIC_APP_NAME='ChatGPT UI' # App 名称，默认为 ChatGPT UI
+      - NUXT_PUBLIC_TYPEWRITER=true # 是否启用打字机效果，默认关闭
+      - NUXT_PUBLIC_TYPEWRITER_DELAY=100 # 打字机效果的延迟时间，默认 50毫秒
    depends_on:
      - backend-web-server
    ports:
@@ -87,6 +106,7 @@ services:
      - DJANGO_SUPERUSER_USERNAME=admin # 默认超级用户
      - DJANGO_SUPERUSER_PASSWORD=password # 默认超级用户的密码
      - DJANGO_SUPERUSER_EMAIL=admin@example.com # 默认超级用户邮箱
+      - ACCOUNT_EMAIL_VERIFICATION=none # 邮箱验证方式，可选值： none, optional, mandatory. 默认为 optional。如果你不需要验证用户的邮箱，可以设置为 none。
      # 如果您想使用电子邮件验证功能，需要配置以下参数：
    #      - EMAIL_HOST=SMTP server address
    #      - EMAIL_PORT=SMTP server port
--- a/lang/en-US.json
+++ b/lang/en-US.json
@@ -18,10 +18,22 @@
  "feedback": "Feedback",
  "newConversation": "New conversation",
  "clearConversations": "Clear conversations",
+  "modelParameters": "Model Parameters",
+  "model": "Model",
+  "temperature": "Temperature",
+  "topP": "Top P",
+  "frequencyPenalty": "Frequency Penalty",
+  "presencePenalty": "Presence Penalty",
+  "maxTokens": "Max Tokens",
  "roles": {
    "me": "Me",
    "ai": "AI"
  },
+  "edit": "Edit",
+  "copy": "Copy",
+  "copied": "Copied",
+  "delete": "Delete",
+  "signOut": "Sign out",
  "welcomeScreen": {
    "introduction1": "is an unofficial client for ChatGPT, but uses the official OpenAI API.",
    "introduction2": "You will need an OpenAI API Key before you can use this client.",
--- a/lang/zh-CN.json
+++ b/lang/zh-CN.json
@@ -18,10 +18,22 @@
  "feedback": "反馈",
  "newConversation": "新的对话",
  "clearConversations": "清除对话",
+  "modelParameters": "模型参数",
+  "model": "模型",
+  "temperature": "Temperature",
+  "topP": "Top P",
+  "frequencyPenalty": "Frequency Penalty",
+  "presencePenalty": "Presence Penalty",
+  "maxTokens": "Max Tokens",
  "roles": {
    "me": "我",
    "ai": "AI"
  },
+  "edit": "编辑",
+  "copy": "复制",
+  "copied": "已复制",
+  "delete": "删除",
+  "signOut": "退出登录",
  "welcomeScreen": {
    "introduction1": "是一个非官方的ChatGPT客户端，但使用OpenAI的官方API",
    "introduction2": "在使用本客户端之前，您需要一个OpenAI API密钥。",
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -1,9 +1,7 @@
 <script setup>
-import {useConversions} from "../composables/states";
-import {getConversions} from "../utils/helper";
 import {useDisplay} from "vuetify";

-const { $i18n } = useNuxtApp()
+const { $i18n, $auth } = useNuxtApp()
 const runtimeConfig = useRuntimeConfig()
 const colorMode = useColorMode()
 const drawer = ref(null)
@@ -25,6 +23,7 @@ const setLang = (lang) => {
 }

 const conversations = useConversions()
+const currentConversation = useConversion()

 const editingConversation = ref(null)
 const deletingConversationIndex = ref(null)
@@ -54,6 +53,9 @@ const deleteConversation = async (index) => {
  })
  deletingConversationIndex.value = null
  if (!error.value) {
+    if (conversations.value[index].id === currentConversation.value.id) {
+      createNewConversion()
+    }
    conversations.value.splice(index, 1)
  }
 }
@@ -86,6 +88,15 @@ const drawerPermanent = computed(() => {
  return mdAndUp.value
 })

+const signOut = async () => {
+  const { data, error } = await useFetch('/api/account/logout/', {
+    method: 'POST'
+  })
+  if (!error.value) {
+    await $auth.logout()
+  }
+}
+
 onNuxtReady(async () => {
  loadConversations()
 })
@@ -162,7 +173,7 @@ onNuxtReady(async () => {
                        icon="edit"
                        size="small"
                        variant="text"
-                        @click="editConversation(cIdx)"
+                        @click.stop="editConversation(cIdx)"
                    >
                    </v-btn>
                    <v-btn
@@ -170,7 +181,7 @@ onNuxtReady(async () => {
                        size="small"
                        variant="text"
                        :loading="deletingConversationIndex === cIdx"
-                        @click="deleteConversation(cIdx)"
+                        @click.stop="deleteConversation(cIdx)"
                    >
                    </v-btn>
                  </div>
@@ -226,6 +237,8 @@ onNuxtReady(async () => {
              </v-card>
            </v-dialog>

+            <ModelParameters/>
+
            <v-menu
            >
              <template v-slot:activator="{ props }">
@@ -257,6 +270,14 @@ onNuxtReady(async () => {
                :title="$t('feedback')"
                @click="feedback"
            ></v-list-item>
+
+            <v-list-item
+                rounded="xl"
+                prepend-icon="logout"
+                :title="$t('signOut')"
+                @click="signOut"
+            ></v-list-item>
+
          </v-list>
        </div>
      </template>
@@ -277,29 +298,12 @@ onNuxtReady(async () => {
          @click="createNewConversion()"
      ></v-btn>

-<!--      <v-menu-->
-<!--      >-->
-<!--        <template v-slot:activator="{ props }">-->
-<!--          <v-btn-->
-<!--              v-bind="props"-->
-<!--              icon="help_outline"-->
-<!--              title="Feedback"-->
-<!--          ></v-btn>-->
-<!--        </template>-->
-<!--        <v-list-->
-<!--        >-->
-<!--          <v-list-item-->
-<!--              @click="feedback"-->
-<!--          >-->
-<!--            <v-list-item-title>{{ $t('feedback') }}</v-list-item-title>-->
-<!--          </v-list-item>-->
-<!--        </v-list>-->
-<!--      </v-menu>-->
    </v-app-bar>

    <v-main>
      <NuxtPage/>
    </v-main>
+
  </v-app>
 </template>

@@ -314,4 +318,5 @@ onNuxtReady(async () => {
  background-color: #999;
  border-radius: 3px;
 }
+
 </style>
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -11,7 +11,9 @@ export default defineNuxtConfig({
    },
    runtimeConfig: {
        public: {
-            appName: appName
+            appName: appName,
+            typewriter: false,
+            typewriterDelay: 50,
        }
    },
    build: {
@@ -23,9 +25,20 @@ export default defineNuxtConfig({
        'highlight.js/styles/panda-syntax-dark.css',
    ],
    modules: [
+        '@kevinmarrec/nuxt-pwa',
        '@nuxtjs/color-mode',
-        '@nuxtjs/i18n'
+        '@nuxtjs/i18n',
    ],
+    pwa: {
+        manifest: {
+            name: appName,
+            short_name: appName,
+            description: 'A ChatGPT web Client'
+        },
+        workbox: {
+            enabled: process.env.DEBUT_PWA === 'true',
+        }
+    },
    i18n: {
        strategy: 'no_prefix',
        locales: [
@@ -52,7 +65,7 @@ export default defineNuxtConfig({
    nitro: {
        devProxy: {
            "/api": {
-                target: "http://localhost:8000/api",
+                target: process.env.NUXT_DEV_SERVER ?? 'http://localhost:8000/api',
                prependPath: true,
                changeOrigin: true,
            }
--- a/package.json
+++ b/package.json
@@ -8,8 +8,10 @@
    "postinstall": "nuxt prepare"
  },
  "devDependencies": {
+    "@kevinmarrec/nuxt-pwa": "^0.17.0",
    "@nuxtjs/color-mode": "^3.2.0",
    "@nuxtjs/i18n": "^8.0.0-beta.9",
+    "@vite-pwa/nuxt": "^0.0.7",
    "material-design-icons-iconfont": "^6.7.0",
    "nuxt": "^3.2.0"
  },
@@ -18,7 +20,7 @@
    "copy-to-clipboard": "^3.3.3",
    "highlight.js": "^11.7.0",
    "is-mobile": "^3.1.1",
-    "marked": "^4.2.12",
+    "markdown-it": "^13.0.1",
    "nanoid": "^4.0.1",
    "vuetify": "^3.0.6"
  },
--- a/pages/account/onboarding.vue
+++ b/pages/account/onboarding.vue
@@ -45,8 +45,15 @@ onNuxtReady(() => {
              elevation="0"
          >
            <div class="text-center">
+              <div v-if="route.query.email_verification_required && route.query.email_verification_required === 'none'">
+                <h2 class="text-h4">Your registration is successful</h2>
+                <p class="mt-5">
+                  You can now <NuxtLink to="/account/signin">login</NuxtLink> to your account.
+                </p>
+              </div>
+              <div v-else>
                <h2 class="text-h4">Verify your email</h2>
-              <p class="text-body-2 mt-5">
+                <p class="mt-5">
                  We've sent a verification email to <strong>{{ $auth.user.email }}</strong>. <br>
                  Please check your inbox and click the link to verify your email address.
                </p>
@@ -64,6 +71,7 @@ onNuxtReady(() => {
                  {{ resent ? 'Resent' : 'Resend email'}}
                </v-btn>
              </div>
+            </div>
          </v-card>
        </v-col>
      </v-row>
--- a/pages/account/signup.vue
+++ b/pages/account/signup.vue
@@ -66,12 +66,16 @@ const submit = async () => {
        if (error.value.data.non_field_errors) {
          errorMsg.value = error.value.data.non_field_errors[0]
        }
+      } else {
+        if (error.value.data.detail) {
+          errorMsg.value = error.value.data.detail
        } else {
          errorMsg.value = 'Something went wrong. Please try again.'
        }
+      }
    } else {
      $auth.setUser(data.value.user)
-      navigateTo('/account/onboarding')
+      navigateTo('/account/onboarding?email_verification_required='+data.value.email_verification_required)
    }

    submitting.value = false
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -1,15 +1,47 @@
 <script setup>
+import Prompt from "~/components/Prompt.vue";
+
 definePageMeta({
  middleware: ["auth"]
 })
 import {EventStreamContentType, fetchEventSource} from '@microsoft/fetch-event-source'
 import { nextTick } from 'vue'
+import MessageActions from "~/components/MessageActions.vue";

 const { $i18n, $auth } = useNuxtApp()
 const runtimeConfig = useRuntimeConfig()
 const currentModel = useCurrentModel()
 const openaiApiKey = useApiKey()
 const fetchingResponse = ref(false)
+const messageQueue = []
+let isProcessingQueue = false
+
+const processMessageQueue = () => {
+  if (isProcessingQueue || messageQueue.length === 0) {
+    return
+  }
+  if (!currentConversation.value.messages[currentConversation.value.messages.length - 1].is_bot) {
+    currentConversation.value.messages.push({id: null, is_bot: true, message: ''})
+  }
+  isProcessingQueue = true
+  const nextMessage = messageQueue.shift()
+  if (runtimeConfig.public.typewriter) {
+    let wordIndex = 0;
+    const intervalId = setInterval(() => {
+      currentConversation.value.messages[currentConversation.value.messages.length - 1].message += nextMessage[wordIndex]
+      wordIndex++
+      if (wordIndex === nextMessage.length) {
+        clearInterval(intervalId)
+        isProcessingQueue = false
+        processMessageQueue()
+      }
+    }, runtimeConfig.public.typewriterDelay)
+  } else {
+    currentConversation.value.messages[currentConversation.value.messages.length - 1].message += nextMessage
+    isProcessingQueue = false
+    processMessageQueue()
+  }
+}

 let ctrl
 const abortFetch = () => {
@@ -20,6 +52,14 @@ const abortFetch = () => {
 }
 const fetchReply = async (message, parentMessageId) => {
  ctrl = new AbortController()
+
+  const data = Object.assign({}, currentModel.value, {
+    openaiApiKey: openaiApiKey.value,
+    message: message,
+    // parentMessageId: parentMessageId,
+    conversationId: currentConversation.value.id
+  })
+
  try {
    await fetchEventSource('/api/conversation/', {
      signal: ctrl.signal,
@@ -28,13 +68,7 @@ const fetchReply = async (message, parentMessageId) => {
        'accept': 'application/json',
        'Content-Type': 'application/json',
      },
-      body: JSON.stringify({
-        model: currentModel.value,
-        openaiApiKey: openaiApiKey.value,
-        message: message,
-        parentMessageId: parentMessageId,
-        conversationId: currentConversation.value.id
-      }),
+      body: JSON.stringify(data),
      onopen(response) {
        if (response.ok && response.headers.get('content-type') === EventStreamContentType) {
          return;
@@ -59,6 +93,13 @@ const fetchReply = async (message, parentMessageId) => {
          throw new Error(data.error);
        }

+        if (event === 'userMessageId') {
+          console.log(currentConversation.value.messages[currentConversation.value.messages.length - 1])
+          currentConversation.value.messages[currentConversation.value.messages.length - 1].id = data.userMessageId
+          console.log(currentConversation.value.messages[currentConversation.value.messages.length - 1])
+          return;
+        }
+
        if (event === 'done') {
          if (currentConversation.value.id === null) {
            currentConversation.value.id = data.conversationId
@@ -69,11 +110,8 @@ const fetchReply = async (message, parentMessageId) => {
          return;
        }

-        if (currentConversation.value.messages[currentConversation.value.messages.length - 1].is_bot) {
-          currentConversation.value.messages[currentConversation.value.messages.length - 1].message += data.content
-        } else {
-          currentConversation.value.messages.push({id: null, is_bot: true, message: data.content})
-        }
+        messageQueue.push(data.content)
+        processMessageQueue()

        scrollChatWindow()
      },
@@ -120,6 +158,14 @@ const showSnackbar = (text) => {
  snackbar.value = true
 }

+const editor = ref(null)
+const usePrompt = (prompt) => {
+  editor.value.usePrompt(prompt)
+}
+
+const deleteMessage = (index) => {
+  currentConversation.value.messages.splice(index, 1)
+}

 </script>

@@ -135,29 +181,24 @@ const showSnackbar = (text) => {
            cols="12"
        >
          <div
-              class="d-flex"
-              :class="message.is_bot ? 'justify-start mr-16' : 'justify-end ml-16'"
+              class="d-flex align-center"
+              :class="message.is_bot ? 'justify-start' : 'justify-end'"
          >
-            <v-card
-                :color="message.is_bot ? '' : 'primary'"
-                rounded="lg"
-                elevation="2"
-            >
-              <v-card-text>
-                <MsgContent :content="message.message" />
-              </v-card-text>
-
-<!--              <v-card-actions-->
-<!--                  v-if="message.is_bot"-->
-<!--              >-->
-<!--                <v-spacer></v-spacer>-->
-<!--                <v-tooltip text="Copy">-->
-<!--                  <template v-slot:activator="{ props }">-->
-<!--                    <v-btn v-bind="props" icon="content_copy"></v-btn>-->
-<!--                  </template>-->
-<!--                </v-tooltip>-->
-<!--              </v-card-actions>-->
-            </v-card>
+            <MessageActions
+                v-if="!message.is_bot"
+                :message="message"
+                :message-index="index"
+                :use-prompt="usePrompt"
+                :delete-message="deleteMessage"
+            />
+            <MsgContent :message="message" />
+            <MessageActions
+                v-if="message.is_bot"
+                :message="message"
+                :message-index="index"
+                :use-prompt="usePrompt"
+                :delete-message="deleteMessage"
+            />
          </div>
        </v-col>
      </v-row>
@@ -168,6 +209,7 @@ const showSnackbar = (text) => {
  <Welcome v-else />
  <v-footer app class="d-flex flex-column">
    <div class="px-md-16 w-100 d-flex align-center">
+      <Prompt v-show="!fetchingResponse" :use-prompt="usePrompt" />
      <v-btn
          v-show="fetchingResponse"
          icon="close"
@@ -175,7 +217,7 @@ const showSnackbar = (text) => {
          class="mr-3"
          @click="stop"
      ></v-btn>
-      <MsgEditor :send-message="send" :disabled="fetchingResponse" :loading="fetchingResponse" />
+      <MsgEditor ref="editor" :send-message="send" :disabled="fetchingResponse" :loading="fetchingResponse" />
    </div>

    <div class="px-4 py-2 text-disabled text-caption font-weight-light text-center w-100">
--- a/public/icon-black.svg
+++ b/public/icon-black.svg
@@ -0,0 +1,3 @@
+<svg width="900" height="900" viewBox="0 0 900 900" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M504.908 750H839.476C850.103 750.001 860.542 747.229 869.745 741.963C878.948 736.696 886.589 729.121 891.9 719.999C897.211 710.876 900.005 700.529 900 689.997C899.995 679.465 897.193 669.12 891.873 660.002L667.187 274.289C661.876 265.169 654.237 257.595 645.036 252.329C635.835 247.064 625.398 244.291 614.773 244.291C604.149 244.291 593.711 247.064 584.511 252.329C575.31 257.595 567.67 265.169 562.36 274.289L504.908 372.979L392.581 179.993C387.266 170.874 379.623 163.301 370.42 158.036C361.216 152.772 350.777 150 340.151 150C329.525 150 319.086 152.772 309.883 158.036C300.679 163.301 293.036 170.874 287.721 179.993L8.12649 660.002C2.80743 669.12 0.00462935 679.465 5.72978e-06 689.997C-0.00461789 700.529 2.78909 710.876 8.10015 719.999C13.4112 729.121 21.0523 736.696 30.255 741.963C39.4576 747.229 49.8973 750.001 60.524 750H270.538C353.748 750 415.112 713.775 457.336 643.101L559.849 467.145L614.757 372.979L779.547 655.834H559.849L504.908 750ZM267.114 655.737L120.551 655.704L340.249 278.586L449.87 467.145L376.474 593.175C348.433 639.03 316.577 655.737 267.114 655.737Z" fill="#0C0C0D"/>
+</svg>
--- a/public/icon.png
+++ b/public/icon.png
--- a/public/robots.txt
+++ b/public/robots.txt
@@ -0,0 +1,2 @@
+User-agent: *
+Allow: /
--- a/utils/enums.js
+++ b/utils/enums.js
@@ -1,6 +1,15 @@

 export const STORAGE_KEY = {
-    OPENAI_MODELS: 'openai_models',
-    CURRENT_OPENAI_MODEL: 'current_openai_model',
+    MODELS: 'models',
+    CURRENT_MODEL: 'current_model',
    OPENAI_API_KEY: 'openai_api_key',
 }
+
+export const DEFAULT_MODEL = {
+    name: 'gpt-3.5-turbo',
+    frequency_penalty: 0.0,
+    presence_penalty: 0.0,
+    max_tokens: 1000,
+    temperature: 0.7,
+    top_p: 1.0
+}
--- a/utils/localStorage.js
+++ b/utils/localStorage.js
@@ -11,32 +11,28 @@ const set = (key, val) => {
    localStorage.setItem(key, JSON.stringify(val))
 }

-const DEFAULT_OPENAI_MODEL = 'text-davinci-003'
-
 export const setModels = (val) => {
    const models = useModels()
-    set(STORAGE_KEY.OPENAI_MODELS, val)
+    set(STORAGE_KEY.MODELS, val)
    models.value = val
 }

 export const getStoredModels = () => {
-    let models = get(STORAGE_KEY.OPENAI_MODELS)
+    let models = get(STORAGE_KEY.MODELS)
    if (!models) {
-        models = [DEFAULT_OPENAI_MODEL]
+        models = [DEFAULT_MODEL]
    }
    return models
 }

-export const setCurrentModel = (val) => {
-    const model = useCurrentModel()
-    set(STORAGE_KEY.CURRENT_OPENAI_MODEL, val)
-    model.value = val
+export const saveCurrentModel = (val) => {
+    set(STORAGE_KEY.CURRENT_MODEL, val)
 }

 export const getCurrentModel = () => {
-    let model = get(STORAGE_KEY.CURRENT_OPENAI_MODEL)
+    let model = get(STORAGE_KEY.CURRENT_MODEL)
    if (!model) {
-        model = DEFAULT_OPENAI_MODEL
+        model = DEFAULT_MODEL
    }
    return model
 }
--- a/yarn.lock
+++ b/yarn.lock
Author	SHA1	Message	Date
Rafi	1ff1c46e37	Fix the bug of being unable to delete messages.	2023-03-22 15:55:06 +08:00
Rafi	afa3e499dc	add DEBUT_PWA env variable	2023-03-22 14:12:49 +08:00
Rafi	70ce5746bc	Merge remote-tracking branch 'origin/main' into main # Conflicts: # nuxt.config.ts # yarn.lock	2023-03-22 13:50:53 +08:00
Rafi	35d4292d29	Import the @kevinmarrec/nuxt-pwa module to fix the related bugs of PWA feature.	2023-03-21 22:13:02 +08:00
Rafi	8bbc44e7bf	update nuxt.config.ts	2023-03-21 18:48:35 +08:00
Rafi	3dcb4be6e4	add robots.txt	2023-03-21 18:06:44 +08:00
Rafi	83f8072625	mv @vite-pwa/nuxt to devDependencies	2023-03-21 13:46:02 +08:00
Rafi	3992121b71	update: docker-compose.yml	2023-03-21 10:20:08 +08:00
Rafi	d08806f0c9	update readme	2023-03-20 22:15:13 +08:00
Rafi	85ac73efcc	Add email verification requirement judgment after completing registration	2023-03-20 22:03:53 +08:00
Rafi	7cc5a6b347	Fix: the language settings dialog not displaying the close button.	2023-03-20 20:13:23 +08:00
Rafi	983e4d436d	update: deployment.sh	2023-03-20 12:54:11 +08:00
Rafi	727826f1b1	Added a Sign-out button	2023-03-19 14:26:46 +08:00
Rafi	386659109c	Added a new message action: delete	2023-03-19 13:49:12 +08:00
Rafi	bd9e8bf45e	Optimize the editor and enhance the user experience.	2023-03-19 13:39:20 +08:00
Rafi	4e40530a8c	Added a new message action: edit	2023-03-19 13:13:27 +08:00
Rafi	ea69a350f4	add environment variable NUXT_DEV_SERVER	2023-03-19 12:53:44 +08:00
Rafi	18a4251714	feat: Message actions	2023-03-17 18:27:07 +08:00
Rafi	878fda0054	Support configuring model parameters in the front-end and storing them in localStorage.	2023-03-17 17:01:18 +08:00
Rafi	1f3a025918	feature: pwa	2023-03-17 12:36:24 +08:00
Rafi	f9db3e5866	update readme	2023-03-15 11:23:35 +08:00
Rafi	c9615ed05c	catch error detail in signup page	2023-03-15 11:12:05 +08:00
Rafi	0d4b6247e2	docker-compose.yml includes restart: always in each service	2023-03-14 16:04:59 +08:00
Rafi	c9c3431cff	Update deployment.sh	2023-03-14 13:00:23 +08:00
Rafi	46abf3daa0	Solve the problem of not clearing the messages on the right side when deleting the current conversation.	2023-03-10 11:21:58 +08:00
Rafi	8dcd7f46b1	Add 2 environment variables to control the typewriter effect:	2023-03-10 10:57:45 +08:00
Rafi	33d9c392fa	Resolve the issue of missing indentation for "ol" tag in message content.	2023-03-10 10:17:26 +08:00
Rafi	bb17cdd123	Using markdown-it instead of marked as the markdown parser significantly improves the flickering issue during message rendering.	2023-03-09 23:35:56 +08:00
Rafi	4cfc9f4aea	Temporarily disable the typewriter effect and improve the highlight method	2023-03-09 23:03:20 +08:00
Rafi	cd50086c1e	update readme	2023-03-09 18:24:55 +08:00
Rafi	7e5498f779	update demog	2023-03-09 18:23:26 +08:00
Rafi	d933236a5d	update demog	2023-03-09 18:23:11 +08:00
Rafi	0be2d45cd5	update demo	2023-03-09 18:22:09 +08:00
Rafi	e24ad26d99	update demo	2023-03-09 18:21:59 +08:00
Rafi	052f5299a0	Add frequently used prompt function.	2023-03-09 17:39:45 +08:00
Rafi	8340edbf40	Add typewriter effect to the messages of the model.	2023-03-09 15:05:40 +08:00
Rafi	7bff84638e	update demo.png	2023-03-08 16:43:32 +08:00
Rafi	54660706e3	update demo.png	2023-03-08 16:41:58 +08:00