Fix: refactor configManager to improve synchronization with store

Rel1cx · Apr 16, 2023 · 50aee98 · 50aee98
1 parent 56276cb
commit 50aee98
Show file tree

Hide file tree

Showing 5 changed files with 85 additions and 70 deletions.
diff --git a/package.json b/package.json
@@ -3,16 +3,16 @@
     "version": "1.0.6",
     "type": "module",
     "scripts": {
-        "dev": "vite",
         "build": "typesafe-i18n --no-watch && tsc && vite build",
-        "preview": "vite preview",
-        "tauri": "tauri",
-        "lint:ts": "tsc --noEmit && eslint src",
-        "format:rs": "cd src-tauri && cargo fmt",
-        "lint:rs": "cd src-tauri && cargo clippy",
-        "lint": "pnpm run lint:ts --fix && pnpm run lint:rs",
         "clean": "rm -rf dist node_modules pnpm-lock.yaml && cd src-tauri && cargo clean",
+        "dev": "vite",
+        "format:rs": "cd src-tauri && cargo fmt",
         "i18n": "typesafe-i18n",
+        "lint": "pnpm run lint:ts --fix && pnpm run lint:rs",
+        "lint:rs": "cd src-tauri && cargo clippy",
+        "lint:ts": "tsc --noEmit && eslint src",
+        "preview": "vite preview",
+        "tauri": "tauri",
         "update-version": "tsx ./scripts/update_version.ts"
     },
     "dependencies": {
@@ -29,7 +29,7 @@
         "react-use": "17.4.0",
         "ress": "5.0.2",
         "tauri-plugin-autostart-api": "https://github.com/tauri-apps/tauri-plugin-autostart",
-        "tauri-plugin-store-api": "github:tauri-apps/tauri-plugin-store",
+        "tauri-plugin-store-api": "https://github.com/tauri-apps/tauri-plugin-store",
         "throttle-debounce": "5.0.0",
         "ts-pattern": "4.2.2",
         "valtio": "1.10.4",
@@ -45,7 +45,7 @@
         "@vitejs/plugin-react": "3.1.0",
         "core-dts": "0.0.3",
         "eslint": "8.38.0",
-        "eslint-config-with-tsconfig": "1.3.4",
+        "eslint-config-with-tsconfig": "https://github.com/Mikufied/eslint-config-with-tsconfig",
         "eslint-import-resolver-typescript": "3.5.5",
         "sass": "1.62.0",
         "tsx": "3.12.6",
@@ -62,4 +62,4 @@
             "esbuild": "0.17.16"
         }
     }
-}
+}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/config.ts b/src/config.ts
@@ -1,5 +1,5 @@
 import { Result } from '@swan-io/boxed'
-import { type UnlistenFn } from '@tauri-apps/api/event'
+import  { type UnlistenFn } from '@tauri-apps/api/event'
 import { Store } from 'tauri-plugin-store-api'
 import { proxy, useSnapshot } from 'valtio'
 
@@ -12,12 +12,13 @@ const PROXY_KEY = Symbol('CONFIG_PROXY')
 export type ConfigManager = Readonly<{
     [STORE_KEY]: Store,
     [PROXY_KEY]: Config,
+
     parse: (config: AnyObject) => Result<Config, Error>,
     setConfig: <T extends keyof Config>(key: T, value: Config[T]) => Promise<void>,
     useConfig: () => [Config, ConfigManager['setConfig']]
     loadConfig: () => Promise<Result<Config, Error>>,
     resetConfig: () => Promise<void>,
-    syncChangesToProxy: () => Promise<UnlistenFn>,
+    beginSyncConfig: () => Promise<UnlistenFn>
 }>
 
 export const defaultConfig: Readonly<Config> = Config.parse({})
@@ -31,6 +32,7 @@ export const configManager: ConfigManager = {
     useConfig: () => [useSnapshot(configManager[PROXY_KEY]), configManager.setConfig],
 
     setConfig: async (key, value) => {
+        configManager[PROXY_KEY][key] = value
         await configManager[STORE_KEY].set(key, value)
         await configManager[STORE_KEY].save()
     },
@@ -45,11 +47,13 @@ export const configManager: ConfigManager = {
 
     resetConfig: async () => {
         await configManager[STORE_KEY].reset()
-        await configManager[STORE_KEY].save()
     },
 
-    syncChangesToProxy: async () => {
+    beginSyncConfig: async () => {
         return configManager[STORE_KEY].onChange((key, value) => {
+            if (Reflect.get(configManager[PROXY_KEY], key) === value) {
+                return
+            }
             Reflect.set(configManager[PROXY_KEY], key, value)
         })
     }

diff --git a/src/main.ts b/src/main.ts
@@ -23,11 +23,14 @@ const main = async () => {
         }
     })
 
-    await configManager.syncChangesToProxy()
-
+    await configManager.beginSyncConfig()
+    
     renderApp('#app').match({
         Ok: () => {
-            document.addEventListener('contextmenu', event => { event.preventDefault(); }, {
+            if (import.meta.env.DEV) {
+                return
+            }
+            document.addEventListener('contextmenu', event => void event.preventDefault(), {
                 capture: true
             });
         },

diff --git a/src/pages/Main/index.tsx b/src/pages/Main/index.tsx
@@ -1,5 +1,6 @@
 import { Input } from '@mantine/core'
 import { exit } from '@tauri-apps/api/process'
+import { debounce } from 'throttle-debounce'
 
 import { Button } from '@/components/Button'
 import { Divider } from '@/components/Divider'
@@ -20,7 +21,7 @@ const marks = [
     { value: 100, label: '100' }
 ]
 
-export const handleOpenPreferences = async () => {
+const handleOpenPreferences = async () => {
     const window = await getWebviewWindow('preferences')
 
     if (window.isSome()) {
@@ -32,6 +33,10 @@ export const handleOpenPreferences = async () => {
     console.error('Failed to get preferences window')
 }
 
+const dSetMouseCfg = debounce(50, setMouseCfg, {
+    atBegin: false
+})
+
 export default function Main() {
     const T = useTranslation()
 
@@ -46,9 +51,9 @@ export default function Main() {
                         marks={marks}
                         max={100}
                         min={0}
-                        onChange={async value => {
-                            await setMouseCfg(value, config.accEnabled)
-                            await setConfig('sen', value)
+                        onChange={value => {
+                            void setConfig('sen', value)
+                            dSetMouseCfg(value, config.accEnabled)
                         }}
                         size="lg"
                         value={config.sen}
@@ -58,10 +63,10 @@ export default function Main() {
                     <SC.xSwitch
                         checked={config.accEnabled}
                         offLabel="OFF"
-                        onChange={async event => {
+                        onChange={event => {
                             const { checked } = event.target
-                            await setMouseCfg(config.sen, checked)
-                            await setConfig('accEnabled', checked)
+                            void setConfig('accEnabled', checked)
+                            dSetMouseCfg(config.sen, checked)
                         }}
                         onLabel="ON"
                         size="md"