withdraw call to action

4 files changed, 7 insertions, 4 deletions

diff --git a/packages/taler-wallet-webextension/src/cta/Deposit/index.ts b/packages/taler-wallet-webextension/src/cta/Deposit/index.ts
index c2d700617..796fad97c 100644
--- a/packages/taler-wallet-webextension/src/cta/Deposit/index.ts
+++ b/packages/taler-wallet-webextension/src/cta/Deposit/index.ts
@@ -28,6 +28,7 @@ import { CompletedView, LoadingUriView, ReadyView } from "./views.js";
 export interface Props {
   talerDepositUri: string | undefined,
   amountStr: AmountString | undefined,
+  cancel: () => Promise<void>;
 }
 
 export type State =
@@ -53,6 +54,7 @@ export namespace State {
     cost: AmountJson;
     effective: AmountJson;
     confirm: ButtonHandler;
+    cancel: () => Promise<void>;
   }
   export interface Completed {
     status: "completed";
diff --git a/packages/taler-wallet-webextension/src/cta/Deposit/state.ts b/packages/taler-wallet-webextension/src/cta/Deposit/state.ts
index 8876a2971..3939c7ba2 100644
--- a/packages/taler-wallet-webextension/src/cta/Deposit/state.ts
+++ b/packages/taler-wallet-webextension/src/cta/Deposit/state.ts
@@ -22,7 +22,7 @@ import * as wxApi from "../../wxApi.js";
 import { Props, State } from "./index.js";
 
 export function useComponentState(
-  { talerDepositUri, amountStr }: Props,
+  { talerDepositUri, amountStr, cancel }: Props,
   api: typeof wxApi,
 ): State {
   const [result, setResult] = useState<CreateDepositGroupResponse | undefined>(
@@ -72,5 +72,6 @@ export function useComponentState(
       .amount,
     cost: deposit.totalDepositCost,
     effective: deposit.effectiveDepositAmount,
+    cancel,
   };
 }
\ No newline at end of file
diff --git a/packages/taler-wallet-webextension/src/cta/Deposit/test.ts b/packages/taler-wallet-webextension/src/cta/Deposit/test.ts
index 6e7aaf237..4e7f5cfb4 100644
--- a/packages/taler-wallet-webextension/src/cta/Deposit/test.ts
+++ b/packages/taler-wallet-webextension/src/cta/Deposit/test.ts
@@ -30,7 +30,7 @@ describe("Deposit CTA states", () => {
   it("should tell the user that the URI is missing", async () => {
     const { getLastResultOrThrow, waitNextUpdate, assertNoPendingUpdate } =
       mountHook(() =>
-        useComponentState({ talerDepositUri: undefined, amountStr: undefined }, {
+        useComponentState({ talerDepositUri: undefined, amountStr: undefined, cancel: async () => { null } }, {
           prepareRefund: async () => ({}),
           applyRefund: async () => ({}),
           onUpdateNotification: async () => ({}),
@@ -61,7 +61,7 @@ describe("Deposit CTA states", () => {
   it("should be ready after loading", async () => {
     const { getLastResultOrThrow, waitNextUpdate, assertNoPendingUpdate } =
       mountHook(() =>
-        useComponentState({ talerDepositUri: "payto://refund/asdasdas", amountStr: "EUR:1" }, {
+        useComponentState({ talerDepositUri: "payto://refund/asdasdas", amountStr: "EUR:1", cancel: async () => { null } }, {
           prepareDeposit: async () =>
           ({
             effectiveDepositAmount: Amounts.parseOrThrow("EUR:1"),
diff --git a/packages/taler-wallet-webextension/src/cta/Deposit/views.tsx b/packages/taler-wallet-webextension/src/cta/Deposit/views.tsx
index ba1ca58d6..9045e5bfa 100644
--- a/packages/taler-wallet-webextension/src/cta/Deposit/views.tsx
+++ b/packages/taler-wallet-webextension/src/cta/Deposit/views.tsx
@@ -100,7 +100,7 @@ export function ReadyView(state: State.Ready): VNode {
           onClick={state.confirm.onClick}
         >
           <i18n.Translate>
-            Deposit {<Amount value={state.effective} />}
+            Send &nbsp; {<Amount value={state.cost} />}
           </i18n.Translate>
         </Button>
       </section>