diff --git a/components/invoice.js b/components/invoice.js
index 4cfbef35..9da9657c 100644
--- a/components/invoice.js
+++ b/components/invoice.js
@@ -257,7 +257,7 @@ export const useInvoiceable = (onSubmit, options = defaultOptions) => {
     })
 
     const retry = () => onSubmit(
-      { hash: inv.hash, hmac: inv.hmac, ...formValues },
+      { hash: inv.hash, hmac: inv.hmac, expiresAt: inv.expiresAt, ...formValues },
       // unset update function since we already ran an cache update if we paid using WebLN
       // also unset update function if null was explicitly passed in
       { ...submitArgs, variables, update: webLn ? null : undefined })
diff --git a/components/item-act.js b/components/item-act.js
index d8bdd909..ef30f068 100644
--- a/components/item-act.js
+++ b/components/item-act.js
@@ -361,7 +361,8 @@ export function useZap () {
           undoUpdate?.()
         },
         hideSuccess: true,
-        hideError: true
+        hideError: true,
+        timeout: TOAST_DEFAULT_DELAY_MS
       }
     }
   )
diff --git a/components/toast.js b/components/toast.js
index 234e6a75..d43be0f8 100644
--- a/components/toast.js
+++ b/components/toast.js
@@ -163,6 +163,7 @@ export const ToastProvider = ({ children }) => {
           // if we don't do this, the animation for rerendered toasts skips ahead and toast delay and animation get out of sync.
           const elapsed = (+new Date() - toast.createdAt)
           const animationDelay = unhidden ? `-${elapsed}ms` : undefined
+          const animationDuration = `${toast.delay}ms`
           return (
             <Toast
               key={toast.id} bg={toast.variant} show autohide={toast.autohide}
@@ -180,7 +181,7 @@ export const ToastProvider = ({ children }) => {
                   </Button>
                 </div>
               </ToastBody>
-              {toast.onUndo && toast.delay > 0 && <div className={`${styles.progressBar} ${styles[toast.variant]}`} style={{ animationDelay }} />}
+              {toast.progressBar && <div className={`${styles.progressBar} ${styles[toast.variant]}`} style={{ animationDuration, animationDelay }} />}
             </Toast>
           )
         })}
@@ -206,6 +207,7 @@ export const withToastFlow = (toaster) => flowFn => {
       hideError,
       hideSuccess,
       skipToastFlow,
+      timeout,
       ...toastProps
     } = flowFn(...args)
     let canceled
@@ -216,7 +218,8 @@ export const withToastFlow = (toaster) => flowFn => {
     const endFlow = () => toaster.warning('', { ...toastProps, delay: 0, autohide: true, flowId })
 
     toaster.warning(pendingMessage || `${t} pending`, {
-      autohide: false,
+      progressBar: !!timeout,
+      delay: timeout || TOAST_DEFAULT_DELAY_MS,
       onCancel: onCancel
         ? async () => {
           try {
diff --git a/components/toast.module.css b/components/toast.module.css
index d1ad302f..6811bc8b 100644
--- a/components/toast.module.css
+++ b/components/toast.module.css
@@ -50,8 +50,10 @@
   width: 0;
   height: 5px;
   filter: brightness(66%);
-  /* same duration as toast delay */
-  animation: progressBar 5s linear;
+  animation-name: progressBar;
+  animation-iteration-count: 1;
+  animation-timing-function: linear;
+  /* animation-duration set via JS */
 }
 
 .progressBar.success {
diff --git a/components/webln/index.js b/components/webln/index.js
index 91af2ddf..2e16aff8 100644
--- a/components/webln/index.js
+++ b/components/webln/index.js
@@ -82,13 +82,15 @@ function RawWebLNProvider ({ children }) {
   `)
 
   const sendPaymentWithToast = withToastFlow(toaster)(
-    ({ bolt11, hash, hmac, flowId }) => {
+    ({ bolt11, hash, hmac, expiresAt, flowId }) => {
+      const expiresIn = (+new Date(expiresAt)) - (+new Date())
       return {
         flowId: flowId || hash,
         type: 'payment',
         onPending: () => provider.sendPayment(bolt11),
         // hash and hmac are only passed for JIT invoices
-        onCancel: () => hash && hmac ? cancelInvoice({ variables: { hash, hmac } }) : undefined
+        onCancel: () => hash && hmac ? cancelInvoice({ variables: { hash, hmac } }) : undefined,
+        timeout: expiresIn
       }
     }
   )