From 38a9a23790248d5af522fc0d3cf6e99970e59637 Mon Sep 17 00:00:00 2001
From: MAZE <remvze@proton.me>
Date: Wed, 28 Feb 2024 20:19:36 +0330
Subject: [PATCH] feat: persist presets

---
 .../store-consumer/store-consumer.tsx         |  3 +-
 src/store/preset/index.ts                     | 51 +++++++++++++------
 2 files changed, 37 insertions(+), 17 deletions(-)

diff --git a/src/components/store-consumer/store-consumer.tsx b/src/components/store-consumer/store-consumer.tsx
index a127a8e..aee265d 100644
--- a/src/components/store-consumer/store-consumer.tsx
+++ b/src/components/store-consumer/store-consumer.tsx
@@ -1,6 +1,6 @@
 import { useEffect } from 'react';
 
-import { useSoundStore, useNoteStore } from '@/store';
+import { useSoundStore, useNoteStore, usePresetStore } from '@/store';
 
 interface StoreConsumerProps {
   children: React.ReactNode;
@@ -10,6 +10,7 @@ export function StoreConsumer({ children }: StoreConsumerProps) {
   useEffect(() => {
     useSoundStore.persist.rehydrate();
     useNoteStore.persist.rehydrate();
+    usePresetStore.persist.rehydrate();
   }, []);
 
   return <>{children}</>;
diff --git a/src/store/preset/index.ts b/src/store/preset/index.ts
index bce2281..c245168 100644
--- a/src/store/preset/index.ts
+++ b/src/store/preset/index.ts
@@ -1,4 +1,6 @@
 import { create } from 'zustand';
+import { createJSONStorage, persist } from 'zustand/middleware';
+import merge from 'deepmerge';
 
 interface PresetStore {
   addPreset: (label: string, sounds: Record<string, number>) => void;
@@ -10,24 +12,41 @@ interface PresetStore {
   }>;
 }
 
-export const usePresetStore = create<PresetStore>()((set, get) => ({
-  addPreset(label: string, sounds: Record<string, number>) {
-    set({ presets: [{ label, sounds }, ...get().presets] });
-  },
+export const usePresetStore = create<PresetStore>()(
+  persist(
+    (set, get) => ({
+      addPreset(label: string, sounds: Record<string, number>) {
+        set({ presets: [{ label, sounds }, ...get().presets] });
+      },
 
-  changeName(index: number, newName: string) {
-    const presets = get().presets.map((preset, i) => {
-      if (i === index) return { ...preset, label: newName };
+      changeName(index: number, newName: string) {
+        const presets = get().presets.map((preset, i) => {
+          if (i === index) return { ...preset, label: newName };
 
-      return preset;
-    });
+          return preset;
+        });
 
-    set({ presets });
-  },
+        set({ presets });
+      },
 
-  deletePreset(index: number) {
-    set({ presets: get().presets.filter((_, i) => index !== i) });
-  },
+      deletePreset(index: number) {
+        set({ presets: get().presets.filter((_, i) => index !== i) });
+      },
 
-  presets: [],
-}));
+      presets: [],
+    }),
+    {
+      merge: (persisted, current) =>
+        merge(
+          current,
+          // @ts-ignore
+          persisted,
+        ),
+      name: 'moodist-presets',
+      partialize: state => ({ presets: state.presets }),
+      skipHydration: true,
+      storage: createJSONStorage(() => localStorage),
+      version: 0,
+    },
+  ),
+);