From e759684fd0658b4a3ba241744424ceda11bd500b Mon Sep 17 00:00:00 2001 From: Sebastian Date: Wed, 31 Aug 2022 11:46:39 -0300 Subject: invoice and transfer details --- .../src/cta/InvoiceCreate/index.ts | 3 +- .../src/cta/InvoiceCreate/state.ts | 9 ++++-- .../src/cta/InvoiceCreate/stories.tsx | 5 ++-- .../src/cta/InvoiceCreate/views.tsx | 21 +++++++++++-- .../src/cta/InvoicePay/index.ts | 6 +++- .../src/cta/InvoicePay/state.ts | 16 ++++++++-- .../src/cta/InvoicePay/stories.tsx | 1 + .../src/cta/InvoicePay/views.tsx | 34 ++++++++++++++-------- .../taler-wallet-webextension/src/cta/Tip/index.ts | 4 +-- .../taler-wallet-webextension/src/cta/Tip/state.ts | 6 ++-- .../taler-wallet-webextension/src/cta/Tip/test.ts | 8 ++--- .../src/cta/TransferCreate/index.ts | 9 +++--- .../src/cta/TransferCreate/state.ts | 11 +++++-- .../src/cta/TransferCreate/stories.tsx | 5 ++-- .../src/cta/TransferCreate/views.tsx | 24 +++++++++++++-- .../src/cta/TransferPickup/index.ts | 6 +++- .../src/cta/TransferPickup/state.ts | 16 ++++++++-- .../src/cta/TransferPickup/stories.tsx | 1 + .../src/cta/TransferPickup/views.tsx | 24 +++++++++++++-- 19 files changed, 159 insertions(+), 50 deletions(-) (limited to 'packages/taler-wallet-webextension/src/cta') diff --git a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/index.ts b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/index.ts index f12fd80e0..0ef341fa9 100644 --- a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/index.ts +++ b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/index.ts @@ -25,6 +25,7 @@ import { ButtonHandler, SelectFieldHandler, TextFieldHandler } from "../../mui/h export interface Props { amount: string; + onClose: () => Promise; } export type State = @@ -47,11 +48,11 @@ export namespace State { export interface BaseInfo { error: undefined; + cancel: ButtonHandler; } export interface ShowQr extends BaseInfo { status: "show-qr"; talerUri: string; - close: () => void; } export interface Ready extends BaseInfo { status: "ready"; diff --git a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/state.ts b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/state.ts index dd9220480..f6a0847b2 100644 --- a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/state.ts +++ b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/state.ts @@ -22,7 +22,7 @@ import * as wxApi from "../../wxApi.js"; import { Props, State } from "./index.js"; export function useComponentState( - { amount: amountStr }: Props, + { amount: amountStr, onClose }: Props, api: typeof wxApi, ): State { const amount = Amounts.parseOrThrow(amountStr) @@ -53,7 +53,9 @@ export function useComponentState( status: "show-qr", talerUri, error: undefined, - close: () => { null }, + cancel: { + onClick: onClose + } // chosenAmount: amount, // toBeReceived: amount, } @@ -105,6 +107,9 @@ export function useComponentState( setTalerUri(uri) } }, + cancel: { + onClick: onClose + }, chosenAmount: amount, toBeReceived: amount, error: undefined, diff --git a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/stories.tsx b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/stories.tsx index e6252062e..970b51b55 100644 --- a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/stories.tsx +++ b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/stories.tsx @@ -29,9 +29,7 @@ export default { export const ShowQr = createExample(ShowQrView, { talerUri: "taler://pay-pull/exchange.taler.ar/HS585JK0QCXHJ8Z8QWZA3EBAY5WY7XNC1RR2MHJXSH2Z4WP0YPJ0", - close: () => { - null; - }, + cancel: {}, }); export const Ready = createExample(ReadyView, { @@ -40,6 +38,7 @@ export const Ready = createExample(ReadyView, { value: 1, fraction: 0, }, + cancel: {}, toBeReceived: { currency: "ARS", value: 1, diff --git a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/views.tsx b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/views.tsx index ebb15e75c..3de36b6e9 100644 --- a/packages/taler-wallet-webextension/src/cta/InvoiceCreate/views.tsx +++ b/packages/taler-wallet-webextension/src/cta/InvoiceCreate/views.tsx @@ -15,6 +15,7 @@ */ import { h, VNode } from "preact"; +import { ErrorTalerOperation } from "../../components/ErrorTalerOperation.js"; import { LoadingError } from "../../components/LoadingError.js"; import { LogoHeader } from "../../components/LogoHeader.js"; import { Part } from "../../components/Part.js"; @@ -44,7 +45,7 @@ export function LoadingUriView({ error }: State.LoadingUriError): VNode { ); } -export function ShowQrView({ talerUri, close }: State.ShowQr): VNode { +export function ShowQrView({ talerUri, cancel }: State.ShowQr): VNode { const { i18n } = useTranslationContext(); return ( @@ -57,7 +58,7 @@ export function ShowQrView({ talerUri, close }: State.ShowQr): VNode {
- + Close
@@ -70,6 +71,7 @@ export function ReadyView({ exchangeUrl, subject, showQr, + cancel, operationError, copyToClipboard, toBeReceived, @@ -83,6 +85,16 @@ export function ReadyView({ Digital invoice + {operationError && ( + + Could not finish the invoice creation + + } + error={operationError} + /> + )}
+
+ + Cancel + +
); } diff --git a/packages/taler-wallet-webextension/src/cta/InvoicePay/index.ts b/packages/taler-wallet-webextension/src/cta/InvoicePay/index.ts index 8d1612c7a..2521ee69c 100644 --- a/packages/taler-wallet-webextension/src/cta/InvoicePay/index.ts +++ b/packages/taler-wallet-webextension/src/cta/InvoicePay/index.ts @@ -14,7 +14,7 @@ GNU Taler; see the file COPYING. If not, see */ -import { AmountJson, TalerErrorDetail } from "@gnu-taler/taler-util"; +import { AbsoluteTime, AmountJson, TalerErrorDetail } from "@gnu-taler/taler-util"; import { Loading } from "../../components/Loading.js"; import { HookError } from "../../hooks/useAsyncAsHook.js"; import { ButtonHandler } from "../../mui/handlers.js"; @@ -25,6 +25,7 @@ import { LoadingUriView, ReadyView } from "./views.js"; export interface Props { talerPayPullUri: string; + onClose: () => Promise; } export type State = @@ -46,10 +47,13 @@ export namespace State { export interface BaseInfo { error: undefined; + cancel: ButtonHandler; } export interface Ready extends BaseInfo { status: "ready"; amount: AmountJson, + summary: string | undefined, + expiration: AbsoluteTime | undefined, error: undefined; accept: ButtonHandler; operationError?: TalerErrorDetail; diff --git a/packages/taler-wallet-webextension/src/cta/InvoicePay/state.ts b/packages/taler-wallet-webextension/src/cta/InvoicePay/state.ts index 53db117f9..27be1e424 100644 --- a/packages/taler-wallet-webextension/src/cta/InvoicePay/state.ts +++ b/packages/taler-wallet-webextension/src/cta/InvoicePay/state.ts @@ -14,7 +14,7 @@ GNU Taler; see the file COPYING. If not, see */ -import { Amounts, TalerErrorDetail } from "@gnu-taler/taler-util"; +import { AbsoluteTime, Amounts, TalerErrorDetail, TalerProtocolTimestamp } from "@gnu-taler/taler-util"; import { TalerError } from "@gnu-taler/taler-wallet-core"; import { useState } from "preact/hooks"; import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js"; @@ -22,7 +22,7 @@ import * as wxApi from "../../wxApi.js"; import { Props, State } from "./index.js"; export function useComponentState( - { talerPayPullUri }: Props, + { talerPayPullUri, onClose }: Props, api: typeof wxApi, ): State { const hook = useAsyncAsHook(async () => { @@ -45,13 +45,18 @@ export function useComponentState( }; } - const { amount, peerPullPaymentIncomingId } = hook.response + const { amount: purseAmount, contractTerms, peerPullPaymentIncomingId } = hook.response + + const amount: string = contractTerms?.amount + const summary: string | undefined = contractTerms?.summary + const expiration: TalerProtocolTimestamp | undefined = contractTerms?.purse_expiration async function accept(): Promise { try { const resp = await api.acceptPeerPullPayment({ peerPullPaymentIncomingId }) + await onClose() } catch (e) { if (e instanceof TalerError) { setOperationError(e.errorDetail) @@ -69,6 +74,11 @@ export function useComponentState( accept: { onClick: accept }, + summary, + expiration: expiration ? AbsoluteTime.fromTimestamp(expiration) : undefined, + cancel: { + onClick: onClose + }, operationError } } diff --git a/packages/taler-wallet-webextension/src/cta/InvoicePay/stories.tsx b/packages/taler-wallet-webextension/src/cta/InvoicePay/stories.tsx index 6adaa5c22..81b79a208 100644 --- a/packages/taler-wallet-webextension/src/cta/InvoicePay/stories.tsx +++ b/packages/taler-wallet-webextension/src/cta/InvoicePay/stories.tsx @@ -33,4 +33,5 @@ export const Ready = createExample(ReadyView, { fraction: 0, }, accept: {}, + cancel: {}, }); diff --git a/packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx b/packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx index 2960c3168..71bdb20b8 100644 --- a/packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx +++ b/packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx @@ -20,19 +20,10 @@ import { ErrorTalerOperation } from "../../components/ErrorTalerOperation.js"; import { LoadingError } from "../../components/LoadingError.js"; import { LogoHeader } from "../../components/LogoHeader.js"; import { Part } from "../../components/Part.js"; -import { QR } from "../../components/QR.js"; -import { - Link, - SubTitle, - SvgIcon, - WalletAction, -} from "../../components/styled/index.js"; +import { Link, SubTitle, WalletAction } from "../../components/styled/index.js"; +import { Time } from "../../components/Time.js"; import { useTranslationContext } from "../../context/translation.js"; import { Button } from "../../mui/Button.js"; -import { Grid } from "../../mui/Grid.js"; -import { TextField } from "../../mui/TextField.js"; -import editIcon from "../../svg/edit_24px.svg"; -import { ExchangeDetails, InvoiceDetails } from "../../wallet/Transaction.js"; import { State } from "./index.js"; export function LoadingUriView({ error }: State.LoadingUriError): VNode { @@ -48,7 +39,10 @@ export function LoadingUriView({ error }: State.LoadingUriError): VNode { export function ReadyView({ operationError, + cancel, accept, + expiration, + summary, amount, }: State.Ready): VNode { const { i18n } = useTranslationContext(); @@ -70,16 +64,32 @@ export function ReadyView({ /> )}
+ Subject} + text={
{summary}
} + /> Amount} text={} /> + Valid until} + text={
+
+ + Cancel + +
); } diff --git a/packages/taler-wallet-webextension/src/cta/Tip/index.ts b/packages/taler-wallet-webextension/src/cta/Tip/index.ts index b174d5160..53c890b2c 100644 --- a/packages/taler-wallet-webextension/src/cta/Tip/index.ts +++ b/packages/taler-wallet-webextension/src/cta/Tip/index.ts @@ -30,7 +30,7 @@ import { AcceptedView, IgnoredView, LoadingUriView, ReadyView } from "./views.js export interface Props { talerTipUri?: string; - cancel: () => Promise; + onCancel: () => Promise; } export type State = @@ -58,6 +58,7 @@ export namespace State { amount: AmountJson; exchangeBaseUrl: string; error: undefined; + cancel: ButtonHandler; } export interface Ignored extends BaseInfo { @@ -70,7 +71,6 @@ export namespace State { export interface Ready extends BaseInfo { status: "ready"; accept: ButtonHandler; - cancel: () => Promise; } } diff --git a/packages/taler-wallet-webextension/src/cta/Tip/state.ts b/packages/taler-wallet-webextension/src/cta/Tip/state.ts index f18911f65..aa62bd5e3 100644 --- a/packages/taler-wallet-webextension/src/cta/Tip/state.ts +++ b/packages/taler-wallet-webextension/src/cta/Tip/state.ts @@ -22,7 +22,7 @@ import * as wxApi from "../../wxApi.js"; import { Props, State } from "./index.js"; export function useComponentState( - { talerTipUri, cancel }: Props, + { talerTipUri, onCancel }: Props, api: typeof wxApi, ): State { const [tipIgnored, setTipIgnored] = useState(false); @@ -58,6 +58,9 @@ export function useComponentState( exchangeBaseUrl: tip.exchangeBaseUrl, amount: Amounts.parseOrThrow(tip.tipAmountEffective), error: undefined, + cancel: { + onClick: onCancel + } } if (tipIgnored) { @@ -80,7 +83,6 @@ export function useComponentState( accept: { onClick: doAccept, }, - cancel, }; } diff --git a/packages/taler-wallet-webextension/src/cta/Tip/test.ts b/packages/taler-wallet-webextension/src/cta/Tip/test.ts index 363652e47..ccb36572e 100644 --- a/packages/taler-wallet-webextension/src/cta/Tip/test.ts +++ b/packages/taler-wallet-webextension/src/cta/Tip/test.ts @@ -30,7 +30,7 @@ describe("Tip CTA states", () => { it("should tell the user that the URI is missing", async () => { const { getLastResultOrThrow, waitNextUpdate, assertNoPendingUpdate } = mountHook(() => - useComponentState({ talerTipUri: undefined, cancel: async () => { null } }, { + useComponentState({ talerTipUri: undefined, onCancel: async () => { null } }, { prepareTip: async () => ({}), acceptTip: async () => ({}), } as any), @@ -62,7 +62,7 @@ describe("Tip CTA states", () => { const { getLastResultOrThrow, waitNextUpdate, assertNoPendingUpdate } = mountHook(() => - useComponentState({ talerTipUri: "taler://tip/asd", cancel: async () => { null } }, { + useComponentState({ talerTipUri: "taler://tip/asd", onCancel: async () => { null } }, { prepareTip: async () => ({ accepted: tipAccepted, @@ -114,7 +114,7 @@ describe("Tip CTA states", () => { it("should be ignored after clicking the ignore button", async () => { const { getLastResultOrThrow, waitNextUpdate, assertNoPendingUpdate } = mountHook(() => - useComponentState({ talerTipUri: "taler://tip/asd", cancel: async () => { null } }, { + useComponentState({ talerTipUri: "taler://tip/asd", onCancel: async () => { null } }, { prepareTip: async () => ({ exchangeBaseUrl: "exchange url", @@ -160,7 +160,7 @@ describe("Tip CTA states", () => { it("should render accepted if the tip has been used previously", async () => { const { getLastResultOrThrow, waitNextUpdate, assertNoPendingUpdate } = mountHook(() => - useComponentState({ talerTipUri: "taler://tip/asd", cancel: async () => { null } }, { + useComponentState({ talerTipUri: "taler://tip/asd", onCancel: async () => { null } }, { prepareTip: async () => ({ accepted: true, diff --git a/packages/taler-wallet-webextension/src/cta/TransferCreate/index.ts b/packages/taler-wallet-webextension/src/cta/TransferCreate/index.ts index fd034341e..ddd431c4e 100644 --- a/packages/taler-wallet-webextension/src/cta/TransferCreate/index.ts +++ b/packages/taler-wallet-webextension/src/cta/TransferCreate/index.ts @@ -14,17 +14,18 @@ GNU Taler; see the file COPYING. If not, see */ +import { AmountJson, TalerErrorDetail } from "@gnu-taler/taler-util"; import { Loading } from "../../components/Loading.js"; import { HookError } from "../../hooks/useAsyncAsHook.js"; +import { ButtonHandler, TextFieldHandler } from "../../mui/handlers.js"; import { compose, StateViewMap } from "../../utils/index.js"; -import { LoadingUriView, ReadyView, ShowQrView } from "./views.js"; import * as wxApi from "../../wxApi.js"; import { useComponentState } from "./state.js"; -import { AmountJson, TalerErrorDetail } from "@gnu-taler/taler-util"; -import { ButtonHandler, SelectFieldHandler, TextFieldHandler } from "../../mui/handlers.js"; +import { LoadingUriView, ReadyView, ShowQrView } from "./views.js"; export interface Props { amount: string; + onClose: () => Promise; } export type State = @@ -47,11 +48,11 @@ export namespace State { export interface BaseInfo { error: undefined; + cancel: ButtonHandler; } export interface ShowQr extends BaseInfo { status: "show-qr"; talerUri: string; - close: () => void; } export interface Ready extends BaseInfo { status: "ready"; diff --git a/packages/taler-wallet-webextension/src/cta/TransferCreate/state.ts b/packages/taler-wallet-webextension/src/cta/TransferCreate/state.ts index 9853f05ff..cee41b708 100644 --- a/packages/taler-wallet-webextension/src/cta/TransferCreate/state.ts +++ b/packages/taler-wallet-webextension/src/cta/TransferCreate/state.ts @@ -21,7 +21,7 @@ import * as wxApi from "../../wxApi.js"; import { Props, State } from "./index.js"; export function useComponentState( - { amount: amountStr }: Props, + { amount: amountStr, onClose }: Props, api: typeof wxApi, ): State { const amount = Amounts.parseOrThrow(amountStr) @@ -30,13 +30,14 @@ export function useComponentState( const [talerUri, setTalerUri] = useState("") const [operationError, setOperationError] = useState(undefined) - if (talerUri) { return { status: "show-qr", talerUri, error: undefined, - close: () => { null }, + cancel: { + onClick: onClose, + }, } } @@ -62,7 +63,11 @@ export function useComponentState( return { status: "ready", invalid: !subject || Amounts.isZero(amount), + cancel: { + onClick: onClose, + }, subject: { + error: !subject ? "cant be empty" : undefined, value: subject, onInput: async (e) => setSubject(e) }, diff --git a/packages/taler-wallet-webextension/src/cta/TransferCreate/stories.tsx b/packages/taler-wallet-webextension/src/cta/TransferCreate/stories.tsx index 1e528df73..be44ac8c5 100644 --- a/packages/taler-wallet-webextension/src/cta/TransferCreate/stories.tsx +++ b/packages/taler-wallet-webextension/src/cta/TransferCreate/stories.tsx @@ -29,9 +29,7 @@ export default { export const ShowQr = createExample(ShowQrView, { talerUri: "taler://pay-push/exchange.taler.ar/HS585JK0QCXHJ8Z8QWZA3EBAY5WY7XNC1RR2MHJXSH2Z4WP0YPJ0", - close: () => { - null; - }, + cancel: {}, }); export const Ready = createExample(ReadyView, { @@ -40,6 +38,7 @@ export const Ready = createExample(ReadyView, { value: 1, fraction: 0, }, + cancel: {}, toBeReceived: { currency: "ARS", value: 1, diff --git a/packages/taler-wallet-webextension/src/cta/TransferCreate/views.tsx b/packages/taler-wallet-webextension/src/cta/TransferCreate/views.tsx index ebdf1e746..a585cbaef 100644 --- a/packages/taler-wallet-webextension/src/cta/TransferCreate/views.tsx +++ b/packages/taler-wallet-webextension/src/cta/TransferCreate/views.tsx @@ -15,6 +15,7 @@ */ import { h, VNode } from "preact"; +import { ErrorTalerOperation } from "../../components/ErrorTalerOperation.js"; import { LoadingError } from "../../components/LoadingError.js"; import { LogoHeader } from "../../components/LogoHeader.js"; import { Part } from "../../components/Part.js"; @@ -38,7 +39,7 @@ export function LoadingUriView({ error }: State.LoadingUriError): VNode { ); } -export function ShowQrView({ talerUri, close }: State.ShowQr): VNode { +export function ShowQrView({ talerUri, cancel }: State.ShowQr): VNode { const { i18n } = useTranslationContext(); return ( @@ -51,7 +52,7 @@ export function ShowQrView({ talerUri, close }: State.ShowQr): VNode {
- + Close
@@ -64,7 +65,9 @@ export function ReadyView({ toBeReceived, chosenAmount, showQr, + operationError, copyToClipboard, + cancel, invalid, }: State.Ready): VNode { const { i18n } = useTranslationContext(); @@ -74,6 +77,16 @@ export function ReadyView({ Digital cash transfer + {operationError && ( + + Could not finish the transfer creation + + } + error={operationError} + /> + )}
+
+
+ + Cancel + +
+
); } diff --git a/packages/taler-wallet-webextension/src/cta/TransferPickup/index.ts b/packages/taler-wallet-webextension/src/cta/TransferPickup/index.ts index 603200747..08428851e 100644 --- a/packages/taler-wallet-webextension/src/cta/TransferPickup/index.ts +++ b/packages/taler-wallet-webextension/src/cta/TransferPickup/index.ts @@ -14,7 +14,7 @@ GNU Taler; see the file COPYING. If not, see */ -import { AmountJson, TalerErrorDetail } from "@gnu-taler/taler-util"; +import { AbsoluteTime, AmountJson, TalerErrorDetail } from "@gnu-taler/taler-util"; import { Loading } from "../../components/Loading.js"; import { HookError } from "../../hooks/useAsyncAsHook.js"; import { ButtonHandler } from "../../mui/handlers.js"; @@ -25,6 +25,7 @@ import { LoadingUriView, ReadyView } from "./views.js"; export interface Props { talerPayPushUri: string; + onClose: () => Promise; } export type State = @@ -46,10 +47,13 @@ export namespace State { export interface BaseInfo { error: undefined; + cancel: ButtonHandler; } export interface Ready extends BaseInfo { status: "ready"; amount: AmountJson, + summary: string | undefined; + expiration: AbsoluteTime | undefined; error: undefined; accept: ButtonHandler; operationError?: TalerErrorDetail; diff --git a/packages/taler-wallet-webextension/src/cta/TransferPickup/state.ts b/packages/taler-wallet-webextension/src/cta/TransferPickup/state.ts index a16389709..ce4c7236d 100644 --- a/packages/taler-wallet-webextension/src/cta/TransferPickup/state.ts +++ b/packages/taler-wallet-webextension/src/cta/TransferPickup/state.ts @@ -14,7 +14,7 @@ GNU Taler; see the file COPYING. If not, see */ -import { Amounts, TalerErrorDetail } from "@gnu-taler/taler-util"; +import { AbsoluteTime, Amounts, TalerErrorDetail, TalerProtocolTimestamp } from "@gnu-taler/taler-util"; import { TalerError } from "@gnu-taler/taler-wallet-core"; import { useState } from "preact/hooks"; import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js"; @@ -22,7 +22,7 @@ import * as wxApi from "../../wxApi.js"; import { Props, State } from "./index.js"; export function useComponentState( - { talerPayPushUri }: Props, + { talerPayPushUri, onClose }: Props, api: typeof wxApi, ): State { const hook = useAsyncAsHook(async () => { @@ -45,13 +45,18 @@ export function useComponentState( }; } - const { amount, peerPushPaymentIncomingId } = hook.response + const { amount: purseAmount, contractTerms, peerPushPaymentIncomingId } = hook.response + + const amount: string = contractTerms?.amount + const summary: string | undefined = contractTerms?.summary + const expiration: TalerProtocolTimestamp | undefined = contractTerms?.purse_expiration async function accept(): Promise { try { const resp = await api.acceptPeerPushPayment({ peerPushPaymentIncomingId }) + await onClose() } catch (e) { if (e instanceof TalerError) { setOperationError(e.errorDetail) @@ -67,6 +72,11 @@ export function useComponentState( accept: { onClick: accept }, + summary, + expiration: expiration ? AbsoluteTime.fromTimestamp(expiration) : undefined, + cancel: { + onClick: onClose + }, operationError } } diff --git a/packages/taler-wallet-webextension/src/cta/TransferPickup/stories.tsx b/packages/taler-wallet-webextension/src/cta/TransferPickup/stories.tsx index 7a3ccb60d..425d7de36 100644 --- a/packages/taler-wallet-webextension/src/cta/TransferPickup/stories.tsx +++ b/packages/taler-wallet-webextension/src/cta/TransferPickup/stories.tsx @@ -33,4 +33,5 @@ export const Ready = createExample(ReadyView, { fraction: 0, }, accept: {}, + cancel: {}, }); diff --git a/packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx b/packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx index 22ef8c776..c43b0ff52 100644 --- a/packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx +++ b/packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx @@ -20,7 +20,8 @@ import { ErrorTalerOperation } from "../../components/ErrorTalerOperation.js"; import { LoadingError } from "../../components/LoadingError.js"; import { LogoHeader } from "../../components/LogoHeader.js"; import { Part } from "../../components/Part.js"; -import { SubTitle, WalletAction } from "../../components/styled/index.js"; +import { Link, SubTitle, WalletAction } from "../../components/styled/index.js"; +import { Time } from "../../components/Time.js"; import { useTranslationContext } from "../../context/translation.js"; import { Button } from "../../mui/Button.js"; import { State } from "./index.js"; @@ -38,7 +39,10 @@ export function LoadingUriView({ error }: State.LoadingUriError): VNode { export function ReadyView({ accept, + summary, + expiration, amount, + cancel, operationError, }: State.Ready): VNode { const { i18n } = useTranslationContext(); @@ -59,16 +63,32 @@ export function ReadyView({ /> )}
+ Subject} + text={
{summary}
} + /> Amount} text={} /> + Valid until} + text={
+
+ + Cancel + +
); } -- cgit v1.2.3