Merged in magento-v2.1 (pull request #472)

Magento v2.1

1 files changed, 23 insertions, 2 deletions

diff --git a/src-migrate/modules/product-detail/components/AddToCart.tsx b/src-migrate/modules/product-detail/components/AddToCart.tsx
index 0dc39c1c..18f90012 100644
--- a/src-migrate/modules/product-detail/components/AddToCart.tsx
+++ b/src-migrate/modules/product-detail/components/AddToCart.tsx
@@ -1,6 +1,6 @@
 import BottomPopup from '@/core/components/elements/Popup/BottomPopup';
 import style from '../styles/price-action.module.css';
-import { Button, color, Link, useToast } from '@chakra-ui/react';
+import { Button, ButtonProps, Link, useToast } from '@chakra-ui/react';
 import product from 'next-seo/lib/jsonld/product';
 import { useRouter } from 'next/router';
 import { useEffect, useState } from 'react';
@@ -26,6 +26,9 @@ type Props = {
   quantity?: number;
   source?: 'buy' | 'add_to_cart';
   products: IProductDetail;
+
+  buttonProps?: ButtonProps;
+  children?: (props: { onClick: () => Promise<void>; isLoading: boolean }) => React.ReactNode;
 };
 
 type Status = 'idle' | 'loading' | 'success';
@@ -35,6 +38,9 @@ const AddToCart = ({
   quantity = 1,
   source = 'add_to_cart',
   products,
+
+  buttonProps,
+  children,
 }: Props) => {
   let auth = getAuth();
   const router = useRouter();
@@ -140,7 +146,10 @@ const AddToCart = ({
     });
     setStatus('idle');
     setRefreshCart(true);
-    setAddCartAlert(true);
+    
+    if (!children) {
+        setAddCartAlert(true);
+    }
 
     gtagAddToCart(activeVariant, quantity);
 
@@ -164,6 +173,14 @@ const AddToCart = ({
       }, 3000);
   }, [status]);
 
+  if (children) {
+    return (
+      <div className='w-full'>
+        {children({ onClick: handleButton, isLoading: status === 'loading' })}
+      </div>
+    );
+  }
+
   const btnConfig = {
     add_to_cart: {
       colorScheme: 'red',
@@ -186,6 +203,8 @@ const AddToCart = ({
           variant={btnConfig[source].variant}
           className='w-full'
           isDisabled={!hasPrice || status === 'loading'}
+
+          {...buttonProps}
         >
           {btnConfig[source].text}
         </Button>
@@ -198,6 +217,8 @@ const AddToCart = ({
           variant={btnConfig[source].variant}
           className='w-full'
           isDisabled={!hasPrice || status === 'loading'}
+
+          {...buttonProps}
         >
           {btnConfig[source].text}
         </Button>