1 files changed, 16 insertions, 5 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}