Merge branch 'develop'

src/app/content/index.tsx

@@ -6,7 +6,7 @@ import { RemeshRoot, RemeshScope } from 'remesh-react'
 import { defineContentScript, createShadowRootUi } from '#imports'
 
 import App from './App'
-import { LocalStorageImpl, IndexDBStorageImpl, BrowserSyncStorageImpl } from '@/domain/impls/Storage'
+import { LocalStorageImpl, IndexDBStorageImpl, BrowserSyncStorageImpl, indexDBStorage } from '@/domain/impls/Storage'
 import { DanmakuImpl } from '@/domain/impls/Danmaku'
 import { NotificationImpl } from '@/domain/impls/Notification'
 import { ToastImpl } from '@/domain/impls/Toast'
@@ -18,6 +18,8 @@ import '@/assets/styles/tailwind.css'
 import '@/assets/styles/overlay.css'
 import NotificationDomain from '@/domain/Notification'
 import { createElement } from '@/utils'
+import { version } from '@/../package.json'
+import { VERSION_STORAGE_KEY } from '@/constants/config'
 
 export default defineContentScript({
   cssInjectionMode: 'ui',
@@ -25,6 +27,29 @@ export default defineContentScript({
   matches: ['https://*/*'],
   excludeMatches: ['*://localhost/*', '*://127.0.0.1/*', '*://*.csdn.net/*', '*://*.csdn.com/*'],
   async main(ctx) {
+    // Check version and clear IndexDB if updated
+    const storedVersion = await indexDBStorage.getItem<string>(VERSION_STORAGE_KEY)
+    if (storedVersion !== version) {
+      try {
+        if (storedVersion) {
+          await indexDBStorage.clear()
+          console.log(
+            `%c[WebChat]%c IndexDB cleared due to version update: ${storedVersion} -> ${version}`,
+            'color: #10b981; font-weight: bold;',
+            'color: inherit;'
+          )
+        }
+        await indexDBStorage.setItem(VERSION_STORAGE_KEY, version)
+      } catch (error) {
+        console.error(
+          '%c[WebChat]%c Failed to clear IndexDB on update:',
+          'color: #10b981; font-weight: bold;',
+          'color: inherit;',
+          error
+        )
+      }
+    }
+
     const store = Remesh.store({
       externs: [
         LocalStorageImpl,

src/constants/config.ts

@@ -186,13 +186,15 @@ export const BREAKPOINTS = {
 
 export const MESSAGE_MAX_LENGTH = 500 as const
 
-export const STORAGE_NAME = `WEB_CHAT_${version}` as const
+export const STORAGE_NAME = `WEB_CHAT_STORAGE` as const
 
 export const USER_INFO_STORAGE_KEY = 'WEB_CHAT_USER_INFO' as const
 
 export const MESSAGE_LIST_STORAGE_KEY = 'WEB_CHAT_MESSAGE_LIST' as const
 
 export const APP_STATUS_STORAGE_KEY = 'WEB_CHAT_APP_STATUS' as const
+
+export const VERSION_STORAGE_KEY = 'WEB_CHAT_VERSION' as const
 /**
  * In chrome storage.sync, each key-value pair supports a maximum storage of 8kb
  * Image is encoded as base64, and the size is increased by about 33%.

src/domain/impls/Storage.ts

@@ -18,7 +18,7 @@ export const localStorage = createStorage({
 })
 
 export const indexDBStorage = createStorage({
-  driver: indexedDbDriver({ base: `${STORAGE_NAME}:` })
+  driver: indexedDbDriver({ dbName: __NAME__, storeName: __NAME__, base: `${STORAGE_NAME}:` })
 })
 
 export const browserSyncStorage = createStorage({