fixes #8294

25 files changed, 327 insertions, 179 deletions

diff --git a/packages/demobank-ui/src/Routing.tsx b/packages/demobank-ui/src/Routing.tsx
index 409d4ec2d..9f9475210 100644
--- a/packages/demobank-ui/src/Routing.tsx
+++ b/packages/demobank-ui/src/Routing.tsx
@@ -164,6 +164,7 @@ function PublicRounting({
       return (
         <WithdrawalOperationPage
           operationId={wopid}
+          pupose="after-confirmation"
           onOperationAborted={() => navigateTo(publicPages.login.url({}))}
           routeClose={publicPages.login}
           onAuthorizationRequired={() =>
@@ -242,6 +243,10 @@ export const privatePages = {
     /\/profile\/(?<account>[a-zA-Z0-9]+)\/cashouts/,
     ({ account }) => `#/profile/${account}/cashouts`,
   ),
+  startOperation: urlPattern<{ wopid: string }>(
+    /\/start-operation\/(?<wopid>[a-zA-Z0-9-]+)/,
+    ({ wopid }) => `#/start-operation/${wopid}`,
+  ),
   operationDetails: urlPattern<{ wopid: string }>(
     /\/operation\/(?<wopid>[a-zA-Z0-9-]+)/,
     ({ wopid }) => `#/operation/${wopid}`,
@@ -277,6 +282,25 @@ function PrivateRouting({
       return (
         <WithdrawalOperationPage
           operationId={wopid}
+          pupose="after-confirmation"
+          onOperationAborted={() => navigateTo(privatePages.home.url({}))}
+          routeClose={privatePages.home}
+          onAuthorizationRequired={() =>
+            navigateTo(privatePages.solveSecondFactor.url({}))
+          }
+        />
+      );
+    }
+    case "startOperation": {
+      const { wopid } = location.values as RouteParamsType<
+        typeof location.parent,
+        typeof location.name
+      >;
+
+      return (
+        <WithdrawalOperationPage
+          operationId={wopid}
+          pupose="after-creation"
           onOperationAborted={() => navigateTo(privatePages.home.url({}))}
           routeClose={privatePages.home}
           onAuthorizationRequired={() =>
@@ -316,6 +340,10 @@ function PrivateRouting({
         <ShowAccountDetails
           account={account}
           onUpdateSuccess={() => navigateTo(privatePages.home.url({}))}
+          routeMyAccountCashout={privatePages.myAccountCashouts}
+          routeMyAccountDelete={privatePages.myAccountDelete}
+          routeMyAccountDetails={privatePages.myAccountDetails}
+          routeMyAccountPassword={privatePages.myAccountPassword}
           onAuthorizationRequired={() =>
             navigateTo(privatePages.solveSecondFactor.url({}))
           }
@@ -333,6 +361,10 @@ function PrivateRouting({
           focus
           account={account}
           onUpdateSuccess={() => navigateTo(privatePages.home.url({}))}
+          routeMyAccountCashout={privatePages.myAccountCashouts}
+          routeMyAccountDelete={privatePages.myAccountDelete}
+          routeMyAccountDetails={privatePages.myAccountDetails}
+          routeMyAccountPassword={privatePages.myAccountPassword}
           onAuthorizationRequired={() =>
             navigateTo(privatePages.solveSecondFactor.url({}))
           }
@@ -366,6 +398,10 @@ function PrivateRouting({
           account={account}
           routeCashoutDetails={privatePages.cashoutDetails}
           routeClose={privatePages.home}
+          routeMyAccountCashout={privatePages.myAccountCashouts}
+          routeMyAccountDelete={privatePages.myAccountDelete}
+          routeMyAccountDetails={privatePages.myAccountDetails}
+          routeMyAccountPassword={privatePages.myAccountPassword}
           onAuthorizationRequired={() =>
             navigateTo(privatePages.solveSecondFactor.url({}))
           }
@@ -389,6 +425,10 @@ function PrivateRouting({
         <ShowAccountDetails
           account={username}
           onUpdateSuccess={() => navigateTo(privatePages.home.url({}))}
+          routeMyAccountCashout={privatePages.myAccountCashouts}
+          routeMyAccountDelete={privatePages.myAccountDelete}
+          routeMyAccountDetails={privatePages.myAccountDetails}
+          routeMyAccountPassword={privatePages.myAccountPassword}
           onAuthorizationRequired={() =>
             navigateTo(privatePages.solveSecondFactor.url({}))
           }
@@ -402,6 +442,10 @@ function PrivateRouting({
           focus
           account={username}
           onUpdateSuccess={() => navigateTo(privatePages.home.url({}))}
+          routeMyAccountCashout={privatePages.myAccountCashouts}
+          routeMyAccountDelete={privatePages.myAccountDelete}
+          routeMyAccountDetails={privatePages.myAccountDetails}
+          routeMyAccountPassword={privatePages.myAccountPassword}
           onAuthorizationRequired={() =>
             navigateTo(privatePages.solveSecondFactor.url({}))
           }
@@ -414,6 +458,10 @@ function PrivateRouting({
         <CashoutListForAccount
           account={username}
           routeCashoutDetails={privatePages.cashoutDetails}
+          routeMyAccountCashout={privatePages.myAccountCashouts}
+          routeMyAccountDelete={privatePages.myAccountDelete}
+          routeMyAccountDetails={privatePages.myAccountDetails}
+          routeMyAccountPassword={privatePages.myAccountPassword}
           onAuthorizationRequired={() =>
             navigateTo(privatePages.solveSecondFactor.url({}))
           }
@@ -433,6 +481,8 @@ function PrivateRouting({
             routeShowAccount={privatePages.accountDetails}
             routeShowCashoutsAccount={privatePages.accountCashouts}
             routeUpdatePasswordAccount={privatePages.accountChangePassword}
+            routeCreateWireTransfer={privatePages.wireTranserCreate}
+            routeDownloadStats={privatePages.statsDownload}
           />
         );
       }
@@ -440,15 +490,19 @@ function PrivateRouting({
         <AccountPage
           account={username}
           tab={undefined}
+          routeCreateWireTransfer={privatePages.wireTranserCreate}
+          routePublicAccounts={privatePages.publicAccountList}
+          routeOperationDetails={privatePages.startOperation}
           routeChargeWallet={privatePages.homeChargeWallet}
           routeWireTransfer={privatePages.homeWireTransfer}
+          routeSolveSecondFactor={privatePages.solveSecondFactor}
           routeClose={privatePages.home}
           onClose={() => navigateTo(privatePages.home.url({}))}
           onAuthorizationRequired={() =>
             navigateTo(privatePages.solveSecondFactor.url({}))
           }
           onOperationCreated={(wopid) =>
-            navigateTo(privatePages.operationDetails.url({ wopid }))
+            navigateTo(privatePages.startOperation.url({ wopid }))
           }
         />
       );
@@ -499,13 +553,17 @@ function PrivateRouting({
           tab="charge-wallet"
           routeChargeWallet={privatePages.homeChargeWallet}
           routeWireTransfer={privatePages.homeWireTransfer}
+          routeCreateWireTransfer={privatePages.wireTranserCreate}
+          routePublicAccounts={privatePages.publicAccountList}
+          routeOperationDetails={privatePages.startOperation}
+          routeSolveSecondFactor={privatePages.solveSecondFactor}
           routeClose={privatePages.home}
           onClose={() => navigateTo(privatePages.home.url({}))}
           onAuthorizationRequired={() =>
             navigateTo(privatePages.solveSecondFactor.url({}))
           }
           onOperationCreated={(wopid) =>
-            navigateTo(privatePages.operationDetails.url({ wopid }))
+            navigateTo(privatePages.startOperation.url({ wopid }))
           }
         />
       );
@@ -517,13 +575,17 @@ function PrivateRouting({
           tab="wire-transfer"
           routeChargeWallet={privatePages.homeChargeWallet}
           routeWireTransfer={privatePages.homeWireTransfer}
+          routeCreateWireTransfer={privatePages.wireTranserCreate}
+          routePublicAccounts={privatePages.publicAccountList}
+          routeOperationDetails={privatePages.startOperation}
+          routeSolveSecondFactor={privatePages.solveSecondFactor}
           routeClose={privatePages.home}
           onClose={() => navigateTo(privatePages.home.url({}))}
           onAuthorizationRequired={() =>
             navigateTo(privatePages.solveSecondFactor.url({}))
           }
           onOperationCreated={(wopid) =>
-            navigateTo(privatePages.operationDetails.url({ wopid }))
+            navigateTo(privatePages.startOperation.url({ wopid }))
           }
         />
       );
diff --git a/packages/demobank-ui/src/components/Transactions/index.ts b/packages/demobank-ui/src/components/Transactions/index.ts
index b0e67d4d9..f4e799839 100644
--- a/packages/demobank-ui/src/components/Transactions/index.ts
+++ b/packages/demobank-ui/src/components/Transactions/index.ts
@@ -19,9 +19,11 @@ import { Loading, utils } from "@gnu-taler/web-util/browser";
 import { ErrorLoadingWithDebug } from "../ErrorLoadingWithDebug.js";
 import { useComponentState } from "./state.js";
 import { ReadyView } from "./views.js";
+import { RouteDefinition } from "../../route.js";
 
 export interface Props {
   account: string;
+  routeCreateWireTransfer: RouteDefinition<{ destination: string }> | undefined;
 }
 
 export type State = State.Loading | State.LoadingUriError | State.Ready;
@@ -43,6 +45,7 @@ export namespace State {
   export interface Ready extends BaseInfo {
     status: "ready";
     error: undefined;
+    routeCreateWireTransfer: RouteDefinition<{ destination: string }> | undefined;
     transactions: Transaction[];
     onPrev?: () => void;
     onNext?: () => void;
diff --git a/packages/demobank-ui/src/components/Transactions/state.ts b/packages/demobank-ui/src/components/Transactions/state.ts
index 74e6b0d36..5e99a8a76 100644
--- a/packages/demobank-ui/src/components/Transactions/state.ts
+++ b/packages/demobank-ui/src/components/Transactions/state.ts
@@ -23,7 +23,7 @@ import {
 import { useTransactions } from "../../hooks/access.js";
 import { Props, State, Transaction } from "./index.js";
 
-export function useComponentState({ account }: Props): State {
+export function useComponentState({ account, routeCreateWireTransfer }: Props): State {
   const result = useTransactions(account);
   if (!result) {
     return {
@@ -42,38 +42,39 @@ export function useComponentState({ account }: Props): State {
     result.data.type === "fail"
       ? []
       : result.data.body.transactions
-          .map((tx) => {
-            const negative = tx.direction === "debit";
-            const cp = parsePaytoUri(
-              negative ? tx.creditor_payto_uri : tx.debtor_payto_uri,
-            );
-            const counterpart =
-              (cp === undefined || !cp.isKnown
-                ? undefined
-                : cp.targetType === "iban"
-                  ? cp.iban
-                  : cp.targetType === "x-taler-bank"
-                    ? cp.account
-                    : cp.targetType === "bitcoin"
-                      ? `${cp.targetPath.substring(0, 6)}...`
-                      : undefined) ?? "unknown";
+        .map((tx) => {
+          const negative = tx.direction === "debit";
+          const cp = parsePaytoUri(
+            negative ? tx.creditor_payto_uri : tx.debtor_payto_uri,
+          );
+          const counterpart =
+            (cp === undefined || !cp.isKnown
+              ? undefined
+              : cp.targetType === "iban"
+                ? cp.iban
+                : cp.targetType === "x-taler-bank"
+                  ? cp.account
+                  : cp.targetType === "bitcoin"
+                    ? `${cp.targetPath.substring(0, 6)}...`
+                    : undefined) ?? "unknown";
 
-            const when = AbsoluteTime.fromProtocolTimestamp(tx.date);
-            const amount = Amounts.parse(tx.amount);
-            const subject = tx.subject;
-            return {
-              negative,
-              counterpart,
-              when,
-              amount,
-              subject,
-            };
-          })
-          .filter((x): x is Transaction => x !== undefined);
+          const when = AbsoluteTime.fromProtocolTimestamp(tx.date);
+          const amount = Amounts.parse(tx.amount);
+          const subject = tx.subject;
+          return {
+            negative,
+            counterpart,
+            when,
+            amount,
+            subject,
+          };
+        })
+        .filter((x): x is Transaction => x !== undefined);
 
   return {
     status: "ready",
     error: undefined,
+    routeCreateWireTransfer,
     transactions,
     onNext: result.isLastPage ? undefined : result.loadMore,
     onPrev: result.isFirstPage ? undefined : result.loadMorePrev,
diff --git a/packages/demobank-ui/src/components/Transactions/test.ts b/packages/demobank-ui/src/components/Transactions/test.ts
index cf33a0b1c..9ded218c1 100644
--- a/packages/demobank-ui/src/components/Transactions/test.ts
+++ b/packages/demobank-ui/src/components/Transactions/test.ts
@@ -33,6 +33,7 @@ describe("Transaction states", () => {
 
     const props: Props = {
       account: "myAccount",
+      routeCreateWireTransfer: undefined,
     };
 
     env.addRequestExpectation(TRANSACTION_API_EXAMPLE.LIST_FIRST_PAGE, {
@@ -161,6 +162,7 @@ describe("Transaction states", () => {
 
     const props: Props = {
       account: "myAccount",
+      routeCreateWireTransfer: undefined,
     };
 
     env.addRequestExpectation(TRANSACTION_API_EXAMPLE.LIST_ERROR, {
diff --git a/packages/demobank-ui/src/components/Transactions/views.tsx b/packages/demobank-ui/src/components/Transactions/views.tsx
index 51fb90b61..53e437523 100644
--- a/packages/demobank-ui/src/components/Transactions/views.tsx
+++ b/packages/demobank-ui/src/components/Transactions/views.tsx
@@ -20,10 +20,10 @@ import { Fragment, h, VNode } from "preact";
 import { useBankCoreApiContext } from "../../context/config.js";
 import { RenderAmount } from "../../pages/PaytoWireTransferForm.js";
 import { State } from "./index.js";
-import { privatePages } from "../../Routing.js";
 
 export function ReadyView({
   transactions,
+  routeCreateWireTransfer,
   onNext,
   onPrev,
 }: State.Ready): VNode {
@@ -93,8 +93,8 @@ export function ReadyView({
                       item.when.t_ms === "never"
                         ? ""
                         : format(item.when.t_ms, "HH:mm:ss", {
-                            locale: dateLocale,
-                          });
+                          locale: dateLocale,
+                        });
                     return (
                       <tr
                         key={idx}
@@ -134,14 +134,16 @@ export function ReadyView({
                             </dt>
                             <dd class="mt-1 truncate text-gray-500 sm:hidden">
                               {item.negative ? i18n.str`to` : i18n.str`from`}{" "}
-                              <a
-                                href={privatePages.wireTranserCreate.url({
-                                  destination: item.counterpart,
-                                })}
-                                class="text-indigo-600 hover:text-indigo-900"
-                              >
-                                {item.counterpart}
-                              </a>
+                              {!routeCreateWireTransfer ? item.counterpart :
+                                <a
+                                  href={routeCreateWireTransfer.url({
+                                    destination: item.counterpart,
+                                  })}
+                                  class="text-indigo-600 hover:text-indigo-900"
+                                >
+                                  {item.counterpart}
+                                </a>
+                              }
                             </dd>
                             <dd class="mt-1 text-gray-500 sm:hidden">
                               <pre class="break-words w-56 whitespace-break-spaces p-2 rounded-md mx-auto my-2 bg-gray-100">
@@ -168,14 +170,16 @@ export function ReadyView({
                           )}
                         </td>
                         <td class="hidden sm:table-cell px-3 py-3.5 text-sm text-gray-500">
-                          <a
-                            href={privatePages.wireTranserCreate.url({
-                              destination: item.counterpart,
-                            })}
-                            class="text-indigo-600 hover:text-indigo-900"
-                          >
-                            {item.counterpart}
-                          </a>
+                          {!routeCreateWireTransfer ? item.counterpart :
+                            <a
+                              href={routeCreateWireTransfer.url({
+                                destination: item.counterpart,
+                              })}
+                              class="text-indigo-600 hover:text-indigo-900"
+                            >
+                              {item.counterpart}
+                            </a>
+                          }
                         </td>
                         <td class="hidden sm:table-cell px-3 py-3.5 text-sm text-gray-500 break-all min-w-md">
                           {item.subject}
diff --git a/packages/demobank-ui/src/i18n/en.po b/packages/demobank-ui/src/i18n/en.po
index 636863b6f..a9657bd32 100644
--- a/packages/demobank-ui/src/i18n/en.po
+++ b/packages/demobank-ui/src/i18n/en.po
@@ -88,7 +88,7 @@ msgstr ""
 #: src/hooks/preferences.ts:55
 #, fuzzy, c-format
 msgid "Max withdrawal amount"
-msgstr "Start withdrawal"
+msgstr ""
 
 #: src/hooks/preferences.ts:57
 #, c-format
@@ -108,7 +108,7 @@ msgstr ""
 #: src/hooks/preferences.ts:63
 #, fuzzy, c-format
 msgid "Use fast withdrawal form"
-msgstr "Start withdrawal"
+msgstr ""
 
 #: src/hooks/preferences.ts:65
 #, c-format
@@ -244,7 +244,7 @@ msgstr ""
 #: src/pages/PaytoWireTransferForm.tsx:415
 #, fuzzy, c-format
 msgid "amount to transfer"
-msgstr "Amount to withdraw"
+msgstr ""
 
 #: src/pages/PaytoWireTransferForm.tsx:425
 #, c-format
@@ -422,7 +422,7 @@ msgstr ""
 #: src/pages/WithdrawalConfirmationQuestion.tsx:186
 #, fuzzy, c-format
 msgid "Confirm the withdrawal operation"
-msgstr "Confirm withdrawal"
+msgstr ""
 
 #: src/pages/WithdrawalConfirmationQuestion.tsx:203
 #, c-format
@@ -486,7 +486,7 @@ msgstr ""
 #: src/pages/OperationState/views.tsx:319
 #, c-format
 msgid "Close"
-msgstr "Close"
+msgstr ""
 
 #: src/pages/OperationState/views.tsx:399
 #, c-format
@@ -524,7 +524,7 @@ msgstr ""
 #: src/pages/WalletWithdrawForm.tsx:75
 #, fuzzy, c-format
 msgid "Complete or cancel the operation in"
-msgstr "Confirm withdrawal"
+msgstr ""
 
 #: src/pages/WalletWithdrawForm.tsx:84
 #, c-format
@@ -544,7 +544,7 @@ msgstr ""
 #: src/pages/WalletWithdrawForm.tsx:117
 #, fuzzy, c-format
 msgid "Withdraw URI: %1$s"
-msgstr "Confirm withdrawal"
+msgstr ""
 
 #: src/pages/WalletWithdrawForm.tsx:132
 #, c-format
@@ -571,7 +571,7 @@ msgstr ""
 #: src/pages/WalletWithdrawForm.tsx:295
 #, fuzzy, c-format
 msgid "You need a GNU Taler Wallet"
-msgstr "Top up Taler wallet"
+msgstr ""
 
 #: src/pages/WalletWithdrawForm.tsx:300
 #, c-format
@@ -611,7 +611,7 @@ msgstr ""
 #: src/pages/PaymentOptions.tsx:171
 #, fuzzy, c-format
 msgid "Transfer details"
-msgstr "Top up Taler wallet"
+msgstr ""
 
 #: src/pages/AccountPage/views.tsx:41
 #, c-format
@@ -979,7 +979,7 @@ msgstr ""
 #: src/pages/QrCodeSection.tsx:143
 #, fuzzy, c-format
 msgid "Withdraw"
-msgstr "Confirm withdrawal"
+msgstr ""
 
 #: src/pages/QrCodeSection.tsx:152
 #, c-format
@@ -989,7 +989,7 @@ msgstr ""
 #: src/pages/QrCodeSection.tsx:157
 #, fuzzy, c-format
 msgid "Scan the QR below to start the withdrawal."
-msgstr "Close Taler withdrawal"
+msgstr ""
 
 #: src/pages/WithdrawalQRCode.tsx:79
 #, c-format
@@ -1123,12 +1123,12 @@ msgstr ""
 #: src/pages/SolveChallengePage.tsx:232
 #, fuzzy, c-format
 msgid "Withdrawal"
-msgstr "Confirm withdrawal"
+msgstr ""
 
 #: src/pages/SolveChallengePage.tsx:248
 #, fuzzy, c-format
 msgid "Confirm the operation"
-msgstr "Confirm withdrawal"
+msgstr ""
 
 #: src/pages/SolveChallengePage.tsx:271
 #, c-format
@@ -1306,12 +1306,12 @@ msgstr ""
 #: src/pages/business/CreateCashout.tsx:440
 #, fuzzy, c-format
 msgid "Amount to send"
-msgstr "Amount to withdraw"
+msgstr ""
 
 #: src/pages/business/CreateCashout.tsx:441
 #, fuzzy, c-format
 msgid "Amount to receive"
-msgstr "Amount to withdraw"
+msgstr ""
 
 #: src/pages/business/CreateCashout.tsx:490
 #, c-format
@@ -1749,36 +1749,36 @@ msgstr ""
 
 #, c-format
 #~ msgid "days"
-#~ msgstr "days"
+#~ msgstr ""
 
 #, c-format
 #~ msgid "hours"
-#~ msgstr "hours"
+#~ msgstr ""
 
 #, c-format
 #~ msgid "minutes"
-#~ msgstr "minutes"
+#~ msgstr ""
 
 #, c-format
 #~ msgid "seconds"
-#~ msgstr "seconds"
+#~ msgstr ""
 
 #~ msgid "Go back"
-#~ msgstr "Go back"
+#~ msgstr ""
 
 #, fuzzy
 #~ msgid "Withdraw Money into a Taler wallet"
-#~ msgstr "Top up Taler wallet"
+#~ msgstr ""
 
 #~ msgid "Page has a problem: logged in but backend state is lost."
-#~ msgstr "Page has a problem: logged in but backend state is lost."
+#~ msgstr ""
 
 #, fuzzy
 #~ msgid "Welcome to the euFin bank!"
-#~ msgstr "Welcome to euFin bank: Taler+IBAN now possible!"
+#~ msgstr ""
 
 #~ msgid "Page has a problem:"
-#~ msgstr "Page has a problem:"
+#~ msgstr ""
 
 #~ msgid "Sign in"
-#~ msgstr "Sign in"
+#~ msgstr ""
diff --git a/packages/demobank-ui/src/i18n/strings.ts b/packages/demobank-ui/src/i18n/strings.ts
index fbd1acb35..f55e5efbc 100644
--- a/packages/demobank-ui/src/i18n/strings.ts
+++ b/packages/demobank-ui/src/i18n/strings.ts
@@ -1505,11 +1505,11 @@ strings["en"] = {
       "IBAN numbers usually have less that 34 digits": [""],
       "IBAN country code not found": [""],
       "IBAN number is not valid, checksum is wrong": [""],
-      "Max withdrawal amount": ["Start withdrawal"],
+      "Max withdrawal amount": [""],
       "Show withdrawal confirmation": [""],
       "Show demo description": [""],
       "Show install wallet first": [""],
-      "Use fast withdrawal form": ["Start withdrawal"],
+      "Use fast withdrawal form": [""],
       "Show debug info": [""],
       "The reserve operation has been confirmed previously and can't be aborted":
         [""],
@@ -1519,9 +1519,9 @@ strings["en"] = {
       "You will see the details of the operation in your wallet including the fees (if applies). If you still don't have one you can install it following instructions in":
         [""],
       "this page": [""],
-      Withdraw: ["Confirm withdrawal"],
+      Withdraw: [""],
       "Or if you have the wallet in another device": [""],
-      "Scan the QR below to start the withdrawal.": ["Close Taler withdrawal"],
+      "Scan the QR below to start the withdrawal.": [""],
       required: [""],
       "IBAN should have just uppercased letters and numbers": [""],
       "not valid": [""],
@@ -1550,7 +1550,7 @@ strings["en"] = {
       subject: [""],
       "some text to identify the transfer": [""],
       Amount: [""],
-      "amount to transfer": ["Amount to withdraw"],
+      "amount to transfer": [""],
       "payto URI:": [""],
       "uniform resource identifier of the target account": [""],
       "payto://iban/[receiver-iban]?message=[subject]&amount=[%1$s:X.Y]": [""],
@@ -1572,7 +1572,7 @@ strings["en"] = {
       "The withdrawal operation can't be confirmed before a wallet accepted the transaction.":
         [""],
       "Your balance is not enough for the operation.": [""],
-      "Confirm the withdrawal operation": ["Confirm withdrawal"],
+      "Confirm the withdrawal operation": [""],
       "Wire transfer details": [""],
       "Taler Exchange operator's account": [""],
       "Taler Exchange operator's name": [""],
@@ -1681,8 +1681,8 @@ strings["en"] = {
       "To account": [""],
       "No cashout account": [""],
       "Before doing a cashout you need to complete your profile": [""],
-      "Amount to send": ["Amount to withdraw"],
-      "Amount to receive": ["Amount to withdraw"],
+      "Amount to send": [""],
+      "Amount to receive": [""],
       "Total cost": [""],
       "Balance left": [""],
       "Before fee": [""],
@@ -1808,7 +1808,7 @@ strings["en"] = {
         [""],
       "The operation was rejected due to insufficient funds.": [""],
       "Do not show this again": [""],
-      Close: ["Close"],
+      Close: [""],
       "On this device": [""],
       'If you are using a web browser on desktop you should access your wallet with the GNU Taler WebExtension now or click the link if your WebExtension have the "Inject Taler support" option enabled.':
         [""],
@@ -1816,14 +1816,14 @@ strings["en"] = {
       "On a mobile phone": [""],
       "Scan the QR code with your mobile device.": [""],
       "There is an operation already": [""],
-      "Complete or cancel the operation in": ["Confirm withdrawal"],
+      "Complete or cancel the operation in": [""],
       "Server responded with an invalid  withdraw URI": [""],
-      "Withdraw URI: %1$s": ["Confirm withdrawal"],
+      "Withdraw URI: %1$s": [""],
       "The operation was rejected due to insufficient funds": [""],
       "Prepare your wallet": [""],
       "After using your wallet you will need to confirm or cancel the operation on this site.":
         [""],
-      "You need a GNU Taler Wallet": ["Top up Taler wallet"],
+      "You need a GNU Taler Wallet": [""],
       "If you don't have one yet you can follow the instruction in": [""],
       "Send money": [""],
       "to a %1$s wallet": [""],
@@ -1835,7 +1835,7 @@ strings["en"] = {
       "Make a wire transfer to an account with known bank account number.": [
         "",
       ],
-      "Transfer details": ["Top up Taler wallet"],
+      "Transfer details": [""],
       "This is a demo bank": [""],
       "This part of the demo shows how a bank that supports Taler directly would work. In addition to using your own bank account, you can also see the transaction history of some %1$s.":
         [""],
@@ -1871,8 +1871,8 @@ strings["en"] = {
       "Account update": [""],
       "Password update": [""],
       "Wire transfer": [""],
-      Withdrawal: ["Confirm withdrawal"],
-      "Confirm the operation": ["Confirm withdrawal"],
+      Withdrawal: [""],
+      "Confirm the operation": [""],
       "Send again": [""],
       "Send code": [""],
       "Operation details": [""],
diff --git a/packages/demobank-ui/src/pages/AccountPage/index.ts b/packages/demobank-ui/src/pages/AccountPage/index.ts
index 31a8a9e34..6c67f6d90 100644
--- a/packages/demobank-ui/src/pages/AccountPage/index.ts
+++ b/packages/demobank-ui/src/pages/AccountPage/index.ts
@@ -36,6 +36,10 @@ export interface Props {
   routeClose: RouteDefinition<Record<string, never>>;
   routeChargeWallet: RouteDefinition<Record<string, never>>;
   routeWireTransfer: RouteDefinition<Record<string, never>>;
+  routePublicAccounts: RouteDefinition<Record<string, never>>;
+  routeCreateWireTransfer: RouteDefinition<{ destination: string }>;
+  routeOperationDetails: RouteDefinition<{ wopid: string }>;
+  routeSolveSecondFactor: RouteDefinition<Record<string, never>>;
 }
 
 export type State =
@@ -72,6 +76,10 @@ export namespace State {
     routeClose: RouteDefinition<Record<string, never>>;
     routeChargeWallet: RouteDefinition<Record<string, never>>;
     routeWireTransfer: RouteDefinition<Record<string, never>>;
+    routePublicAccounts: RouteDefinition<Record<string, never>>;
+    routeCreateWireTransfer: RouteDefinition<{ destination: string }>;
+    routeOperationDetails: RouteDefinition<{ wopid: string }>;
+    routeSolveSecondFactor: RouteDefinition<Record<string, never>>;
   }
 
   export interface InvalidIban {
diff --git a/packages/demobank-ui/src/pages/AccountPage/state.ts b/packages/demobank-ui/src/pages/AccountPage/state.ts
index a07ea37d3..58da82f80 100644
--- a/packages/demobank-ui/src/pages/AccountPage/state.ts
+++ b/packages/demobank-ui/src/pages/AccountPage/state.ts
@@ -28,6 +28,10 @@ export function useComponentState({
   account,
   tab,
   routeChargeWallet,
+  routeCreateWireTransfer,
+  routePublicAccounts,
+  routeSolveSecondFactor,
+  routeOperationDetails,
   routeWireTransfer,
   onOperationCreated,
   onClose,
@@ -96,6 +100,10 @@ export function useComponentState({
     onOperationCreated,
     error: undefined,
     tab,
+    routeOperationDetails,
+    routeCreateWireTransfer,
+    routePublicAccounts,
+    routeSolveSecondFactor,
     onAuthorizationRequired,
     onClose,
     routeClose,
diff --git a/packages/demobank-ui/src/pages/AccountPage/views.tsx b/packages/demobank-ui/src/pages/AccountPage/views.tsx
index 9baefe96c..7694ca1d3 100644
--- a/packages/demobank-ui/src/pages/AccountPage/views.tsx
+++ b/packages/demobank-ui/src/pages/AccountPage/views.tsx
@@ -22,7 +22,7 @@ import { useBankState } from "../../hooks/bank-state.js";
 import { usePreferences } from "../../hooks/preferences.js";
 import { PaymentOptions } from "../PaymentOptions.js";
 import { State } from "./index.js";
-import { privatePages } from "../../Routing.js";
+import { RouteDefinition } from "../../route.js";
 
 export function InvalidIbanView({ error }: State.InvalidIban) {
   return (
@@ -32,7 +32,9 @@ export function InvalidIbanView({ error }: State.InvalidIban) {
 
 const IS_PUBLIC_ACCOUNT_ENABLED = false;
 
-function ShowDemoInfo(): VNode {
+function ShowDemoInfo({ routePublicAccounts }: {
+  routePublicAccounts: RouteDefinition<Record<string, never>>;
+}): VNode {
   const { i18n } = useTranslationContext();
   const [settings, updateSettings] = usePreferences();
   if (!settings.showDemoDescription) return <Fragment />;
@@ -48,7 +50,7 @@ function ShowDemoInfo(): VNode {
           This part of the demo shows how a bank that supports Taler directly
           would work. In addition to using your own bank account, you can also
           see the transaction history of some{" "}
-          <a href={privatePages.publicAccountList.url({})}>Public Accounts</a>.
+          <a href={routePublicAccounts.url({})}>Public Accounts</a>.
         </i18n.Translate>
       ) : (
         <i18n.Translate>
@@ -60,7 +62,9 @@ function ShowDemoInfo(): VNode {
   );
 }
 
-function ShowPedingOperation(): VNode {
+function ShowPedingOperation({ routeSolveSecondFactor }: {
+  routeSolveSecondFactor: RouteDefinition<Record<string, never>>;
+}): VNode {
   const { i18n } = useTranslationContext();
   const [bankState, updateBankState] = useBankState();
   if (!bankState.currentChallenge) return <Fragment />;
@@ -93,7 +97,7 @@ function ShowPedingOperation(): VNode {
       </i18n.Translate>{" "}
       <a
         class="font-semibold text-yellow-700 hover:text-yellow-600"
-        href={`#/2fa`}
+        href={routeSolveSecondFactor.url({})}
       >
         <i18n.Translate>this page</i18n.Translate>
       </a>
@@ -107,6 +111,10 @@ export function ReadyView({
   routeChargeWallet,
   routeWireTransfer,
   limit,
+  routeCreateWireTransfer,
+  routePublicAccounts,
+  routeOperationDetails,
+  routeSolveSecondFactor,
   onClose,
   routeClose,
   onOperationCreated,
@@ -114,10 +122,11 @@ export function ReadyView({
 }: State.Ready): VNode {
   return (
     <Fragment>
-      <ShowPedingOperation />
-      <ShowDemoInfo />
+      <ShowPedingOperation routeSolveSecondFactor={routeSolveSecondFactor} />
+      <ShowDemoInfo routePublicAccounts={routePublicAccounts} />
       <PaymentOptions
         tab={tab}
+        routeOperationDetails={routeOperationDetails}
         routeChargeWallet={routeChargeWallet}
         routeWireTransfer={routeWireTransfer}
         limit={limit}
@@ -126,7 +135,7 @@ export function ReadyView({
         onOperationCreated={onOperationCreated}
         onAuthorizationRequired={onAuthorizationRequired}
       />
-      <Transactions account={account} />
+      <Transactions account={account} routeCreateWireTransfer={routeCreateWireTransfer} />
     </Fragment>
   );
 }
diff --git a/packages/demobank-ui/src/pages/BankFrame.tsx b/packages/demobank-ui/src/pages/BankFrame.tsx
index d6ab882f1..f16e0e9bf 100644
--- a/packages/demobank-ui/src/pages/BankFrame.tsx
+++ b/packages/demobank-ui/src/pages/BankFrame.tsx
@@ -26,7 +26,6 @@ import {
 } from "@gnu-taler/web-util/browser";
 import { ComponentChildren, VNode, h } from "preact";
 import { useEffect, useErrorBoundary } from "preact/hooks";
-import { privatePages } from "../Routing.js";
 import { useBankCoreApiContext } from "../context/config.js";
 import { useSettingsContext } from "../context/settings.js";
 import { useAccountDetails } from "../hooks/access.js";
@@ -38,6 +37,7 @@ import {
   usePreferences,
 } from "../hooks/preferences.js";
 import { RenderAmount } from "./PaytoWireTransferForm.js";
+import { RouteDefinition } from "../route.js";
 
 const GIT_HASH = typeof __GIT_HASH__ !== "undefined" ? __GIT_HASH__ : undefined;
 const VERSION = typeof __VERSION__ !== "undefined" ? __VERSION__ : undefined;
@@ -45,8 +45,10 @@ const VERSION = typeof __VERSION__ !== "undefined" ? __VERSION__ : undefined;
 export function BankFrame({
   children,
   account,
+  routeAccountDetails,
 }: {
   account?: string;
+  routeAccountDetails?: RouteDefinition<Record<string, never>>;
   children: ComponentChildren;
 }): VNode {
   const { i18n } = useTranslationContext();
@@ -86,9 +88,9 @@ export function BankFrame({
             backend.state.status !== "loggedIn"
               ? undefined
               : () => {
-                  backend.logOut();
-                  resetBankState();
-                }
+                backend.logOut();
+                resetBankState();
+              }
           }
           sites={
             !settings.topNavSites ? [] : Object.entries(settings.topNavSites)
@@ -143,12 +145,12 @@ export function BankFrame({
       <GlobalNotificationsBanner />
 
       <main class="-mt-32 flex-1">
-        {account && (
+        {account && routeAccountDetails && (
           <header class="py-5 bg-indigo-600   ">
             <div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
               <h1 class=" flex flex-wrap items-center justify-between sm:flex-nowrap">
                 <span class="text-2xl font-bold tracking-tight text-white">
-                  <WelcomeAccount account={account} />
+                  <WelcomeAccount account={account} routeAccountDetails={routeAccountDetails} />
                 </span>
                 <span class="text-2xl font-bold tracking-tight text-white">
                   <AccountBalance account={account} />
@@ -174,7 +176,10 @@ export function BankFrame({
   );
 }
 
-function WelcomeAccount({ account }: { account: string }): VNode {
+function WelcomeAccount({ account, routeAccountDetails }: {
+  account: string,
+  routeAccountDetails: RouteDefinition<Record<string, never>>;
+}): VNode {
   const { i18n } = useTranslationContext();
   const result = useAccountDetails(account);
   if (!result) {
@@ -186,7 +191,7 @@ function WelcomeAccount({ account }: { account: string }): VNode {
   if (result.type === "fail") {
     return (
       <a
-        href={privatePages.myAccountDetails.url({})}
+        href={routeAccountDetails.url({})}
         class="underline underline-offset-2"
       >
         <i18n.Translate>Welcome</i18n.Translate>
@@ -195,7 +200,7 @@ function WelcomeAccount({ account }: { account: string }): VNode {
   }
   return (
     <a
-      href={privatePages.myAccountDetails.url({})}
+      href={routeAccountDetails.url({})}
       class="underline underline-offset-2"
     >
       <i18n.Translate>
diff --git a/packages/demobank-ui/src/pages/OperationState/views.tsx b/packages/demobank-ui/src/pages/OperationState/views.tsx
index dbd8e9b77..40d974a17 100644
--- a/packages/demobank-ui/src/pages/OperationState/views.tsx
+++ b/packages/demobank-ui/src/pages/OperationState/views.tsx
@@ -392,10 +392,7 @@ export function ReadyView({
             <div class="max-w-xl text-sm text-gray-500">
               <p>
                 <i18n.Translate>
-                  If you are using a web browser on desktop you should access
-                  your wallet with the GNU Taler WebExtension now or click the
-                  link if your WebExtension have the "Inject Taler support"
-                  option enabled.
+                  If you are using a web browser on desktop you can also
                 </i18n.Translate>
               </p>
             </div>
diff --git a/packages/demobank-ui/src/pages/PaymentOptions.tsx b/packages/demobank-ui/src/pages/PaymentOptions.tsx
index eb21f637a..39b31a094 100644
--- a/packages/demobank-ui/src/pages/PaymentOptions.tsx
+++ b/packages/demobank-ui/src/pages/PaymentOptions.tsx
@@ -74,6 +74,7 @@ export function PaymentOptions({
   limit,
   onOperationCreated,
   onClose,
+  routeOperationDetails,
   onAuthorizationRequired,
 }: {
   limit: AmountJson;
@@ -81,6 +82,8 @@ export function PaymentOptions({
   onAuthorizationRequired: () => void;
   onOperationCreated: (wopid: string) => void;
   onClose: () => void;
+
+  routeOperationDetails: RouteDefinition<{ wopid: string }>;
   routeClose: RouteDefinition<Record<string, never>>;
   routeChargeWallet: RouteDefinition<Record<string, never>>;
   routeWireTransfer: RouteDefinition<Record<string, never>>;
@@ -111,7 +114,7 @@ export function PaymentOptions({
                   <div class="text-4xl mr-4 my-auto">&#x1F4B5;</div>
                   <span class="grow self-center text-lg text-gray-900 align-middle text-center">
                     <i18n.Translate>
-                      to a <b>Taler</b> wallet
+                      to a Taler wallet
                     </i18n.Translate>
                   </span>
                   <svg
@@ -196,6 +199,7 @@ export function PaymentOptions({
         </div>
         {tab === "charge-wallet" && (
           <WalletWithdrawForm
+            routeOperationDetails={routeOperationDetails}
             focus
             limit={limit}
             onAuthorizationRequired={onAuthorizationRequired}
diff --git a/packages/demobank-ui/src/pages/ProfileNavigation.tsx b/packages/demobank-ui/src/pages/ProfileNavigation.tsx
index 607487c9d..94669584a 100644
--- a/packages/demobank-ui/src/pages/ProfileNavigation.tsx
+++ b/packages/demobank-ui/src/pages/ProfileNavigation.tsx
@@ -15,16 +15,24 @@
  */
 import { useTranslationContext } from "@gnu-taler/web-util/browser";
 import { VNode, h } from "preact";
-import { privatePages } from "../Routing.js";
 import { useBankCoreApiContext } from "../context/config.js";
 import { useBackendState } from "../hooks/backend.js";
 import { assertUnreachable } from "@gnu-taler/taler-util";
 import { useNavigationContext } from "../context/navigation.js";
+import { RouteDefinition } from "../route.js";
 
 export function ProfileNavigation({
   current,
+  routeMyAccountCashout,
+  routeMyAccountDelete,
+  routeMyAccountDetails,
+  routeMyAccountPassword,
 }: {
-  current: "details" | "delete" | "credentials" | "cashouts";
+  current: "details" | "delete" | "credentials" | "cashouts",
+  routeMyAccountDetails: RouteDefinition<Record<string, never>>;
+  routeMyAccountDelete: RouteDefinition<Record<string, never>>;
+  routeMyAccountPassword: RouteDefinition<Record<string, never>>;
+  routeMyAccountCashout: RouteDefinition<Record<string, never>>;
 }): VNode {
   const { i18n } = useTranslationContext();
   const { config } = useBankCoreApiContext();
@@ -48,19 +56,19 @@ export function ProfileNavigation({
             const op = e.currentTarget.value as typeof current;
             switch (op) {
               case "details": {
-                navigateTo(privatePages.myAccountDetails.url({}));
+                navigateTo(routeMyAccountDetails.url({}));
                 return;
               }
               case "delete": {
-                navigateTo(privatePages.myAccountDelete.url({}));
+                navigateTo(routeMyAccountDelete.url({}));
                 return;
               }
               case "credentials": {
-                navigateTo(privatePages.myAccountPassword.url({}));
+                navigateTo(routeMyAccountPassword.url({}));
                 return;
               }
               case "cashouts": {
-                navigateTo(privatePages.myAccountCashouts.url({}));
+                navigateTo(routeMyAccountCashout.url({}));
                 return;
               }
               default:
@@ -92,7 +100,7 @@ export function ProfileNavigation({
           aria-label="Tabs"
         >
           <a
-            href={privatePages.myAccountDetails.url({})}
+            href={routeMyAccountDetails.url({})}
             data-selected={current == "details"}
             class="rounded-l-lg text-gray-500 hover:text-gray-700 data-[selected=true]:text-gray-900 group relative min-w-0 flex-1 overflow-hidden bg-white py-4 px-4 text-center text-sm font-medium hover:bg-gray-50 focus:z-10"
           >
@@ -107,7 +115,7 @@ export function ProfileNavigation({
           </a>
           {!config.allow_deletions ? undefined : (
             <a
-              href={privatePages.myAccountDelete.url({})}
+              href={routeMyAccountDelete.url({})}
               data-selected={current == "delete"}
               aria-current="page"
               class="             text-gray-500 hover:text-gray-700 data-[selected=true]:text-gray-900 group relative min-w-0 flex-1 overflow-hidden bg-white py-4 px-4 text-center text-sm font-medium hover:bg-gray-50 focus:z-10"
@@ -123,7 +131,7 @@ export function ProfileNavigation({
             </a>
           )}
           <a
-            href={privatePages.myAccountPassword.url({})}
+            href={routeMyAccountPassword.url({})}
             data-selected={current == "credentials"}
             aria-current="page"
             class="             text-gray-500 hover:text-gray-700 data-[selected=true]:text-gray-900 group relative min-w-0 flex-1 overflow-hidden bg-white py-4 px-4 text-center text-sm font-medium hover:bg-gray-50 focus:z-10"
@@ -139,7 +147,7 @@ export function ProfileNavigation({
           </a>
           {config.allow_conversion && nonAdminUser ? (
             <a
-              href={privatePages.myAccountCashouts.url({})}
+              href={routeMyAccountCashout.url({})}
               data-selected={current == "cashouts"}
               class="rounded-r-lg text-gray-500 hover:text-gray-700 data-[selected=true]:text-gray-900 group relative min-w-0 flex-1 overflow-hidden bg-white py-4 px-4 text-center text-sm font-medium hover:bg-gray-50 focus:z-10"
             >
diff --git a/packages/demobank-ui/src/pages/PublicHistoriesPage.tsx b/packages/demobank-ui/src/pages/PublicHistoriesPage.tsx
index 0f951b1a8..2864cac65 100644
--- a/packages/demobank-ui/src/pages/PublicHistoriesPage.tsx
+++ b/packages/demobank-ui/src/pages/PublicHistoriesPage.tsx
@@ -31,8 +31,8 @@ export function PublicHistoriesPage(): VNode {
   const result = usePublicAccounts(undefined);
   const firstAccount =
     result &&
-    !(result instanceof TalerError) &&
-    result.data.public_accounts.length > 0
+      !(result instanceof TalerError) &&
+      result.data.public_accounts.length > 0
       ? result.data.public_accounts[0].username
       : undefined;
 
@@ -70,7 +70,7 @@ export function PublicHistoriesPage(): VNode {
         </a>
       </li>,
     );
-    txs[account.username] = <Transactions account={account.username} />;
+    txs[account.username] = <Transactions account={account.username} routeCreateWireTransfer={undefined} />;
   }
 
   return (
diff --git a/packages/demobank-ui/src/pages/QrCodeSection.tsx b/packages/demobank-ui/src/pages/QrCodeSection.tsx
index bf0369855..b439003a0 100644
--- a/packages/demobank-ui/src/pages/QrCodeSection.tsx
+++ b/packages/demobank-ui/src/pages/QrCodeSection.tsx
@@ -141,7 +141,7 @@ export function QrCodeSection({
         <div class="px-4 py-5 sm:p-6">
           <h3 class="text-base font-semibold leading-6 text-gray-900">
             <i18n.Translate>
-              Or if you have the wallet in another device
+              Or if you have the Taler wallet in another device
             </i18n.Translate>
           </h3>
           <div class="mt-4 max-w-xl text-sm text-gray-500">
diff --git a/packages/demobank-ui/src/pages/WalletWithdrawForm.tsx b/packages/demobank-ui/src/pages/WalletWithdrawForm.tsx
index 8ce4c6a09..be1528db8 100644
--- a/packages/demobank-ui/src/pages/WalletWithdrawForm.tsx
+++ b/packages/demobank-ui/src/pages/WalletWithdrawForm.tsx
@@ -20,8 +20,7 @@ import {
   HttpStatusCode,
   TranslatedString,
   assertUnreachable,
-  parseWithdrawUri,
-  stringifyWithdrawUri,
+  parseWithdrawUri
 } from "@gnu-taler/taler-util";
 import {
   Attention,
@@ -33,7 +32,6 @@ import {
 import { VNode, h } from "preact";
 import { forwardRef } from "preact/compat";
 import { useState } from "preact/hooks";
-import { privatePages } from "../Routing.js";
 import { useBankCoreApiContext } from "../context/config.js";
 import { useBackendState } from "../hooks/backend.js";
 import { useBankState } from "../hooks/bank-state.js";
@@ -42,8 +40,6 @@ import { RouteDefinition } from "../route.js";
 import { undefinedIfEmpty } from "../utils.js";
 import { OperationState } from "./OperationState/index.js";
 import { InputAmount, doAutoFocus } from "./PaytoWireTransferForm.js";
-import { useTalerWalletIntegrationAPI } from "../context/wallet-integration.js";
-import { useNavigationContext } from "../context/navigation.js";
 
 const RefAmount = forwardRef(InputAmount);
 
@@ -52,9 +48,11 @@ function OldWithdrawalForm({
   limit,
   routeCancel,
   focus,
+  routeOperationDetails,
 }: {
   limit: AmountJson;
   focus?: boolean;
+  routeOperationDetails: RouteDefinition<{ wopid: string }>,
   onOperationCreated: (wopid: string) => void;
   routeCancel: RouteDefinition<Record<string, never>>;
 }): VNode {
@@ -83,7 +81,7 @@ function OldWithdrawalForm({
     //   withdrawalOperationId: bankState.currentWithdrawalOperationId,
     // });
     // const uri = parseWithdrawUri(suri)!
-    const url = privatePages.operationDetails.url({
+    const url = routeOperationDetails.url({
       wopid: bankState.currentWithdrawalOperationId,
     });
     return (
@@ -95,12 +93,12 @@ function OldWithdrawalForm({
         <a
           class="font-semibold text-yellow-700 hover:text-yellow-600"
           href={url}
-          // onClick={(e) => {
-          //   e.preventDefault()
-          //   walletInegrationApi.publishTalerAction(uri, () => {
-          //     navigateTo(url)
-          //   })
-          // }}
+        // onClick={(e) => {
+        //   e.preventDefault()
+        //   walletInegrationApi.publishTalerAction(uri, () => {
+        //     navigateTo(url)
+        //   })
+        // }}
         >
           <i18n.Translate>this page</i18n.Translate>
         </a>
@@ -285,9 +283,11 @@ export function WalletWithdrawForm({
   onAuthorizationRequired,
   onOperationCreated,
   onOperationAborted,
+  routeOperationDetails,
 }: {
   limit: AmountJson;
   focus?: boolean;
+  routeOperationDetails: RouteDefinition<{ wopid: string }>,
   onAuthorizationRequired: () => void;
   onOperationCreated: (wopid: string) => void;
   onOperationAborted: () => void;
@@ -300,7 +300,7 @@ export function WalletWithdrawForm({
     <div class="grid grid-cols-1 gap-x-8 gap-y-8 pt-10 md:grid-cols-3 bg-gray-100 my-4 px-4 pb-4 rounded-lg">
       <div class="px-4 sm:px-0">
         <h2 class="text-base font-semibold leading-7 text-gray-900">
-          <i18n.Translate>Prepare your wallet</i18n.Translate>
+          <i18n.Translate>Prepare your Taler wallet</i18n.Translate>
         </h2>
         <p class="mt-1 text-sm text-gray-500">
           <i18n.Translate>
@@ -313,7 +313,7 @@ export function WalletWithdrawForm({
       <div class="col-span-2">
         {settings.showInstallWallet && (
           <Attention
-            title={i18n.str`You need a GNU Taler Wallet`}
+            title={i18n.str`You need a Taler wallet`}
             onClose={() => {
               updateSettings("showInstallWallet", false);
             }}
@@ -335,6 +335,7 @@ export function WalletWithdrawForm({
         {!settings.fastWithdrawal ? (
           <OldWithdrawalForm
             focus={focus}
+            routeOperationDetails={routeOperationDetails}
             limit={limit}
             routeCancel={routeCancel}
             onOperationCreated={onOperationCreated}
@@ -345,7 +346,7 @@ export function WalletWithdrawForm({
             onAuthorizationRequired={onAuthorizationRequired}
             routeClose={routeCancel}
             onAbort={onOperationAborted}
-            // route={routeCancel}
+          // route={routeCancel}
           />
         )}
       </div>
diff --git a/packages/demobank-ui/src/pages/WithdrawalConfirmationQuestion.tsx b/packages/demobank-ui/src/pages/WithdrawalConfirmationQuestion.tsx
index 66c27ef4c..e8fff1901 100644
--- a/packages/demobank-ui/src/pages/WithdrawalConfirmationQuestion.tsx
+++ b/packages/demobank-ui/src/pages/WithdrawalConfirmationQuestion.tsx
@@ -214,9 +214,7 @@ export function WithdrawalConfirmationQuestion({
                                   <Fragment>
                                     <div class="px-4 py-2 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0">
                                       <dt class="text-sm font-medium leading-6 text-gray-900">
-                                        <i18n.Translate>
-                                          Taler Exchange operator's account
-                                        </i18n.Translate>
+                                        <i18n.Translate>Payment provider's account number</i18n.Translate>
                                       </dt>
                                       <dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
                                         {p.iban}
@@ -225,12 +223,10 @@ export function WithdrawalConfirmationQuestion({
                                     {name && (
                                       <div class="px-4 py-2 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0">
                                         <dt class="text-sm font-medium leading-6 text-gray-900">
-                                          <i18n.Translate>
-                                            Taler Exchange operator's name
-                                          </i18n.Translate>
+                                          <i18n.Translate>Payment provider's name</i18n.Translate>
                                         </dt>
                                         <dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
-                                          {p.params["receiver-name"]}
+                                          {name}
                                         </dd>
                                       </div>
                                     )}
@@ -244,9 +240,7 @@ export function WithdrawalConfirmationQuestion({
                                   <Fragment>
                                     <div class="px-4 py-2 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0">
                                       <dt class="text-sm font-medium leading-6 text-gray-900">
-                                        <i18n.Translate>
-                                          Taler Exchange operator's account
-                                        </i18n.Translate>
+                                        <i18n.Translate>Payment provider's account id</i18n.Translate>
                                       </dt>
                                       <dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
                                         {p.account}
@@ -255,12 +249,10 @@ export function WithdrawalConfirmationQuestion({
                                     {name && (
                                       <div class="px-4 py-2 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0">
                                         <dt class="text-sm font-medium leading-6 text-gray-900">
-                                          <i18n.Translate>
-                                            Taler Exchange operator's name
-                                          </i18n.Translate>
+                                          <i18n.Translate>Payment provider's name</i18n.Translate>
                                         </dt>
                                         <dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
-                                          {p.params["receiver-name"]}
+                                          {name}
                                         </dd>
                                       </div>
                                     )}
@@ -271,9 +263,7 @@ export function WithdrawalConfirmationQuestion({
                                 return (
                                   <div class="px-4 py-2 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0">
                                     <dt class="text-sm font-medium leading-6 text-gray-900">
-                                      <i18n.Translate>
-                                        Taler Exchange operator's account
-                                      </i18n.Translate>
+                                      <i18n.Translate>Payment provider's account</i18n.Translate>
                                     </dt>
                                     <dd class="mt-1 text-sm leading-6 text-gray-700 sm:col-span-2 sm:mt-0">
                                       {details.account.targetPath}
diff --git a/packages/demobank-ui/src/pages/WithdrawalOperationPage.tsx b/packages/demobank-ui/src/pages/WithdrawalOperationPage.tsx
index e69a4dfb2..e03260dbb 100644
--- a/packages/demobank-ui/src/pages/WithdrawalOperationPage.tsx
+++ b/packages/demobank-ui/src/pages/WithdrawalOperationPage.tsx
@@ -30,6 +30,7 @@ export function WithdrawalOperationPage({
 }: {
   onAuthorizationRequired: () => void;
   operationId: string;
+  pupose: "after-creation" | "after-confirmation",
   onOperationAborted: () => void;
   routeClose: RouteDefinition<Record<string, never>>;
 }): VNode {
diff --git a/packages/demobank-ui/src/pages/WithdrawalQRCode.tsx b/packages/demobank-ui/src/pages/WithdrawalQRCode.tsx
index a23909338..8faa91d07 100644
--- a/packages/demobank-ui/src/pages/WithdrawalQRCode.tsx
+++ b/packages/demobank-ui/src/pages/WithdrawalQRCode.tsx
@@ -101,7 +101,7 @@ export function WithdrawalQRCode({
             <div class="mt-2">
               <p class="text-sm text-gray-500">
                 <i18n.Translate>
-                  The wire transfer to the Taler Exchange operator's account was
+                  The wire transfer to the payment provider's account was
                   aborted from somewhere else, your balance was not affected.
                 </i18n.Translate>
               </p>
@@ -169,6 +169,7 @@ export function WithdrawalQRCode({
       </div>
     );
   }
+
   if (data.status === "pending") {
     return (
       <QrCodeSection
diff --git a/packages/demobank-ui/src/pages/account/CashoutListForAccount.tsx b/packages/demobank-ui/src/pages/account/CashoutListForAccount.tsx
index 670bbaea0..656c2a52a 100644
--- a/packages/demobank-ui/src/pages/account/CashoutListForAccount.tsx
+++ b/packages/demobank-ui/src/pages/account/CashoutListForAccount.tsx
@@ -26,12 +26,20 @@ interface Props {
   routeClose: RouteDefinition<Record<string, never>>;
   onAuthorizationRequired: () => void;
   routeCashoutDetails: RouteDefinition<{ cid: string }>;
+  routeMyAccountDetails: RouteDefinition<Record<string, never>>;
+  routeMyAccountDelete: RouteDefinition<Record<string, never>>;
+  routeMyAccountPassword: RouteDefinition<Record<string, never>>;
+  routeMyAccountCashout: RouteDefinition<Record<string, never>>;
 }
 
 export function CashoutListForAccount({
   account,
   onAuthorizationRequired,
   routeCashoutDetails,
+  routeMyAccountCashout,
+  routeMyAccountDelete,
+  routeMyAccountDetails,
+  routeMyAccountPassword,
   routeClose,
 }: Props): VNode {
   const { i18n } = useTranslationContext();
@@ -46,7 +54,12 @@ export function CashoutListForAccount({
   return (
     <Fragment>
       {accountIsTheCurrentUser ? (
-        <ProfileNavigation current="cashouts" />
+        <ProfileNavigation current="cashouts"
+          routeMyAccountCashout={routeMyAccountCashout}
+          routeMyAccountDelete={routeMyAccountDelete}
+          routeMyAccountDetails={routeMyAccountDetails}
+          routeMyAccountPassword={routeMyAccountPassword}
+        />
       ) : (
         <h1 class="text-base font-semibold leading-6 text-gray-900">
           <i18n.Translate>Cashout for account {account}</i18n.Translate>
diff --git a/packages/demobank-ui/src/pages/account/ShowAccountDetails.tsx b/packages/demobank-ui/src/pages/account/ShowAccountDetails.tsx
index 6d5a1c18d..70fd85ee8 100644
--- a/packages/demobank-ui/src/pages/account/ShowAccountDetails.tsx
+++ b/packages/demobank-ui/src/pages/account/ShowAccountDetails.tsx
@@ -46,8 +46,16 @@ export function ShowAccountDetails({
   routeClose,
   onUpdateSuccess,
   onAuthorizationRequired,
+  routeMyAccountCashout,
+  routeMyAccountDelete,
+  routeMyAccountDetails,
+  routeMyAccountPassword,
 }: {
   routeClose: RouteDefinition<Record<string, never>>;
+  routeMyAccountDetails: RouteDefinition<Record<string, never>>;
+  routeMyAccountDelete: RouteDefinition<Record<string, never>>;
+  routeMyAccountPassword: RouteDefinition<Record<string, never>>;
+  routeMyAccountCashout: RouteDefinition<Record<string, never>>;
   onUpdateSuccess: () => void;
   onAuthorizationRequired: () => void;
   account: string;
@@ -171,7 +179,12 @@ export function ShowAccountDetails({
     <Fragment>
       <LocalNotificationBanner notification={notification} showDebug={true} />
       {accountIsTheCurrentUser ? (
-        <ProfileNavigation current="details" />
+        <ProfileNavigation current="details"
+          routeMyAccountCashout={routeMyAccountCashout}
+          routeMyAccountDelete={routeMyAccountDelete}
+          routeMyAccountDetails={routeMyAccountDetails}
+          routeMyAccountPassword={routeMyAccountPassword}
+        />
       ) : (
         <h1 class="text-base font-semibold leading-6 text-gray-900">
           <i18n.Translate>Account "{account}"</i18n.Translate>
diff --git a/packages/demobank-ui/src/pages/account/UpdateAccountPassword.tsx b/packages/demobank-ui/src/pages/account/UpdateAccountPassword.tsx
index 4dcce599d..3ce9b1094 100644
--- a/packages/demobank-ui/src/pages/account/UpdateAccountPassword.tsx
+++ b/packages/demobank-ui/src/pages/account/UpdateAccountPassword.tsx
@@ -41,9 +41,17 @@ export function UpdateAccountPassword({
   routeClose,
   onUpdateSuccess,
   onAuthorizationRequired,
+  routeMyAccountCashout,
+  routeMyAccountDelete,
+  routeMyAccountDetails,
+  routeMyAccountPassword,
   focus,
 }: {
   routeClose: RouteDefinition<Record<string, never>>;
+  routeMyAccountDetails: RouteDefinition<Record<string, never>>;
+  routeMyAccountDelete: RouteDefinition<Record<string, never>>;
+  routeMyAccountPassword: RouteDefinition<Record<string, never>>;
+  routeMyAccountCashout: RouteDefinition<Record<string, never>>;
   focus?: boolean;
   onAuthorizationRequired: () => void;
   onUpdateSuccess: () => void;
@@ -136,7 +144,12 @@ export function UpdateAccountPassword({
     <Fragment>
       <LocalNotificationBanner notification={notification} />
       {accountIsTheCurrentUser ? (
-        <ProfileNavigation current="credentials" />
+        <ProfileNavigation current="credentials"
+          routeMyAccountCashout={routeMyAccountCashout}
+          routeMyAccountDelete={routeMyAccountDelete}
+          routeMyAccountDetails={routeMyAccountDetails}
+          routeMyAccountPassword={routeMyAccountPassword}
+        />
       ) : (
         <h1 class="text-base font-semibold leading-6 text-gray-900">
           <i18n.Translate>Account "{accountName}"</i18n.Translate>
diff --git a/packages/demobank-ui/src/pages/admin/AccountForm.tsx b/packages/demobank-ui/src/pages/admin/AccountForm.tsx
index fcad47b4a..5d4a5c5db 100644
--- a/packages/demobank-ui/src/pages/admin/AccountForm.tsx
+++ b/packages/demobank-ui/src/pages/admin/AccountForm.tsx
@@ -475,9 +475,9 @@ export function AccountForm<PurposeType extends keyof ChangeByPurposeType>({
                 !editableThreshold
                   ? undefined
                   : (e) => {
-                      form.debit_threshold = e as AmountString;
-                      updateForm(structuredClone(form));
-                    }
+                    form.debit_threshold = e as AmountString;
+                    updateForm(structuredClone(form));
+                  }
               }
             />
             <ShowInputErrorLabel
@@ -503,7 +503,7 @@ export function AccountForm<PurposeType extends keyof ChangeByPurposeType>({
                     class="text-sm text-black font-medium leading-6 "
                     id="availability-label"
                   >
-                    <i18n.Translate>Is this a Taler Exchange?</i18n.Translate>
+                    <i18n.Translate>Is this a payment provider?</i18n.Translate>
                   </span>
                 </span>
                 <button
@@ -538,7 +538,7 @@ export function AccountForm<PurposeType extends keyof ChangeByPurposeType>({
           )}
           {/* channel, not shown if old cashout api */}
           {OLD_CASHOUT_API ||
-          config.supported_tan_channels.length === 0 ? undefined : (
+            config.supported_tan_channels.length === 0 ? undefined : (
             <div class="sm:col-span-5">
               <label
                 class="block text-sm font-medium leading-6 text-gray-900"
@@ -549,7 +549,7 @@ export function AccountForm<PurposeType extends keyof ChangeByPurposeType>({
               <div class="mt-2 max-w-xl text-sm text-gray-500">
                 <div class="px-4 mt-4 grid grid-cols-1 gap-y-6">
                   {config.supported_tan_channels.indexOf(TanChannel.EMAIL) ===
-                  -1 ? undefined : (
+                    -1 ? undefined : (
                     <label
                       onClick={(e) => {
                         if (!hasEmail) return;
@@ -607,7 +607,7 @@ export function AccountForm<PurposeType extends keyof ChangeByPurposeType>({
                   )}
 
                   {config.supported_tan_channels.indexOf(TanChannel.SMS) ===
-                  -1 ? undefined : (
+                    -1 ? undefined : (
                     <label
                       onClick={(e) => {
                         if (!hasPhone) return;
diff --git a/packages/demobank-ui/src/pages/admin/AdminHome.tsx b/packages/demobank-ui/src/pages/admin/AdminHome.tsx
index f0f8f71be..1a7edd6b9 100644
--- a/packages/demobank-ui/src/pages/admin/AdminHome.tsx
+++ b/packages/demobank-ui/src/pages/admin/AdminHome.tsx
@@ -37,21 +37,22 @@ import {
 } from "date-fns";
 import { Fragment, VNode, h } from "preact";
 import { useState } from "preact/hooks";
-import { privatePages } from "../../Routing.js";
 import { ErrorLoadingWithDebug } from "../../components/ErrorLoadingWithDebug.js";
 import { Transactions } from "../../components/Transactions/index.js";
 import { useBankCoreApiContext } from "../../context/config.js";
 import { useConversionInfo, useLastMonitorInfo } from "../../hooks/circuit.js";
+import { RouteDefinition } from "../../route.js";
 import { RenderAmount } from "../PaytoWireTransferForm.js";
 import { WireTransfer } from "../WireTransfer.js";
 import { AccountList } from "./AccountList.js";
-import { RouteDefinition } from "../../route.js";
 
 /**
  * Query account information and show QR code if there is pending withdrawal
  */
 interface Props {
   routeCreate: RouteDefinition<Record<string, never>>;
+  routeDownloadStats: RouteDefinition<Record<string, never>>;
+  routeCreateWireTransfer: RouteDefinition<{ destination: string }>;
 
   routeShowAccount: RouteDefinition<{ account: string }>;
   routeRemoveAccount: RouteDefinition<{ account: string }>;
@@ -65,14 +66,16 @@ export function AdminHome({
   routeShowAccount,
   routeShowCashoutsAccount,
   routeUpdatePasswordAccount,
+  routeDownloadStats,
+  routeCreateWireTransfer,
   onAuthorizationRequired,
 }: Props): VNode {
   return (
     <Fragment>
-      <Metrics />
+      <Metrics routeDownloadStats={routeDownloadStats} />
       <WireTransfer onAuthorizationRequired={onAuthorizationRequired} />
 
-      <Transactions account="admin" />
+      <Transactions account="admin" routeCreateWireTransfer={routeCreateWireTransfer} />
       <AccountList
         routeCreate={routeCreate}
         routeRemoveAccount={routeRemoveAccount}
@@ -140,7 +143,9 @@ export function getTimeframesForDate(
   }
 }
 
-function Metrics(): VNode {
+function Metrics({ routeDownloadStats }: {
+  routeDownloadStats: RouteDefinition<Record<string, never>>;
+}): VNode {
   const { i18n, dateLocale } = useTranslationContext();
   const [metricType, setMetricType] =
     useState<TalerCorebankApi.MonitorTimeframeParam>(
@@ -335,7 +340,7 @@ function Metrics(): VNode {
       </div>
       <dl class="mt-5 grid grid-cols-1 md:grid-cols-2  divide-y divide-gray-200 overflow-hidden rounded-lg bg-white shadow-lg md:divide-x md:divide-y-0">
         {resp.current.body.type !== "with-conversions" ||
-        resp.previous.body.type !== "with-conversions" ? undefined : (
+          resp.previous.body.type !== "with-conversions" ? undefined : (
           <Fragment>
             <div class="px-4 py-5 sm:p-6">
               <dt class="text-base font-normal text-gray-900">
@@ -382,7 +387,7 @@ function Metrics(): VNode {
       </dl>
       <div class="flex justify-end mt-2">
         <a
-          href={privatePages.statsDownload.url({})}
+          href={routeDownloadStats.url({})}
           class="disabled:opacity-50 disabled:cursor-default cursor-pointer rounded-md bg-indigo-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
         >
           <i18n.Translate>Download stats as CSV</i18n.Translate>
@@ -411,9 +416,9 @@ function MetricValue({
 
   const rate =
     !currAmount ||
-    Number.isNaN(currAmount) ||
-    !prevAmount ||
-    Number.isNaN(prevAmount)
+      Number.isNaN(currAmount) ||
+      !prevAmount ||
+      Number.isNaN(prevAmount)
       ? 0
       : cmp === -1
         ? 1 - Math.round(currAmount) / Math.round(prevAmount)