1 files changed, 21 insertions, 11 deletions

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>
                 &nbsp;
-                <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"
           />
         )}