Merge pull request #7073 from LedgerHQ/bugfix/LIVE-12968-drawer-closi…

…ng-immediately-develop fix(llm/QueuedDrawer): QueuedDrawer shouldn't auto close (cherrypick of #7068 for develop)
LedgerHQ · Jun 12, 2024 · d13502f · d13502f
2 parents 3581d4b + 335635e
commit d13502f
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 3 deletions.
diff --git a/apps/ledger-live-mobile/src/newArch/components/QueuedDrawer/TestScreens.tsx b/apps/ledger-live-mobile/src/newArch/components/QueuedDrawer/TestScreens.tsx
@@ -181,7 +181,7 @@ export const MainTestScreen = () => {
   const [drawer3RequestingToBeOpened, setDrawer3RequestingToBeOpened] = useState(false);
   const [drawer4ForcingToBeOpened, setDrawer4ForcingToBeOpened] = useState(false);
 
-  const handleDrawer1Close = useCallback(() => setDrawer1RequestingToBeOpened(false), []);
+  const handleDrawer1Close = () => setDrawer1RequestingToBeOpened(false); // purposely not using useCallback to check if drawer behaves well when onClose prop changes
   const handleDrawer2Close = useCallback(() => setDrawer2RequestingToBeOpened(false), []);
   const handleDrawer3Close = useCallback(() => setDrawer3RequestingToBeOpened(false), []);
   const handleDrawer4Close = useCallback(() => setDrawer4ForcingToBeOpened(false), []);

diff --git a/apps/ledger-live-mobile/src/newArch/components/QueuedDrawer/index.tsx b/apps/ledger-live-mobile/src/newArch/components/QueuedDrawer/index.tsx
@@ -81,14 +81,17 @@ const QueuedDrawer = ({
     setIsDisplayed(true);
   }, []);
 
+  const onCloseRef = useRef(onClose);
+  onCloseRef.current = onClose;
+
   const triggerClose = useCallback(() => {
     setIsDisplayed(false);
     if (drawerInQueueRef.current?.getPositionInQueue() !== 0) {
       drawerInQueueRef.current?.removeDrawerFromQueue();
       drawerInQueueRef.current = undefined;
     }
-    onClose && onClose();
-  }, [onClose]);
+    onCloseRef.current && onCloseRef.current(); // hack to avoid triggering the useEffect below if the parent changes the onClose prop
+  }, []);
 
   useEffect(() => {
     if (!isFocused && (isRequestingToBeOpened || isForcingToBeOpened)) {