Add memoization

CruGlobal · Sep 5, 2024 · 71b6102 · 71b6102
1 parent c844892
commit 71b6102
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 6 deletions.
diff --git a/src/components/Setup/SetupProvider.tsx b/src/components/Setup/SetupProvider.tsx
@@ -1,5 +1,11 @@
 import { useRouter } from 'next/router';
-import React, { ReactNode, createContext, useContext, useEffect } from 'react';
+import React, {
+  ReactNode,
+  createContext,
+  useContext,
+  useEffect,
+  useMemo,
+} from 'react';
 import { UserSetupStageEnum } from 'src/graphql/types.generated';
 import { useSetupStageQuery } from './Setup.generated';
 
@@ -49,11 +55,17 @@ export const SetupProvider: React.FC<Props> = ({ children }) => {
     }
   }, [data]);
 
-  const settingUp = data
-    ? data.userOptions.some(
+  const settingUp = useMemo(() => {
+    if (!data) {
+      return undefined;
+    }
+
+    return (
+      data.userOptions.some(
         (option) => option.key === 'setup_position' && option.value !== '',
       ) || data.user.setup !== null
-    : undefined;
+    );
+  }, [data]);
 
   return (
     <SetupContext.Provider value={{ settingUp }}>

diff --git a/src/components/Setup/useNextSetupPage.ts b/src/components/Setup/useNextSetupPage.ts
@@ -1,4 +1,5 @@
 import { useRouter } from 'next/router';
+import { useCallback } from 'react';
 import { UserSetupStageEnum } from 'src/graphql/types.generated';
 import { useUpdateUserOptionsMutation } from '../Contacts/ContactFlow/ContactFlowSetup/UpdateUserOptions.generated';
 import { useSetupStageLazyQuery } from './Setup.generated';
@@ -21,7 +22,7 @@ export const useNextSetupPage = (): UseNextSetupPageResult => {
       },
     });
 
-  const next = async () => {
+  const next = useCallback(async () => {
     const { data } = await getSetupStage();
     switch (data?.user.setup) {
       case UserSetupStageEnum.NoAccountLists:
@@ -40,7 +41,7 @@ export const useNextSetupPage = (): UseNextSetupPageResult => {
         );
         return;
     }
-  };
+  }, []);
 
   return {
     next,