From 2152b3f779b47f70e4442ff4c850db10048733d3 Mon Sep 17 00:00:00 2001
From: Kirk Lin <linkirk@163.com>
Date: Thu, 19 Oct 2023 16:17:49 +0800
Subject: [PATCH] feat: add pinia persist plugin (#3173)

---
 package.json                |  1 +
 pnpm-lock.yaml              | 11 +++++++++++
 src/store/index.ts          |  2 ++
 src/store/plugin/persist.ts | 38 +++++++++++++++++++++++++++++++++++++
 4 files changed, 52 insertions(+)
 create mode 100644 src/store/plugin/persist.ts

diff --git a/package.json b/package.json
index f50805f1..18a24bcf 100644
--- a/package.json
+++ b/package.json
@@ -90,6 +90,7 @@
     "nprogress": "^0.2.0",
     "path-to-regexp": "^6.2.1",
     "pinia": "2.1.4",
+    "pinia-plugin-persistedstate": "^3.2.0",
     "print-js": "^1.6.0",
     "qrcode": "^1.5.3",
     "qs": "^6.11.2",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index c121c2dd..d285ef5d 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -77,6 +77,9 @@ importers:
       pinia:
         specifier: 2.1.4
         version: 2.1.4(typescript@5.1.6)(vue@3.3.4)
+      pinia-plugin-persistedstate:
+        specifier: ^3.2.0
+        version: 3.2.0(pinia@2.1.4)
       print-js:
         specifier: ^1.6.0
         version: 1.6.0
@@ -9075,6 +9078,14 @@ packages:
     requiresBuild: true
     optional: true
 
+  /pinia-plugin-persistedstate@3.2.0(pinia@2.1.4):
+    resolution: {integrity: sha512-tZbNGf2vjAQcIm7alK40sE51Qu/m9oWr+rEgNm/2AWr1huFxj72CjvpQcIQzMknDBJEkQznCLAGtJTIcLKrKdw==}
+    peerDependencies:
+      pinia: ^2.0.0
+    dependencies:
+      pinia: 2.1.4(typescript@5.1.6)(vue@3.3.4)
+    dev: false
+
   /pinia@2.1.4(typescript@5.1.6)(vue@3.3.4):
     resolution: {integrity: sha512-vYlnDu+Y/FXxv1ABo1vhjC+IbqvzUdiUC3sfDRrRyY2CQSrqqaa+iiHmqtARFxJVqWQMCJfXx1PBvFs9aJVLXQ==}
     peerDependencies:
diff --git a/src/store/index.ts b/src/store/index.ts
index efaf6c97..9ceca5a6 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -1,7 +1,9 @@
 import type { App } from 'vue';
 import { createPinia } from 'pinia';
+import { registerPiniaPersistPlugin } from '@/store/plugin/persist';
 
 const store = createPinia();
+registerPiniaPersistPlugin(store);
 
 export function setupStore(app: App<Element>) {
   app.use(store);
diff --git a/src/store/plugin/persist.ts b/src/store/plugin/persist.ts
new file mode 100644
index 00000000..4fa176e4
--- /dev/null
+++ b/src/store/plugin/persist.ts
@@ -0,0 +1,38 @@
+/**
+ * Pinia Persist Plugin
+ * Pinia 持久化插件
+ * @link https://prazdevs.github.io/pinia-plugin-persistedstate/zh/guide/
+ *
+ */
+import type { Pinia } from 'pinia';
+import { createPersistedState } from 'pinia-plugin-persistedstate';
+import type { PersistedStateFactoryOptions } from 'pinia-plugin-persistedstate';
+import { getCommonStoragePrefix } from '@/utils/env';
+
+export const PERSIST_KEY_PREFIX = getCommonStoragePrefix();
+
+// TODO customSerializer
+
+/**
+ * Register Pinia Persist Plugin
+ * 注册 Pinia 持久化插件
+ *
+ * @param pinia Pinia instance Pinia 实例
+ */
+export function registerPiniaPersistPlugin(pinia: Pinia) {
+  pinia.use(createPersistedState(createPersistedStateOptions(PERSIST_KEY_PREFIX)));
+}
+
+/**
+ * Create Persisted State Options
+ * 创建持久化状态选项
+ *
+ * @param keyPrefix prefix for storage key 储存键前缀
+ * @returns persisted state factory options
+ */
+export function createPersistedStateOptions(keyPrefix: string): PersistedStateFactoryOptions {
+  return {
+    storage: localStorage,
+    key: (id) => `${keyPrefix}__${id}`,
+  };
+}