feat(status): preserve sandbox messages

packages/plugin-status/client/index.ts

@@ -21,8 +21,9 @@ export namespace storage {
     localStorage.setItem(prefix + key, JSON.stringify(value))
   }
 
-  export function create<T>(key: string, fallback?: T) {
-    const wrapper = ref<T>(fallback ? { ...fallback, ...get(key) } : get(key))
+  export function create<T>(key: string, fallback?: T, merge?: boolean) {
+    const value = get(key)
+    const wrapper = ref<T>(merge ? { ...fallback, ...value } : value || fallback)
     watch(wrapper, () => set(key, wrapper.value), {
       deep: typeof fallback === 'object',
     })
@@ -40,7 +41,7 @@ interface Config {
 }
 
 export const user = storage.create<User>('user')
-export const config = storage.create<Config>('config', { authType: 0 })
+export const config = storage.create<Config>('config', { authType: 0 }, true)
 export const profile = ref<Profile>(null)
 export const registry = ref<Registry>(null)
 export const stats = ref<Statistics>(null)

packages/plugin-status/client/views/sandbox.vue

@@ -11,8 +11,8 @@
 
 <script lang="ts" setup>
 
-import { ref, reactive, nextTick } from 'vue'
-import { send, receive, user } from '~/client'
+import { ref, watch, nextTick } from 'vue'
+import { send, receive, user, storage } from '~/client'
 
 interface Message {
   from: 'user' | 'bot'
@@ -21,10 +21,12 @@ interface Message {
 
 const text = ref('')
 const panel = ref<Element>(null)
-const messages = reactive<Message[]>([])
+const messages = storage.create<Message[]>('messages', [])
+
+watch(user, () => messages.value = [])
 
 function addMessage(from: 'user' | 'bot', content: string) {
-  messages.push({ from, content })
+  messages.value.push({ from, content })
   const { scrollTop, clientHeight, scrollHeight } = panel.value
   if (Math.abs(scrollTop + clientHeight - scrollHeight) < 1) {
     nextTick(scrollToBottom)

packages/plugin-status/server/webui.ts

@@ -13,7 +13,7 @@ export { BotData, LoadRate } from './profile'
 export interface Config extends WebAdapter.Config, Profile.Config {
   selfUrl?: string
   uiPath?: string
-  mode?: 'development' | 'production'
+  devMode?: boolean
 }
 
 export interface PluginData extends Plugin.Meta {
@@ -32,17 +32,17 @@ export const name = 'webui'
 
 export function apply(ctx: Context, config: Config = {}) {
   const koishiPort = assertProperty(ctx.app.options, 'port')
-  const { apiPath, uiPath, mode, selfUrl = `http://localhost:${koishiPort}` } = config
+  const { apiPath, uiPath, devMode, selfUrl = `http://localhost:${koishiPort}` } = config
 
   const globalVariables = Object.entries({
     KOISHI_UI_PATH: uiPath,
     KOISHI_ENDPOINT: selfUrl + apiPath,
   }).map(([key, value]) => `window.${key} = ${JSON.stringify(value)};`).join('\n')
 
-  const root = resolve(__dirname, '..', mode === 'development' ? 'client' : 'dist')
+  const root = resolve(__dirname, '..', devMode ? 'client' : 'dist')
 
   async function createVite() {
-    if (mode !== 'development') return
+    if (!devMode) return
 
     const vite = await createServer({
       root,