From 6c203a44769938c55d1d3337f07b6458a0217b04 Mon Sep 17 00:00:00 2001
From: ekzyis <27162016+ekzyis@users.noreply.github.com>
Date: Thu, 31 Aug 2023 17:15:52 +0200
Subject: [PATCH] Use callback to clear local storage on success (#462)

Co-authored-by: ekzyis <ek@stacker.news>
Co-authored-by: Keyan <34140557+huumn@users.noreply.github.com>
---
 components/form.js    | 30 +++++++++++++++++-------------
 components/invoice.js |  6 +++++-
 2 files changed, 22 insertions(+), 14 deletions(-)

diff --git a/components/form.js b/components/form.js
index 46f219a7..9b5fd655 100644
--- a/components/form.js
+++ b/components/form.js
@@ -484,6 +484,21 @@ export function Form ({
     }
   }, [])
 
+  function clearLocalStorage (values) {
+    Object.keys(values).forEach(v => {
+      window.localStorage.removeItem(storageKeyPrefix + '-' + v)
+      if (Array.isArray(values[v])) {
+        values[v].forEach(
+          (iv, i) => {
+            Object.keys(iv).forEach(k => {
+              window.localStorage.removeItem(`${storageKeyPrefix}-${v}[${i}].${k}`)
+            })
+            window.localStorage.removeItem(`${storageKeyPrefix}-${v}[${i}]`)
+          })
+      }
+    })
+  }
+
   // if `invoiceable` is set,
   // support for payment per invoice if they are lurking or don't have enough balance
   // is added to submit handlers.
@@ -491,7 +506,7 @@ export function Form ({
   // and use them as variables in their GraphQL mutation
   if (invoiceable && onSubmit) {
     const options = typeof invoiceable === 'object' ? invoiceable : undefined
-    onSubmit = useInvoiceable(onSubmit, options)
+    onSubmit = useInvoiceable(onSubmit, { callback: clearLocalStorage, ...options })
   }
 
   return (
@@ -506,18 +521,7 @@ export function Form ({
           if (onSubmit) {
             const options = await onSubmit(values, ...args)
             if (!storageKeyPrefix || options?.keepLocalStorage) return
-            Object.keys(values).forEach(v => {
-              window.localStorage.removeItem(storageKeyPrefix + '-' + v)
-              if (Array.isArray(values[v])) {
-                values[v].forEach(
-                  (iv, i) => {
-                    Object.keys(iv).forEach(k => {
-                      window.localStorage.removeItem(`${storageKeyPrefix}-${v}[${i}].${k}`)
-                    })
-                    window.localStorage.removeItem(`${storageKeyPrefix}-${v}[${i}]`)
-                  })
-              }
-            })
+            clearLocalStorage(values)
           }
         } catch (err) {
           console.log(err)
diff --git a/components/invoice.js b/components/invoice.js
index 5a2ef159..fadcc8fa 100644
--- a/components/invoice.js
+++ b/components/invoice.js
@@ -131,6 +131,7 @@ const MutationInvoice = ({ id, hash, hmac, errorCount, repeat, onClose, expiresA
 const defaultOptions = {
   forceInvoice: false,
   requireSession: false,
+  callback: null // (formValues) => void
   replaceModal: false
 }
 export const useInvoiceable = (onSubmit, options = defaultOptions) => {
@@ -156,7 +157,10 @@ export const useInvoiceable = (onSubmit, options = defaultOptions) => {
         const repeat = () =>
           // call onSubmit handler and pass invoice data
           onSubmit({ satsReceived, hash, hmac, ...formValues }, ...submitArgs)
-            .then(onClose)
+            .then(() => {
+              onClose()
+              options?.callback?.(formValues)
+            })
             .catch((error) => {
               // if error happened after payment, show repeat and cancel options
               // by passing `errorCount` and `repeat`