diff options
Diffstat (limited to 'packages/taler-wallet-webextension/src/cta')
3 files changed, 52 insertions, 23 deletions
diff --git a/packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx b/packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx index 547d5ac9a..0d8035136 100644 --- a/packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx +++ b/packages/taler-wallet-webextension/src/cta/InvoicePay/views.tsx @@ -24,12 +24,21 @@ import { InvoicePaymentDetails, } from "../../wallet/Transaction.js"; import { State } from "./index.js"; +import { AbsoluteTime, Duration } from "@gnu-taler/taler-util"; export function ReadyView( state: State.Ready | State.NoBalanceForCurrency | State.NoEnoughBalance, ): VNode { const { i18n } = useTranslationContext(); const { summary, effective, raw, expiration, uri, status, payStatus } = state; + + const inFiveMinutes = AbsoluteTime.addDuration( + AbsoluteTime.now(), + Duration.fromSpec({ minutes: 5 }), + ); + const willExpireSoon = + expiration && AbsoluteTime.cmp(expiration, inFiveMinutes) === -1; + return ( <Fragment> <section style={{ textAlign: "left" }}> @@ -42,11 +51,13 @@ export function ReadyView( /> } /> - <Part - title={i18n.str`Valid until`} - text={<Time timestamp={expiration} format="dd MMMM yyyy, HH:mm" />} - kind="neutral" - /> + {willExpireSoon && ( + <Part + title={i18n.str`Expires at`} + text={<Time timestamp={expiration} format="HH:mm" />} + kind="neutral" + /> + )} </section> <PaymentButtons amount={effective} diff --git a/packages/taler-wallet-webextension/src/cta/Payment/views.tsx b/packages/taler-wallet-webextension/src/cta/Payment/views.tsx index 68d161ab2..b1eee85ec 100644 --- a/packages/taler-wallet-webextension/src/cta/Payment/views.tsx +++ b/packages/taler-wallet-webextension/src/cta/Payment/views.tsx @@ -18,6 +18,7 @@ import { AbsoluteTime, Amounts, MerchantContractTerms as ContractTerms, + Duration, PreparePayResultType, TranslatedString, } from "@gnu-taler/taler-util"; @@ -54,6 +55,17 @@ export function BaseView(state: SupportedStates): VNode { : Amounts.zeroOfCurrency(state.amount.currency) : state.amount; + const expiration = !contractTerms.pay_deadline + ? undefined + : AbsoluteTime.fromProtocolTimestamp(contractTerms.pay_deadline); + const inFiveMinutes = AbsoluteTime.addDuration( + AbsoluteTime.now(), + Duration.fromSpec({ minutes: 5 }), + ); + const willExpireSoon = + !expiration || expiration.t_ms === "never" + ? undefined + : AbsoluteTime.cmp(expiration, inFiveMinutes) === -1; return ( <Fragment> <ShowImportantMessage state={state} /> @@ -65,7 +77,12 @@ export function BaseView(state: SupportedStates): VNode { <Fragment> <i18n.Translate>Purchase</i18n.Translate> - <AgeSign size={20} title={i18n.str`This purchase is age restricted.`}>{contractTerms.minimum_age}+</AgeSign> + <AgeSign + size={20} + title={i18n.str`This purchase is age restricted.`} + > + {contractTerms.minimum_age}+ + </AgeSign> </Fragment> ) : ( <i18n.Translate>Purchase</i18n.Translate> @@ -79,17 +96,10 @@ export function BaseView(state: SupportedStates): VNode { text={<MerchantDetails merchant={contractTerms.merchant} />} kind="neutral" /> - {contractTerms.pay_deadline && ( + {willExpireSoon && ( <Part - title={i18n.str`Valid until`} - text={ - <Time - timestamp={AbsoluteTime.fromProtocolTimestamp( - contractTerms.pay_deadline, - )} - format="dd MMMM yyyy, HH:mm" - /> - } + title={i18n.str`Expires at`} + text={<Time timestamp={expiration} format="HH:mm" />} kind="neutral" /> )} diff --git a/packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx b/packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx index caa1b485a..e82c4fbd2 100644 --- a/packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx +++ b/packages/taler-wallet-webextension/src/cta/TransferPickup/views.tsx @@ -26,6 +26,7 @@ import { } from "../../wallet/Transaction.js"; import { State } from "./index.js"; import { TermsOfService } from "../../components/TermsOfService/index.js"; +import { AbsoluteTime, Duration } from "@gnu-taler/taler-util"; export function ReadyView({ accept, @@ -36,6 +37,12 @@ export function ReadyView({ raw, }: State.Ready): VNode { const { i18n } = useTranslationContext(); + const inFiveMinutes = AbsoluteTime.addDuration( + AbsoluteTime.now(), + Duration.fromSpec({ minutes: 5 }), + ); + const willExpireSoon = + expiration && AbsoluteTime.cmp(expiration, inFiveMinutes) === -1; return ( <Fragment> <section style={{ textAlign: "left" }}> @@ -49,15 +56,16 @@ export function ReadyView({ /> } /> - - <Part - title={i18n.str`Valid until`} - text={<Time timestamp={expiration} format="dd MMMM yyyy, HH:mm" />} - kind="neutral" - /> + {willExpireSoon && ( + <Part + title={i18n.str`Expires at`} + text={<Time timestamp={expiration} format="HH:mm" />} + kind="neutral" + /> + )} </section> <section> - <TermsOfService key="terms" exchangeUrl={exchangeBaseUrl} > + <TermsOfService key="terms" exchangeUrl={exchangeBaseUrl}> <Button variant="contained" color="success" onClick={accept.onClick}> <i18n.Translate> Receive {<Amount value={effective} />} |