2 files changed, 13 insertions, 9 deletions
diff --git a/packages/demobank-ui/src/pages/OperationState/state.ts b/packages/demobank-ui/src/pages/OperationState/state.ts
index 477146d1e..b214a400d 100644
--- a/packages/demobank-ui/src/pages/OperationState/state.ts
+++ b/packages/demobank-ui/src/pages/OperationState/state.ts
@@ -24,9 +24,11 @@ import { useBackendState } from "../../hooks/backend.js";
 import { usePreferences } from "../../hooks/preferences.js";
 import { assertUnreachable } from "../WithdrawalOperationPage.js";
 import { Props, State } from "./index.js";
+import { useBankState } from "../../hooks/bank-state.js";
 
 export function useComponentState({ currency, onClose }: Props): utils.RecursiveState<State> {
-  const [settings, updateSettings] = usePreferences()
+  const [settings] = usePreferences()
+  const [bankState, updateBankState] = useBankState();
   const { state: credentials } = useBackendState()
   const creds = credentials.status !== "loggedIn" ? undefined : credentials
   const { api } = useBankCoreApiContext()
@@ -46,11 +48,11 @@ export function useComponentState({ currency, onClose }: Props): utils.Recursive
       setFailure(resp)
       return;
     }
-    updateSettings("currentWithdrawalOperationId", resp.body.withdrawal_id)
+    updateBankState("currentWithdrawalOperationId", resp.body.withdrawal_id)
 
   }
 
-  const withdrawalOperationId = settings.currentWithdrawalOperationId
+  const withdrawalOperationId = bankState.currentWithdrawalOperationId
   useEffect(() => {
     if (withdrawalOperationId === undefined) {
       doSilentStart()
@@ -77,7 +79,7 @@ export function useComponentState({ currency, onClose }: Props): utils.Recursive
     if (!creds) return;
     const resp = await api.abortWithdrawalById(creds, wid);
     if (resp.type === "ok") {
-      updateSettings("currentWithdrawalOperationId", undefined)
+      updateBankState("currentWithdrawalOperationId", undefined)
       onClose();
     } else {
       return resp;
@@ -140,7 +142,7 @@ export function useComponentState({ currency, onClose }: Props): utils.Recursive
             status: "aborted",
             error: undefined,
             onClose: async () => {
-              updateSettings("currentWithdrawalOperationId", undefined)
+              updateBankState("currentWithdrawalOperationId", undefined)
               onClose()
             },
           }
@@ -155,7 +157,7 @@ export function useComponentState({ currency, onClose }: Props): utils.Recursive
         status: "aborted",
         error: undefined,
         onClose: async () => {
-          updateSettings("currentWithdrawalOperationId", undefined)
+          updateBankState("currentWithdrawalOperationId", undefined)
           onClose()
         },
       }
@@ -163,14 +165,14 @@ export function useComponentState({ currency, onClose }: Props): utils.Recursive
 
     if (data.status === "confirmed") {
       if (!settings.showWithdrawalSuccess) {
-        updateSettings("currentWithdrawalOperationId", undefined)
+        updateBankState("currentWithdrawalOperationId", undefined)
         onClose()
       }
       return {
         status: "confirmed",
         error: undefined,
         onClose: async () => {
-          updateSettings("currentWithdrawalOperationId", undefined)
+          updateBankState("currentWithdrawalOperationId", undefined)
           onClose()
         },
       }
diff --git a/packages/demobank-ui/src/pages/OperationState/views.tsx b/packages/demobank-ui/src/pages/OperationState/views.tsx
index 98eb7169f..5ebd66dac 100644
--- a/packages/demobank-ui/src/pages/OperationState/views.tsx
+++ b/packages/demobank-ui/src/pages/OperationState/views.tsx
@@ -24,6 +24,7 @@ import { undefinedIfEmpty } from "../../utils.js";
 import { ShouldBeSameUser } from "../WithdrawalConfirmationQuestion.js";
 import { assertUnreachable } from "../WithdrawalOperationPage.js";
 import { State } from "./index.js";
+import { useBankState } from "../../hooks/bank-state.js";
 
 export function InvalidPaytoView({ payto, onClose }: State.InvalidPayto) {
   return (
@@ -45,6 +46,7 @@ export function NeedConfirmationView({ error, onAbort: doAbort, onConfirm: doCon
   const { i18n } = useTranslationContext()
   const [settings] = usePreferences()
   const [notification, notify, errorHandler] = useLocalNotification()
+  const [, updateBankState] = useBankState()
 
   const captchaNumbers = useMemo(() => {
     return {
@@ -135,7 +137,7 @@ export function NeedConfirmationView({ error, onAbort: doAbort, onConfirm: doCon
           debug: resp.detail,
         });
         case HttpStatusCode.Accepted: {
-          resp.body.challenge_id;
+          updateBankState("currentChallengeId", resp.body.challenge_id)
           return notify({
             type: "info",
             title: i18n.str`The operation needs a confirmation to complete.`,