feat(rn): 增加服务列表持久化

2 years ago · 93985b02fb
parent c972eb8937
commit 93985b02fb
5 changed files with 88 additions and 33 deletions
--- a/client/mobile/ios/Podfile.lock
+++ b/client/mobile/ios/Podfile.lock
@ -417,6 +417,8 @@ PODS:
    - React-perflogger (= 0.71.2)
  - ReactNativeUiLib (3.0.9):
    - React
+  - RNCAsyncStorage (1.17.11):
+    - React-Core
  - RNGestureHandler (2.9.0):
    - React-Core
  - RNNotifee (7.4.0):
@ -517,6 +519,7 @@ DEPENDENCIES:
  - React-runtimeexecutor (from `../node_modules/react-native/ReactCommon/runtimeexecutor`)
  - ReactCommon/turbomodule/core (from `../node_modules/react-native/ReactCommon`)
  - ReactNativeUiLib (from `../node_modules/react-native-ui-lib`)
+  - "RNCAsyncStorage (from `../node_modules/@react-native-async-storage/async-storage`)"
  - RNGestureHandler (from `../node_modules/react-native-gesture-handler`)
  - "RNNotifee (from `../node_modules/@notifee/react-native`)"
  - RNReanimated (from `../node_modules/react-native-reanimated`)
@ -611,6 +614,8 @@ EXTERNAL SOURCES:
    :path: "../node_modules/react-native/ReactCommon"
  ReactNativeUiLib:
    :path: "../node_modules/react-native-ui-lib"
+  RNCAsyncStorage:
+    :path: "../node_modules/@react-native-async-storage/async-storage"
  RNGestureHandler:
    :path: "../node_modules/react-native-gesture-handler"
  RNNotifee:
@ -669,6 +674,7 @@ SPEC CHECKSUMS:
  React-runtimeexecutor: 4bf9a9086d27f74065fce1dddac274aa95216952
  ReactCommon: f697c0ac52e999aa818e43e2b6f277787c735e2d
  ReactNativeUiLib: 8d3804947431a465a69f09c5e785c988314612a9
+  RNCAsyncStorage: 8616bd5a58af409453ea4e1b246521bb76578d60
  RNGestureHandler: 071d7a9ad81e8b83fe7663b303d132406a7d8f39
  RNNotifee: da8dcf09f079ea22f46e239d7c406e10d4525a5f
  RNReanimated: cc5e3aa479cb9170bcccf8204291a6950a3be128
