From 0ab1c97127b5d82975584d1321cb2ea84bf83793 Mon Sep 17 00:00:00 2001
From: Fabian Gerke <124085586+FabianGerke@users.noreply.github.com>
Date: Wed, 6 Nov 2024 13:58:14 +0100
Subject: [PATCH] chore: close quick checkout after finishing paypal payment
 (#784)

---
 apps/web/components/PayPal/PayPalExpressButton.vue  | 3 +++
 apps/web/components/QuickCheckout/QuickCheckout.vue | 6 +++---
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/apps/web/components/PayPal/PayPalExpressButton.vue b/apps/web/components/PayPal/PayPalExpressButton.vue
index b36c1be37..76c574b0e 100644
--- a/apps/web/components/PayPal/PayPalExpressButton.vue
+++ b/apps/web/components/PayPal/PayPalExpressButton.vue
@@ -22,6 +22,7 @@ const localePath = useLocalePath();
 
 const emits = defineEmits<{
   (event: 'validation-callback', callback: PayPalAddToCartCallback): Promise<void>;
+  (event: 'on-approved'): void;
 }>();
 
 const props = defineProps<PaypalButtonPropsType>();
@@ -68,6 +69,8 @@ const onValidationCallback = async () => {
 const onApprove = async (data: OnApproveData) => {
   const result = await approveOrder(data.orderID, data.payerID ?? '');
 
+  emits('on-approved');
+
   if ((props.type === TypeCartPreview || props.type === TypeSingleItem) && result?.url)
     navigateTo(localePath(paths.readonlyCheckout + `/?payerId=${data.payerID}&orderId=${data.orderID}`));
 
diff --git a/apps/web/components/QuickCheckout/QuickCheckout.vue b/apps/web/components/QuickCheckout/QuickCheckout.vue
index e14a62b9f..d6c039fca 100644
--- a/apps/web/components/QuickCheckout/QuickCheckout.vue
+++ b/apps/web/components/QuickCheckout/QuickCheckout.vue
@@ -76,7 +76,7 @@
           class="w-full mb-3"
           variant="secondary"
         >
-          {{ $t('quickCheckout.checkYourCart') }}
+          {{ t('quickCheckout.checkYourCart') }}
         </UiButton>
 
         <UiButton
@@ -85,10 +85,10 @@
           size="lg"
           class="w-full mb-4 md:mb-0"
         >
-          {{ $t('goToCheckout') }}
+          {{ t('goToCheckout') }}
         </UiButton>
         <OrDivider class="my-4" v-if="isPayPalReady" />
-        <PayPalExpressButton class="w-full text-center" type="CartPreview" />
+        <PayPalExpressButton class="w-full text-center" type="CartPreview" @on-approved="isOpen = false" />
         <PayPalPayLaterBanner placement="payment" :amount="totals.total" />
       </div>
     </div>