From 52a7ee2acd4d06e6f30c6a2285919c360a8bf235 Mon Sep 17 00:00:00 2001
From: Marko Bencun <marko@shiftcrypto.ch>
Date: Thu, 7 Nov 2024 11:04:44 +0100
Subject: [PATCH] frontend: fix back button with UseBackButton

The Android back button stopped working after the back button was used
to close a dialog. The reason is that the backbutton pop handler did
not remove the handler, as `slice(index, 1)` does not remove the
element at `index`, it in fact keeps it. When properly removing the
handler, back button behavior works as expected again.
---
 frontends/web/src/contexts/BackButtonContext.tsx | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/frontends/web/src/contexts/BackButtonContext.tsx b/frontends/web/src/contexts/BackButtonContext.tsx
index 856dfe5b06..d68bef7438 100644
--- a/frontends/web/src/contexts/BackButtonContext.tsx
+++ b/frontends/web/src/contexts/BackButtonContext.tsx
@@ -41,7 +41,7 @@ type TProviderProps = {
 }
 
 export const BackButtonProvider = ({ children }: TProviderProps) => {
-  const [handlers, sethandlers] = useState<THandler[]>([]);
+  const [handlers, setHandlers] = useState<THandler[]>([]);
   const { guideShown, toggleGuide } = useContext(AppContext);
 
   const callTopHandler = useCallback(() => {
@@ -61,17 +61,18 @@ export const BackButtonProvider = ({ children }: TProviderProps) => {
   }, [handlers, guideShown, toggleGuide]);
 
   const pushHandler = useCallback((handler: THandler) => {
-    sethandlers((prevStack) => [...prevStack, handler]);
+    setHandlers((prevStack) => [...prevStack, handler]);
   }, []);
 
   const popHandler = useCallback((handler: THandler) => {
-    sethandlers((prevStack) => {
+    setHandlers((prevStack) => {
       const index = prevStack.indexOf(handler);
       if (index === -1) {
         // Should never happen.
         return prevStack;
       }
-      return prevStack.slice(index, 1);
+      const res = prevStack.slice(0, index).concat(prevStack.slice(index + 1));
+      return res;
     });
   }, []);