refactor: Use IndexedDB as storage (#576)

package.json

@@ -27,15 +27,19 @@
   "dependencies": {
     "@kangc/v-md-editor": "^2.3.16",
     "@mdi/font": "^7.2.96",
+    "@vueuse/rxjs": "^10.4.1",
     "async-lock": "^1.4.0",
     "axios": "^1.5.1",
     "babel-plugin-prismjs": "^2.1.0",
     "compare-versions": "^6.1.0",
     "core-js": "^3.32.2",
+    "dexie": "^4.0.1-alpha.25",
     "electron-builder": "^24.6.4",
     "katex": "^0.16.8",
     "langchain": "~0.0.156",
+    "localforage": "^1.10.0",
     "material-design-icons": "^3.0.1",
+    "rxjs": "^7.8.1",
     "sortablejs": "^1.15.0",
     "update-electron-app": "^2.0.1",
     "uuid": "^9.0.1",

src/App.vue

@@ -120,12 +120,10 @@
         </v-app-bar>
         <FindModal ref="findRef"></FindModal>
 
-        <ChatMessages
-          :chat-index="store.state.currentChatIndex"
-          :columns="columns"
-        ></ChatMessages>
+        <ChatMessages :chat="currentChat" :columns="columns"></ChatMessages>
         <FooterBar
           ref="footerBarRef"
+          :chat="currentChat"
           @update-active-bots="(bots) => (activeBots = bots)"
         ></FooterBar>
       </v-main>
@@ -162,6 +160,9 @@ import {
 } from "./components/ShortcutGuide/shortcut.const";
 
 import i18n from "./i18n";
+import Chats from "@/store/chats";
+import { useObservable } from "@vueuse/rxjs";
+import { liveQuery } from "dexie";
 
 // Components
 import ChatDrawer from "@/components/ChatDrawer/ChatDrawer.vue";
@@ -187,6 +188,15 @@ const onUpdatedSystemTheme = async () => {
   applyTheme(resolvedTheme, vuetifyTheme);
 };
 
+const currentChat = useObservable(
+  liveQuery(() => {
+    const chat = Chats.table.orderBy("selectedTime").last();
+    console.log("chat changed");
+    return chat;
+  }),
+  { initialValue: {} },
+);
+
 ipcRenderer.on("on-updated-system-theme", onUpdatedSystemTheme);
 
 const confirmModal = ref(null);

src/bots/Bot.js

@@ -1,5 +1,6 @@
 import i18n from "@/i18n";
 import store from "@/store";
+import Chats from "@/store/chats";
 
 export default class Bot {
   static _logoPackedPaths = null;
@@ -247,7 +248,9 @@ export default class Bot {
    * @returns {object} - Chat context defined by the bot
    */
   async getChatContext(createIfNotExists = true) {
-    let context = store.getters.currentChat?.contexts?.[this.getClassname()];
+    let context = (await Chats.getCurrentChat())?.contexts?.[
+      this.getClassname()
+    ];
     if (!context && createIfNotExists) {
       context = await this.createChatContext();
       this.setChatContext(context);

src/components/ChatAction.vue

@@ -83,6 +83,7 @@ import { preview } from "../helpers/template-helper";
 import ChatPrompt from "@/components/Messages/ChatPrompt.vue";
 import BotLogo from "@/components/Footer/BotLogo.vue";
 import _bots from "@/bots";
+import Chats from "@/store/chats";
 
 const store = useStore();
 const isEdit = ref(false);
@@ -140,8 +141,10 @@ function closeDialog(value) {
 }
 
 async function send() {
+  let newChatIndex;
   if (chatRef.value === "new") {
-    await store.dispatch("createChatAndSelect");
+    newChatIndex = await Chats.add();
+    store.commit("selectChat", newChatIndex);
   }
   await store
     .dispatch("sendPrompt", {
@@ -151,7 +154,10 @@ async function send() {
     .then(() => {
       if (chatRef.value === "new") {
         store.commit("editChatTitle", {
-          title: previewTextarea.value.substring(0, 30),
+          index: newChatIndex,
+          payload: {
+            title: previewTextarea.value.substring(0, 30),
+          },
         });
       }
     });