1 files changed, 54 insertions, 32 deletions
diff --git a/src-migrate/modules/product-promo/components/AddToCart.tsx b/src-migrate/modules/product-promo/components/AddToCart.tsx
index 3bac3c66..87017c14 100644
--- a/src-migrate/modules/product-promo/components/AddToCart.tsx
+++ b/src-migrate/modules/product-promo/components/AddToCart.tsx
@@ -1,11 +1,14 @@
-import React, { useEffect, useState } from 'react'
-import { CheckIcon, PlusIcon } from 'lucide-react'
-import { IPromotion } from '~/types/promotion'
-import { upsertUserCart } from '~/services/cart'
-import { getAuth } from '~/libs/auth'
 import { Button, Spinner, useToast } from '@chakra-ui/react'
-import Link from 'next/link'
+import { CheckIcon, PlusIcon } from 'lucide-react'
 import { useRouter } from 'next/router'
+import { useEffect, useState } from 'react'
+
+import { getAuth } from '~/libs/auth'
+import { upsertUserCart } from '~/services/cart'
+import { IPromotion } from '~/types/promotion'
+
+import DesktopView from '../../../../src/core/components/views/DesktopView';
+import MobileView from '../../../../src/core/components/views/MobileView';
 
 type Props = {
   promotion: IPromotion
@@ -23,23 +26,21 @@ const ProductPromoAddToCart = ({ promotion }: Props) => {
   const handleButton = async () => {
     if (typeof auth !== 'object') {
       const currentUrl = encodeURIComponent(router.asPath)
-      toast({
-        title: 'Masuk Akun',
-        description: <>
-          Masuk akun untuk dapat menambahkan promo ke keranjang belanja. {' '}
-          <Link className='underline' href={`/login?next=${currentUrl}`}>Klik disini</Link>
-        </>,
-        status: 'error',
-        duration: 4000,
-        isClosable: true,
-        position: 'top',
-      })
+      router.push(`/login?next=${currentUrl}`)
       return
     }
     if (status === 'success') return
 
     setStatus('loading')
-    await upsertUserCart(auth.id, 'promotion', promotion.id, 1, true)
+    await upsertUserCart({
+      userId: auth.id,
+      type: 'promotion',
+      id: promotion.id,
+      qty: 1,
+      selected: true,
+      source: 'add_to_cart',
+      qtyAppend: true
+    })
     setStatus('idle')
 
     toast({
@@ -57,21 +58,42 @@ const ProductPromoAddToCart = ({ promotion }: Props) => {
   }, [status])
 
   return (
-    <Button
-      colorScheme='yellow'
-      px={2}
-      w='110px'
-      gap={1}
-      isDisabled={status === 'loading'}
-      onClick={handleButton}
-    >
-      {status === 'success' && <CheckIcon size={16} />}
-      {status === 'loading' && <Spinner size='xs' mr={1.5} />}
-      {status === 'idle' && <PlusIcon size={16} />}
+    <div>
+      <MobileView>
+        <Button
+          colorScheme='yellow'
+          px={2}
+          w='36px'
+          gap={1}
+          isDisabled={status === 'loading'}
+          onClick={handleButton}
+        >
+          {status === 'success' && <CheckIcon size={16} />}
+          {status === 'loading' && <Spinner size='xs' mr={1.5} />}
+          {status === 'idle' && <PlusIcon size={16} />}
+
+          {status === 'success' && <span>Berhasil</span>}
+          {/* {status !== 'success' && <span>Keranjang</span>} */}
+        </Button>
+      </MobileView>
+      <DesktopView>
+        <Button
+          colorScheme='yellow'
+          px={2}
+          w='110px'
+          gap={1}
+          isDisabled={status === 'loading'}
+          onClick={handleButton}
+        >
+          {status === 'success' && <CheckIcon size={16} />}
+          {status === 'loading' && <Spinner size='xs' mr={1.5} />}
+          {status === 'idle' && <PlusIcon size={16} />}
 
-      {status === 'success' && <span>Berhasil</span>}
-      {status !== 'success' && <span>Keranjang</span>}
-    </Button>
+          {status === 'success' && <span>Berhasil</span>}
+          {status !== 'success' && <span>Keranjang</span>}
+        </Button>
+      </DesktopView>
+    </div>
   )
 }