chore(store): cleanup bound store

charles4221 · Feb 20, 2024 · c669862 · c669862
1 parent a89f28c
commit c669862
Showing 1 changed file with 36 additions and 26 deletions.
diff --git a/src/store/bound.ts b/src/store/bound.ts
@@ -1,13 +1,44 @@
 import { create } from 'zustand';
-import { devtools, persist } from 'zustand/middleware';
+import {
+  DevtoolsOptions,
+  PersistOptions,
+  devtools,
+  persist,
+} from 'zustand/middleware';
 
 import { IS_DEV } from '@/utils/constants';
 
 import { SettingsStore, createSettingsStore } from './settings';
 
 export type StoreState = SettingsStore;
-export type PersistedStoreState = {
-  state: Pick<StoreState, 'theme' | 'isDarkMode'>;
+export type PersistedStoreState = Pick<StoreState, 'theme' | 'isDarkMode'>;
+
+const devtoolsOptions: DevtoolsOptions = {
+  enabled: IS_DEV,
+};
+
+const persistOptions: PersistOptions<StoreState, PersistedStoreState> = {
+  name: 'persisted-store',
+  onRehydrateStorage: IS_DEV
+    ? (stateBeforeHydrate) => {
+        console.log({ stateBeforeHydrate });
+
+        return (stateAfterHydrate, error) => {
+          console.log({ stateAfterHydrate });
+
+          if (error) {
+            console.error(error);
+            window.alert(
+              'Error: Failed to rehydrate store. Check console for more info.',
+            );
+          }
+        };
+      }
+    : undefined,
+  partialize: (state) => ({
+    theme: state.theme,
+    isDarkMode: state.isDarkMode,
+  }),
 };
 
 export const useBoundStore = create<StoreState>()(
@@ -16,29 +47,8 @@ export const useBoundStore = create<StoreState>()(
       (...a) => ({
         ...createSettingsStore(...a),
       }),
-      {
-        name: 'persisted-store',
-        onRehydrateStorage: IS_DEV
-          ? (stateBeforeHydrate) => {
-              console.log({ stateBeforeHydrate });
-
-              return (stateAfterHydrate, error) => {
-                console.log({ stateAfterHydrate });
-
-                if (error) {
-                  console.error(error);
-                  window.alert(
-                    'Error: Failed to rehydrate store. Check console for more info.',
-                  );
-                }
-              };
-            }
-          : undefined,
-        partialize: (state): PersistedStoreState['state'] => ({
-          theme: state.theme,
-          isDarkMode: state.isDarkMode,
-        }),
-      },
+      persistOptions,
     ),
+    devtoolsOptions,
   ),
 );