From b1d656255e6e1cd91c08c2809f3625541bef50f8 Mon Sep 17 00:00:00 2001
From: Nicolas Mowen <nickmowen213@gmail.com>
Date: Wed, 1 May 2024 16:34:57 -0600
Subject: [PATCH] Make sure state is updated

---
 web/src/hooks/use-overlay-state.tsx | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/web/src/hooks/use-overlay-state.tsx b/web/src/hooks/use-overlay-state.tsx
index 656b61bda..391712c6a 100644
--- a/web/src/hooks/use-overlay-state.tsx
+++ b/web/src/hooks/use-overlay-state.tsx
@@ -8,7 +8,8 @@ export function useOverlayState<S>(
 ): [S | undefined, (value: S, replace?: boolean) => void] {
   const location = useLocation();
   const navigate = useNavigate();
-  const currentLocationState = location.state;
+
+  const currentLocationState = useMemo(() => location.state, [location]);
 
   const setOverlayStateValue = useCallback(
     (value: S, replace: boolean = false) => {
@@ -18,7 +19,7 @@ export function useOverlayState<S>(
     },
     // we know that these deps are correct
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [key, navigate],
+    [key, currentLocationState, navigate],
   );
 
   const overlayStateValue = useMemo<S | undefined>(
@@ -39,7 +40,8 @@ export function usePersistedOverlayState<S extends string>(
   );
   const location = useLocation();
   const navigate = useNavigate();
-  const currentLocationState = location.state;
+
+  const currentLocationState = useMemo(() => location.state, [location]);
 
   const setOverlayStateValue = useCallback(
     (value: S | undefined, replace: boolean = false) => {
@@ -50,7 +52,7 @@ export function usePersistedOverlayState<S extends string>(
     },
     // we know that these deps are correct
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [key, navigate],
+    [key, currentLocationState, navigate],
   );
 
   const overlayStateValue = useMemo<S | undefined>(