1 files changed, 23 insertions, 1 deletions
diff --git a/packages/demobank-ui/src/pages/AdminPage.tsx b/packages/demobank-ui/src/pages/AdminPage.tsx
index d15ac02c4..b4ce58588 100644
--- a/packages/demobank-ui/src/pages/AdminPage.tsx
+++ b/packages/demobank-ui/src/pages/AdminPage.tsx
@@ -40,6 +40,7 @@ import {
   WithIntermediate,
 } from "../utils.js";
 import { ErrorBanner } from "./BankFrame.js";
+import { ShowCashoutDetails } from "./BusinessAccount.js";
 import { ShowInputErrorLabel } from "./ShowInputErrorLabel.js";
 
 const charset =
@@ -69,6 +70,9 @@ export function AdminPage({ onLoadNotOk }: Props): VNode {
   const [showCashouts, setShowCashouts] = useState<string | undefined>();
   const [updatePassword, setUpdatePassword] = useState<string | undefined>();
   const [removeAccount, setRemoveAccount] = useState<string | undefined>();
+  const [showCashoutDetails, setShowCashoutDetails] = useState<
+    string | undefined
+  >();
 
   const [createAccount, setCreateAccount] = useState(false);
   const { pageStateSetter } = usePageContext();
@@ -90,10 +94,28 @@ export function AdminPage({ onLoadNotOk }: Props): VNode {
 
   const { customers } = result.data;
 
+  if (showCashoutDetails) {
+    return (
+      <ShowCashoutDetails
+        id={showCashoutDetails}
+        onLoadNotOk={onLoadNotOk}
+        onCancel={() => {
+          setShowCashoutDetails(undefined);
+        }}
+      />
+    );
+  }
+
   if (showCashouts) {
     return (
       <div>
-        <Cashouts account={showCashouts} />
+        <Cashouts
+          account={showCashouts}
+          onSelected={(id) => {
+            setShowCashouts(id);
+            setShowCashouts(undefined);
+          }}
+        />
         <input
           class="pure-button"
           type="submit"