From cf8e60d65bdd1d0df5211e5ca3c57216c985fca7 Mon Sep 17 00:00:00 2001
From: Alex Lykesas <alexookah@me.com>
Date: Wed, 31 Jul 2024 17:55:50 +0300
Subject: [PATCH] Reuse errorMessage for validateStripePayment after redirect

---
 woonuxt_base/app/composables/useCheckout.ts | 13 ++++++++++---
 woonuxt_base/app/pages/checkout.vue         |  3 +--
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/woonuxt_base/app/composables/useCheckout.ts b/woonuxt_base/app/composables/useCheckout.ts
index cb2933a9..2b48e3a2 100644
--- a/woonuxt_base/app/composables/useCheckout.ts
+++ b/woonuxt_base/app/composables/useCheckout.ts
@@ -6,6 +6,7 @@ import { CheckoutInlineError } from '../types/CheckoutInlineError';
 export function useCheckout() {
   const { t } = useI18n();
   const { storeSettings } = useAppConfig();
+  const errorMessage = useState<string | null>('errorMessage', () => null);
   const orderInput = useState<any>('orderInput', () => {
     return {
       customerNote: '',
@@ -222,7 +223,7 @@ export function useCheckout() {
 
   const validateStripePaymentFromRedirect = async (stripe: Stripe, clientSecret: string, redirectStatus: string) => {
     try {
-      if (redirectStatus !== 'succeeded') throw new Error('Redirect status not suceeded');
+      if (redirectStatus !== 'succeeded') throw new CheckoutInlineError(t('messages.error.paymentFailed'));
 
       isProcessingOrder.value = true;
       const { paymentIntent, error } = await stripe.retrievePaymentIntent(clientSecret);
@@ -240,7 +241,7 @@ export function useCheckout() {
         case "requires_payment_method":
           // If the payment attempt fails (for example due to a decline), 
           // the PaymentIntent’s status returns to requires_payment_method so that the payment can be retried.
-          throw new Error(t('messages.error.paymentFailed'));
+          throw new CheckoutInlineError(t('messages.error.paymentFailed'));
         default:
           throw new Error("Something went wrong. ('" + paymentIntent?.status + "')");
       }
@@ -250,7 +251,12 @@ export function useCheckout() {
 
       useRouter().push({ query: {} });
       manageCheckoutLocalStorage(false);
-      alert(error?.message || t('messages.error.orderFailed'));
+      
+      if (error instanceof CheckoutInlineError) {
+        errorMessage.value = error.message;
+      } else {
+        alert(error);
+      }
     }
   };
 
@@ -274,6 +280,7 @@ export function useCheckout() {
   return {
     orderInput,
     isProcessingOrder,
+    errorMessage,
     stripeCheckout,
     validateStripePaymentFromRedirect,
     proccessCheckout,
diff --git a/woonuxt_base/app/pages/checkout.vue b/woonuxt_base/app/pages/checkout.vue
index ad0ac19c..9ed35229 100644
--- a/woonuxt_base/app/pages/checkout.vue
+++ b/woonuxt_base/app/pages/checkout.vue
@@ -7,7 +7,7 @@ const { t } = useI18n();
 const { query } = useRoute();
 const { cart, isUpdatingCart, paymentGateways } = useCart();
 const { customer, viewer } = useAuth();
-const { orderInput, isProcessingOrder, proccessCheckout, stripeCheckout, validateStripePaymentFromRedirect } = useCheckout();
+const { orderInput, isProcessingOrder, proccessCheckout, stripeCheckout, errorMessage, validateStripePaymentFromRedirect } = useCheckout();
 const runtimeConfig = useRuntimeConfig();
 
 const isCheckoutDisabled = computed<boolean>(
@@ -19,7 +19,6 @@ const isCheckoutDisabled = computed<boolean>(
 );
 
 const isInvalidEmail = ref<boolean>(false);
-const errorMessage = useState<string | null>('errorMessage', () => null);
 
 const stripe = ref<Stripe | null>(null);
 const elements = ref<StripeElements | null>(null);