--- a/client/mobile/package.json
+++ b/client/mobile/package.json
@ -12,6 +12,7 @@
  },
  "dependencies": {
    "@notifee/react-native": "^7.4.0",
+    "@react-native-async-storage/async-storage": "^1.17.11",
    "immer": "^9.0.19",
    "lodash": "^4.17.21",
    "mini-star": "^2.0.8",
--- a/client/mobile/src/lib/utils/storage.ts
+++ b/client/mobile/src/lib/utils/storage.ts
@ -0,0 +1,19 @@
+import type { PersistStorage } from 'zustand/middleware/persist';
+import AsyncStorage from '@react-native-async-storage/async-storage';
+
+export const zustandRNStorage: PersistStorage<any> = {
+  async getItem(name) {
+    const d = await AsyncStorage.getItem(name);
+    if (!d) {
+      return null;
+    }
+
+    return JSON.parse(d);
+  },
+  setItem(name, value) {
+    return AsyncStorage.setItem(name, JSON.stringify(value));
+  },
+  removeItem: (name) => {
+    AsyncStorage.removeItem(name);
+  },
+};
--- a/client/mobile/src/store/server.ts
+++ b/client/mobile/src/store/server.ts
@ -1,6 +1,8 @@
 import { create } from 'zustand';
 import { immer } from 'zustand/middleware/immer';
+import { persist } from 'zustand/middleware';
 import { urlResolve } from '../lib/utils';
+import { zustandRNStorage } from '../lib/utils/storage';

 interface ServerInfo {
  name?: string;
@ -17,46 +19,54 @@ interface ServerStoreState {

 const defaultServerList: ServerInfo[] = [
  {
-    name: 'Tailchat Nightly',
+    name: 'Tailchat',
    url: 'https://nightly.paw.msgbyte.com/',
+    version: 'nightly',
  },
 ];

 export const useServerStore = create<ServerStoreState>()(
-  immer((set) => ({
-    serverList: defaultServerList,
-    selectedServerInfo: null,
-    addServer: async (url: string) => {
-      try {
-        // 获取 Tailchat 客户端配置
-        const res = await fetch(urlResolve(url, './tailchat.manifest'));
-        const clientConfig = await res.json();
-        const { version, serviceUrl } = clientConfig;
-        console.log('获取Tailchat客户端配置成功', clientConfig);
+  persist(
+    immer((set) => ({
+      serverList: defaultServerList,
+      selectedServerInfo: null,
+      addServer: async (url: string) => {
+        try {
+          // 获取 Tailchat 客户端配置
+          const res = await fetch(urlResolve(url, './tailchat.manifest'));
+          const clientConfig = await res.json();
+          const { version, serviceUrl } = clientConfig;
+          console.log('获取Tailchat客户端配置成功', clientConfig);

-        // 获取 Tailchat 服务端配置
-        const res2 = await fetch(
-          urlResolve(serviceUrl ?? url, './api/config/client')
-        );
-        const serviceConfig = (await res2.json()).data;
-        console.log('获取Tailchat服务端配置成功', serviceConfig);
+          // 获取 Tailchat 服务端配置
+          const res2 = await fetch(
+            urlResolve(serviceUrl ?? url, './api/config/client')
+          );
+          const serviceConfig = (await res2.json()).data;
+          console.log('获取Tailchat服务端配置成功', serviceConfig);

-        set((state) => {
-          state.serverList.push({
-            name: serviceConfig.appName ?? 'Tailchat',
-            url,
-            version,
+          set((state) => {
+            state.serverList.push({
+              name: serviceConfig.appName ?? 'Tailchat',
+              url,
+              version,
+            });
          });
+        } catch (err) {
+          console.error('获取服务器配置失败:', err);
+          throw err;
+        }
+      },
+      selectServer: (serverInfo: ServerInfo) => {
+        set({
+          selectedServerInfo: serverInfo,
        });
-      } catch (err) {
-        console.error('获取服务器配置失败:', err);
-        throw err;
-      }
-    },
-    selectServer: (serverInfo: ServerInfo) => {
-      set({
-        selectedServerInfo: serverInfo,
-      });
-    },
-  }))
+      },
+    })),
+    {
+      name: 'server',
+      storage: zustandRNStorage,
+      partialize: (state) => ({ serverList: state.serverList }),
+    }
+  )
 );
--- a/client/mobile/yarn.lock
+++ b/client/mobile/yarn.lock
@ -1441,6 +1441,13 @@
  resolved "https://registry.npmmirror.com/@notifee/react-native/-/react-native-7.4.0.tgz#0f20744307bf3b800f7b56eb2d0bbdd474748d09"
  integrity sha512-c8pkxDQFRbw0JlUmTb07OTG/4LQHRj8MBodMLwEcO+SvqIxK8ya8zSUEzfdcdWsSVqdoym0v3zpSNroR3Quj/w==

+"@react-native-async-storage/async-storage@^1.17.11":
+  version "1.17.11"
+  resolved "https://registry.npmmirror.com/@react-native-async-storage/async-storage/-/async-storage-1.17.11.tgz#7ec329c1b9f610e344602e806b04d7c928a2341d"
+  integrity sha512-bzs45n5HNcDq6mxXnSsOHysZWn1SbbebNxldBXCQs8dSvF8Aor9KCdpm+TpnnGweK3R6diqsT8lFhX77VX0NFw==
+  dependencies:
+    merge-options "^3.0.4"
+
 "@react-native-community/cli-clean@^10.1.1":
  version "10.1.1"
  resolved "https://registry.npmmirror.com/@react-native-community/cli-clean/-/cli-clean-10.1.1.tgz#4c73ce93a63a24d70c0089d4025daac8184ff504"
@ -4589,6 +4596,11 @@ is-path-inside@^3.0.3:
  resolved "https://registry.npmmirror.com/is-path-inside/-/is-path-inside-3.0.3.tgz#d231362e53a07ff2b0e0ea7fed049161ffd16283"
  integrity sha512-Fd4gABb+ycGAmKou8eMftCupSir5lRxqf4aD/vd0cD2qc4HL07OjCeuHMr8Ro4CoMaeCKDB0/ECBOVWjTwUvPQ==

+is-plain-obj@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.npmmirror.com/is-plain-obj/-/is-plain-obj-2.1.0.tgz#45e42e37fccf1f40da8e5f76ee21515840c09287"
+  integrity sha512-YWnfyRwxL/+SsrWYfOpUtz5b3YD+nyfkHvjbcanzk8zgyO4ASD67uVMRt8k5bM4lLMDnXfriRhOpemw+NfT1eA==
+
 is-plain-object@^2.0.3, is-plain-object@^2.0.4:
  version "2.0.4"
  resolved "https://registry.npmmirror.com/is-plain-object/-/is-plain-object-2.0.4.tgz#2c163b3fafb1b606d9d17928f05c2a1c38e07677"
@ -5495,6 +5507,13 @@ memoize-one@^5.0.0, memoize-one@^5.0.5:
  resolved "https://registry.npmmirror.com/memoize-one/-/memoize-one-5.2.1.tgz#8337aa3c4335581839ec01c3d594090cebe8f00e"
  integrity sha512-zYiwtZUcYyXKo/np96AGZAckk+FWWsUdJ3cHGGmld7+AhvcWmQyGCYUh1hc4Q/pkOhb65dQR/pqCyK0cOaHz4Q==

+merge-options@^3.0.4:
+  version "3.0.4"
+  resolved "https://registry.npmmirror.com/merge-options/-/merge-options-3.0.4.tgz#84709c2aa2a4b24c1981f66c179fe5565cc6dbb7"
+  integrity sha512-2Sug1+knBjkaMsMgf1ctR1Ujx+Ayku4EdJN4Z+C2+JzoeF7A3OZ9KM2GY0CpQS51NR61LTurMJrRKPhSs3ZRTQ==
+  dependencies:
+    is-plain-obj "^2.1.0"
+
 merge-stream@^2.0.0:
  version "2.0.0"
  resolved "https://registry.npmmirror.com/merge-stream/-/merge-stream-2.0.0.tgz#52823629a14dd00c9770fb6ad47dc6310f2c1f60"