feat: use pinia

plugins/unAutoImport.ts

@@ -12,6 +12,7 @@ export const unAutoImport = (): Plugin[] => {
         'vue',
         'vue-router',
         '@vueuse/core',
+        'pinia',
         {
           'naive-ui': [
             'useDialog',

src/components/ErrorDlg.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { settingsStorage } from '@/utils/storage';
-import store from '@/utils/store';
+import { useGlobalStore } from '@/store';
+const store = useGlobalStore();
 </script>
 <template>
   <NModal

src/main.ts

@@ -1,8 +1,9 @@
-import 'virtual:uno.css';
 import 'normalize.css';
+import { createPinia } from 'pinia';
+import 'virtual:uno.css';
 import App from './App.vue';
-import router from './router';
 import i18n from './i18n';
+import router from './router';
 import { commitLog } from './utils/commit';
 import root from './utils/root';
 import { dataInitTasks } from './utils/storage';
@@ -15,10 +16,11 @@ router.beforeEach(async (to, from, next) => {
   }
   next();
 });
-
+const pinia = createPinia();
 const app = createApp(App);
 app.use(i18n);
 app.use(router);
+app.use(pinia);
 app.mount(root);
 
 if (import.meta.env.PROD) {

src/store.ts

@@ -0,0 +1,17 @@
+export interface GlobalStoreState {
+  networkErrorDlgVisible: boolean;
+  githubErrorDlgVisible: boolean;
+  wasmErrorDlgVisible: boolean;
+  wasmSupported?: boolean;
+}
+
+export const useGlobalStore = defineStore('global', {
+  state(): GlobalStoreState {
+    return {
+      networkErrorDlgVisible: false,
+      githubErrorDlgVisible: false,
+      wasmErrorDlgVisible: false,
+      wasmSupported: undefined,
+    };
+  },
+});

src/utils/fetch.ts

@@ -1,12 +1,13 @@
 import { GM_fetch, gmOk } from './gm';
-import store from './store';
 import { isAllowCorsUrl } from './url';
+import { useGlobalStore } from '@/store';
 
 export const enhanceFetch = async (
   input: RequestInfo | URL,
   init?: RequestInit,
   options?: { proxy?: boolean },
 ) => {
+  const store = useGlobalStore();
   const req = new Request(input);
   const u = new URL(req.url);
   if (isAllowCorsUrl(u)) return fetch(input, { ...init, mode: 'cors' });

src/utils/github.ts

@@ -1,14 +1,15 @@
-import { enhanceFetch } from './fetch';
-import store from './store';
-import { uploadPoliciesAssets } from 'user-attachments';
+import { useGlobalStore } from '@/store';
 import type { PoliciesAsset } from 'user-attachments';
+import { uploadPoliciesAssets } from 'user-attachments';
+import { enhanceFetch } from './fetch';
 
 export type GithubPoliciesAsset = PoliciesAsset;
 
 export const uploadAsset = async (
   bf: ArrayBuffer,
   name: string,
 ): Promise<PoliciesAsset> => {
+  const store = useGlobalStore();
   return await uploadPoliciesAssets({
     file: new File([bf], name),
     url: 'https://github.com/gkd-kit/inspect/issues/1',

src/utils/selector.ts

@@ -1,43 +1,43 @@
+import { useGlobalStore } from '@/store';
 import {
-  Transform,
-  Selector,
-  updateWasmToMatches,
-  getStringInvoke,
+  Context,
+  FastQuery,
+  getBooleanInvoke,
   getIntInvoke,
   getStringAttr,
-  getBooleanInvoke,
+  getStringInvoke,
   initDefaultTypeInfo,
+  MatchOption,
   MismatchExpressionTypeException,
   MismatchOperatorTypeException,
   MismatchParamTypeException,
+  Selector,
+  Transform,
   UnknownIdentifierException,
   UnknownIdentifierMethodException,
+  UnknownIdentifierMethodParamsException,
   UnknownMemberException,
   UnknownMemberMethodException,
-  UnknownIdentifierMethodParamsException,
   UnknownMemberMethodParamsException,
-  Context,
-  MatchOption,
-  FastQuery,
+  updateWasmToMatches,
 } from '@gkd-kit/selector';
-import type { RawNode } from './types';
 import matchesInstantiate from '@gkd-kit/wasm_matches';
 import matchesWasmUrl from '@gkd-kit/wasm_matches/dist/mod.wasm?url';
-import store from './store';
-import { settingsStorage } from './storage';
 import { isRawNode } from './node';
+import { settingsStorage } from './storage';
+import type { RawNode } from './types';
 
 export const wasmLoadTask = matchesInstantiate(fetch(matchesWasmUrl))
   .then((mod) => {
     const toMatches = mod.exports.toMatches;
     updateWasmToMatches(toMatches as any);
-    store.wasmSupported = true;
+    useGlobalStore().wasmSupported = true;
     if (import.meta.env.PROD) {
       console.log('use wasm matches');
     }
   })
   .catch((e) => {
-    store.wasmSupported = false;
+    useGlobalStore().wasmSupported = false;
     console.error(e);
     if (import.meta.env.PROD) {
       console.log('use js matches');
@@ -129,6 +129,7 @@ const typeInfo = initDefaultTypeInfo(true).globalType;
 const matchOption = new MatchOption(false, false);
 
 export const parseSelector = (source: string): GkdSelector => {
+  const store = useGlobalStore();
   const s = Selector.Companion.parse(source);
   for (const exp of s.binaryExpressions) {
     if (exp.operator.value.key == '~=' && !store.wasmSupported) {