wip: refactoring store (answerYes, answerNo, toggleImportant)

kalkulacka-one · Jan 13, 2025 · 80a4264 · 80a4264
1 parent 0dc8078
commit 80a4264
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 46 deletions.
diff --git a/apps/web/app/abc/[questionNumber]/page.tsx b/apps/web/app/abc/[questionNumber]/page.tsx
@@ -15,26 +15,9 @@ export default function Page() {
   const prevQuestion = useQuestionsStore((state) => state.prevQuestion);
   const skipQuestion = useQuestionsStore((state) => state.skipQuestion);
   const toggleImportant = useQuestionsStore((state) => state.toggleImportant);
-  const toggleImportantTest = useQuestionsStore(
-    (state) => state.toggleImportantTest,
-  );
   const answerYes = useQuestionsStore((state) => state.answerYes);
   const answerNo = useQuestionsStore((state) => state.answerNo);
 
-  const tglImp = () => {
-    toggleImportantTest(currentQuestion);
-  };
-
-  const yesClick = () => {
-    answerYes();
-    skipQuestion();
-  };
-
-  const noClick = () => {
-    answerNo();
-    skipQuestion();
-  };
-
   return (
     <>
       <main className="relative flex h-screen items-center justify-center">
@@ -63,9 +46,9 @@ export default function Page() {
               questions={questions}
               currentQuestion={currentQuestion}
               questionTotal={questions.length}
-              toggleImportant={tglImp}
-              yesClick={yesClick}
-              noClick={noClick}
+              toggleImportant={() => toggleImportant(currentQuestion)}
+              yesClick={() => answerYes(currentQuestion)}
+              noClick={() => answerNo(currentQuestion)}
               starPressed={question.isImportant ? true : undefined}
             />
           );

diff --git a/apps/web/app/abc/providers/storeProvider.tsx b/apps/web/app/abc/providers/storeProvider.tsx
@@ -19,13 +19,13 @@ type Guide = { contentBefore?: string; contentAfter?: string }[];
 type Store = {
   questions: ExtendedQuestions[];
   currentQuestion: number;
+  answerYes: (currentQuestion: number) => void;
+  answerNo: (currentQuestion: number) => void;
   toggleImportant: (currentQuestion: number) => void;
   prevQuestion: () => void;
   skipQuestion: () => void;
   nextGuide: () => void;
   prevGuide: () => void;
-  answerYes: () => void;
-  answerNo: () => void;
   // fix no unused vars error
   toggleYes: (cardId: string) => void;
   toggleNo: (cardId: string) => void;
@@ -50,56 +50,62 @@ export const StoreProvider = ({ children, questions }: StoreProviderProps) => {
     storeRef.current = createStore<Store>((set) => ({
       questions,
       currentQuestion: 1,
-      toggleImportant: (currentQuestion) =>
+      answerYes: (currentQuestion) => {
         set((state) => {
           const updatedQuestion = state.questions.map((question) => {
             if (questions[currentQuestion - 1]?.id === question.id) {
               return {
                 ...question,
-                isImportant: !question.isImportant,
+                answerType: true,
               };
             }
             return { ...question };
           });
           return { ...state, questions: updatedQuestion };
-        }),
-      // add edge cases
-      prevQuestion: () =>
-        set((state) => ({ currentQuestion: state.currentQuestion - 1 })),
-      skipQuestion: () =>
-        set((state) => ({ currentQuestion: state.currentQuestion + 1 })),
-      guideNumber: 1,
-      guide: guide,
-      prevGuide: () => set((state) => ({ guideNumber: state.guideNumber - 1 })),
-      nextGuide: () => {
-        set((state) => ({ guideNumber: state.guideNumber + 1 }));
+        });
+        // understand this function  with current invoke better
+        storeRef.current?.getState().skipQuestion();
       },
-      answerYes: () =>
+      answerNo: (currentQuestion) => {
         set((state) => {
-          const updatedQuestions = state.questions.map((question, index) => {
-            if (index + 1 === state.currentQuestion) {
+          const updatedQuestion = state.questions.map((question) => {
+            if (questions[currentQuestion - 1]?.id === question.id) {
               return {
                 ...question,
-                answerType: true,
+                answerType: false,
               };
             }
             return { ...question };
           });
-          return { ...state, questions: updatedQuestions };
-        }),
-      answerNo: () =>
+          return { ...state, questions: updatedQuestion };
+        });
+        // understand this function  with current invoke better
+        storeRef.current?.getState().skipQuestion();
+      },
+      toggleImportant: (currentQuestion) =>
         set((state) => {
-          const updatedQuestions = state.questions.map((question, index) => {
-            if (index + 1 === state.currentQuestion) {
+          const updatedQuestion = state.questions.map((question) => {
+            if (questions[currentQuestion - 1]?.id === question.id) {
               return {
                 ...question,
-                answerType: false,
+                isImportant: !question.isImportant,
               };
             }
             return { ...question };
           });
-          return { ...state, questions: updatedQuestions };
+          return { ...state, questions: updatedQuestion };
         }),
+      // add edge cases
+      prevQuestion: () =>
+        set((state) => ({ currentQuestion: state.currentQuestion - 1 })),
+      skipQuestion: () =>
+        set((state) => ({ currentQuestion: state.currentQuestion + 1 })),
+      guideNumber: 1,
+      guide: guide,
+      prevGuide: () => set((state) => ({ guideNumber: state.guideNumber - 1 })),
+      nextGuide: () => {
+        set((state) => ({ guideNumber: state.guideNumber + 1 }));
+      },
       setCurrentQuestion: (number) => set(() => ({ currentQuestion: number })),
       toggleYes: (cardId) =>
         set((state) => {