feat: notifer to config api keys first (#59)

feat: add notification when user first use ai box to indicate user to config the keys first Refs: #55 --------- Signed-off-by: seven <[email protected]>
geek-fun · May 13, 2024 · 7ea15e7 · 7ea15e7
1 parent 6d4402a
commit 7ea15e7
Show file tree

Hide file tree

Showing 8 changed files with 35 additions and 16 deletions.
diff --git a/components.d.ts b/components.d.ts
@@ -11,7 +11,6 @@ declare module 'vue' {
     MarkdownRender: typeof import('./src/components/MarkdownRender.vue')['default']
     NAlert: typeof import('naive-ui')['NAlert']
     NButton: typeof import('naive-ui')['NButton']
-    NButtonGroup: typeof import('naive-ui')['NButtonGroup']
     NCard: typeof import('naive-ui')['NCard']
     NConfigProvider: typeof import('naive-ui')['NConfigProvider']
     NDialogProvider: typeof import('naive-ui')['NDialogProvider']

diff --git a/src/common/customError.ts b/src/common/customError.ts
@@ -6,3 +6,7 @@ export class CustomError extends Error {
     super();
   }
 }
+
+export enum ErrorCodes {
+  MISSING_GPT_CONFIG = 999,
+}
diff --git a/src/electron/preload.ts b/src/electron/preload.ts
@@ -13,7 +13,8 @@ contextBridge.exposeInMainWorld('storeAPI', {
     ipcRenderer.invoke('storeAPI', { method: 'GET', key, value: defaultValue }),
   set: async (key: string, value: unknown) =>
     ipcRenderer.invoke('storeAPI', { method: 'SET', key, value }),
-  getSecret: async (key: string) => ipcRenderer.invoke('storeAPI', { method: 'GET_SECRET', key }),
+  getSecret: async (key: string, value: unknown) =>
+    ipcRenderer.invoke('storeAPI', { method: 'GET_SECRET', key, value }),
   setSecret: async (key: string, value: unknown) =>
     ipcRenderer.invoke('storeAPI', { method: 'SET_SECRET', key, value }),
 });

diff --git a/src/electron/storeApi.ts b/src/electron/storeApi.ts
@@ -53,10 +53,10 @@ const storeApi: { [key: string]: (key: string, val: unknown) => unknown } = {
     store.set(key, value);
   },
 
-  get_secret: (key: string) => {
+  get_secret: (key: string, defaultValue: unknown) => {
     const encryptedValue = store.get(key, '');
 
-    return encryptedValue ? JSON.parse(decryptValue(encryptedValue as string)) : undefined;
+    return encryptedValue ? JSON.parse(decryptValue(encryptedValue as string)) : defaultValue;
   },
 
   set_secret: (key: string, value: unknown) => {

diff --git a/src/lang/zhCN.ts b/src/lang/zhCN.ts
@@ -18,6 +18,7 @@ export const zhCN = {
     light: '月白主题',
     ai: {
       title: 'GPTs配置',
+      configGpt: '前往配置GPT',
       others: '其他GPTs',
       model: '模型',
       modelPlaceholder: '请输入GPT模型名称',

diff --git a/src/layout/components/chatbot-box.vue b/src/layout/components/chatbot-box.vue
@@ -23,6 +23,15 @@
           <n-alert :type="chatBotNotification.level">
             {{ chatBotNotification.message }}
           </n-alert>
+          <br />
+          <n-button
+            v-if="chatBotNotification.code === ErrorCodes.MISSING_GPT_CONFIG"
+            @click="configGpt"
+            strong
+            secondary
+            type="primary"
+            >{{ $t('setting.ai.configGpt') }}</n-button
+          >
         </div>
       </n-scrollbar>
     </div>
@@ -54,35 +63,45 @@ import { storeToRefs } from 'pinia';
 import { Bot, SendAlt, FaceCool } from '@vicons/carbon';
 import { ChatMessageRole, useChatStore } from '../../store';
 import MarkdownRender from '../../components/MarkdownRender.vue';
+import { ErrorCodes } from '../../common';
 
 const chatStore = useChatStore();
 const { chats } = storeToRefs(chatStore);
 const { sendMessage, fetchChats } = chatStore;
 
+const router = useRouter();
+
 const scrollbarRef = ref(null);
 const chatMsg = ref(''); // 聊天消息
 const chatBotNotification = ref({
   enabled: false,
   level: '',
   message: '',
+  code: 0,
 });
 // 提交消息
 const submitMsg = () => {
-  chatBotNotification.value = { enabled: false, level: '', message: '' };
+  chatBotNotification.value = { enabled: false, level: '', message: '', code: 0 };
   if (!chatMsg.value.trim().length) return;
   sendMessage(chatMsg.value)
     .catch(err => {
       chatBotNotification.value = {
         enabled: true,
         level: 'error',
         message: err.message,
+        code: 0,
       };
     })
     .finally(() => {
       scrollbarRef.value.scrollTo({ top: 999999 });
     });
   chatMsg.value = '';
 };
+
+const configGpt = () => {
+  router.push({ path: '/setting', replace: true });
+};
+
 fetchChats()
   .then(() => {
     scrollbarRef.value.scrollTo({ top: 999999 });
@@ -91,7 +110,8 @@ fetchChats()
     chatBotNotification.value = {
       enabled: true,
       level: 'error',
-      message: err.message,
+      message: err.details,
+      code: err.status,
     };
   });
 </script>

diff --git a/src/layout/components/tool-bar-right.vue b/src/layout/components/tool-bar-right.vue
@@ -22,7 +22,6 @@
 <script setup lang="ts">
 import { markRaw, ref } from 'vue';
 import { ChatBot } from '@vicons/carbon';
-import { getOpenAiConfig } from './../../store'
 import { useLang } from './../../lang'
 import TheAsideIcon from './the-aside-icon.vue';
 import ChatbotBox from './chatbot-box.vue';
@@ -36,11 +35,6 @@ const chatBot = ref({ active: false });
 const navClick = async (item: any) => {
   selectedItemId.value = item.id;
   if (item.id === 'chat-bot') {
-    const { apiKey } = await getOpenAiConfig();
-    if (!apiKey) {
-      message.error(lang.t('setting.ai.missing'));
-      return false;
-    }
     chatBot.value.active = !chatBot.value.active;
   }
 };

diff --git a/src/store/chatStore.ts b/src/store/chatStore.ts
@@ -1,7 +1,7 @@
 import { defineStore } from 'pinia';
 import { ulid } from 'ulidx';
 import { lang } from '../lang';
-import { pureObject } from '../common';
+import { CustomError, pureObject, ErrorCodes } from '../common';
 import { useConnectionStore } from './connectionStore';
 
 enum MessageStatus {
@@ -19,9 +19,9 @@ const { chatBotApi, storeAPI } = window;
 let receiveRegistration = false;
 
 export const getOpenAiConfig = async () => {
-  const { openAi } = await storeAPI.getSecret('aigcConfig', { openAi: undefined });
+  const { openAi } = await storeAPI.getSecret('aigcConfig', { openAi: null });
   if (!openAi) {
-    throw new Error(lang.global.t('setting.ai.missing'));
+    throw new CustomError(ErrorCodes.MISSING_GPT_CONFIG, lang.global.t('setting.ai.missing'));
   }
   return openAi;
 };
@@ -50,11 +50,11 @@ export const useChatStore = defineStore('chat', {
   actions: {
     async fetchChats() {
       const chats = await storeAPI.get('chats', undefined);
+      const { apiKey, httpProxy } = await getOpenAiConfig();
       if (!chats || !chats.length) {
         return;
       }
       const { assistantId } = chats[0];
-      const { apiKey, httpProxy } = await getOpenAiConfig();
       const assistant = await chatBotApi.findAssistant({ apiKey, assistantId, httpProxy });
       if (!assistant) {
         this.chats = [];