From 6aa5fa70cf5ccd2825e5657ec1a90e370dea3bcf Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Mon, 16 Oct 2023 11:16:33 +0700 Subject: Fix buy action before and after login --- src/lib/auth/components/IsAuth.jsx | 2 +- src/lib/auth/hooks/useLogin.js | 2 +- src/lib/cart/components/Cartheader.jsx | 325 +++++++++++---------- src/lib/checkout/components/Checkout.jsx | 4 - .../product/components/Product/ProductDesktop.jsx | 44 +-- .../product/components/Product/ProductMobile.jsx | 18 ++ 6 files changed, 216 insertions(+), 179 deletions(-) (limited to 'src/lib') diff --git a/src/lib/auth/components/IsAuth.jsx b/src/lib/auth/components/IsAuth.jsx index a32e648c..1948ae0c 100644 --- a/src/lib/auth/components/IsAuth.jsx +++ b/src/lib/auth/components/IsAuth.jsx @@ -8,7 +8,7 @@ const IsAuth = ({ children }) => { useEffect(() => { if (!getAuth() && router.pathname != '/login') { - router.replace(`/login?next=${router.asPath}`) + router.replace(`/login?next=${encodeURIComponent(router.asPath)}`) } else { setResponse(children) } diff --git a/src/lib/auth/hooks/useLogin.js b/src/lib/auth/hooks/useLogin.js index 34605614..17731a86 100644 --- a/src/lib/auth/hooks/useLogin.js +++ b/src/lib/auth/hooks/useLogin.js @@ -71,7 +71,7 @@ const useLogin = () => { if (data.isAuth) { session.odooUser = data.user setCookie('auth', JSON.stringify(session?.odooUser)) - router.push(router?.query?.next ?? '/') + router.push(decodeURIComponent(router?.query?.next) ?? '/') return } } diff --git a/src/lib/cart/components/Cartheader.jsx b/src/lib/cart/components/Cartheader.jsx index aa6980ac..580dfc8c 100644 --- a/src/lib/cart/components/Cartheader.jsx +++ b/src/lib/cart/components/Cartheader.jsx @@ -8,6 +8,7 @@ import { useRouter } from 'next/router' import odooApi from '@/core/api/odooApi' import { useProductCartContext } from '@/contexts/ProductCartContext' import whatsappUrl from '@/core/utils/whatsappUrl' +import { AnimatePresence, motion } from 'framer-motion' const { ShoppingCartIcon, PhotoIcon } = require('@heroicons/react/24/outline') const { default: Link } = require('next/link') @@ -113,164 +114,182 @@ const Cardheader = (cartCount) => { -
-
-
-
-
Keranjang Belanja
- - Lihat Semua - -
-
-
- {!auth && ( -
-

- Silahkan{' '} - - Login - {' '} - Untuk Melihat Daftar Keranjang Belanja Anda -

-
- )} - {isLoading && - itemLoading.map((item) => ( -
-
-
- + + + {isHovered && ( + <> + + + + +
+
Keranjang Belanja
+ + Lihat Semua + +
+
+
+ {!auth && ( +
+

+ Silahkan{' '} + + Login + {' '} + Untuk Melihat Daftar Keranjang Belanja Anda +

-
-
-
-
+ )} + {isLoading && + itemLoading.map((item) => ( +
+
+
+ +
+
+
+
+
+
+
+
+ ))} + {auth && products.length === 0 && !isLoading && ( +
+

+ Tidak Ada Produk di Keranjang Belanja Anda +

-
-
- ))} - {auth && products.length === 0 && !isLoading && ( -
-

- Tidak Ada Produk di Keranjang Belanja Anda -

-
- )} - {auth && products.length > 0 && !isLoading && ( - <> -
    - {products && - products?.map((product, index) => ( - <> -
  • -
    -
    - - {product?.name} - -
    -
    - - {' '} -

    - {product.parent.name} -

    - - - {product?.hasFlashsale && ( -
    -
    - {product?.price?.discountPercentage}% + )} + {auth && products.length > 0 && !isLoading && ( + <> +
      + {products && + products?.map((product, index) => ( + <> +
    • +
      +
      + + {product?.name} +
      -
      - {currencyFormat(product?.price?.price)} +
      + + {' '} +

      + {product.parent.name} +

      + + + {product?.hasFlashsale && ( +
      +
      + {product?.price?.discountPercentage}% +
      +
      + {currencyFormat(product?.price?.price)} +
      +
      + )} +
      +
      + {product?.price?.priceDiscount > 0 ? ( + currencyFormat(product?.price?.priceDiscount) + ) : ( + + + Call For Price + + + )} +
      +
      - )} -
      -
      - {product?.price?.priceDiscount > 0 ? ( - currencyFormat(product?.price?.priceDiscount) - ) : ( - - - Call For Price - - - )} -
      -
      -
      -
    -
    • - - ))} -
-
- - )} -
- {auth && products.length > 0 && !isLoading && ( - <> -
- Subtotal Sebelum PPN : - {currencyFormat(subTotal)} -
-
- -
- - )} -
-
+ + + ))} + +
+ + )} +
+ {auth && products.length > 0 && !isLoading && ( + <> +
+ Subtotal Sebelum PPN : + {currencyFormat(subTotal)} +
+
+ +
+ + )} + + + + )} +
) } diff --git a/src/lib/checkout/components/Checkout.jsx b/src/lib/checkout/components/Checkout.jsx index 35236e79..511fcdba 100644 --- a/src/lib/checkout/components/Checkout.jsx +++ b/src/lib/checkout/components/Checkout.jsx @@ -5,7 +5,6 @@ import useAuth from '@/core/hooks/useAuth' import { getItemAddress } from '@/core/utils/address' import addressesApi from '@/lib/address/api/addressesApi' import { - ArrowLongLeftIcon, BanknotesIcon, ChevronLeftIcon, ClockIcon, @@ -17,17 +16,14 @@ import { deleteItemCart, getCartApi } from '@/core/utils/cart' import currencyFormat from '@/core/utils/currencyFormat' import { toast } from 'react-hot-toast' import getFileBase64 from '@/core/utils/getFileBase64' -// import checkoutApi from '../api/checkoutApi' import { useRouter } from 'next/router' import VariantGroupCard from '@/lib/variant/components/VariantGroupCard' import axios from 'axios' import Image from '@/core/components/elements/Image/Image' -import imageNext from 'next/image' import MobileView from '@/core/components/views/MobileView' import DesktopView from '@/core/components/views/DesktopView' import ExpedisiList from '../api/ExpedisiList' import whatsappUrl from '@/core/utils/whatsappUrl' -import { createSlug } from '@/core/utils/slug' import BottomPopup from '@/core/components/elements/Popup/BottomPopup' import { useQuery } from 'react-query' import { gtagPurchase } from '@/core/utils/googleTag' diff --git a/src/lib/product/components/Product/ProductDesktop.jsx b/src/lib/product/components/Product/ProductDesktop.jsx index 855c9f75..701750b2 100644 --- a/src/lib/product/components/Product/ProductDesktop.jsx +++ b/src/lib/product/components/Product/ProductDesktop.jsx @@ -90,38 +90,38 @@ const ProductDesktop = ({ products, wishlist, toggleWishlist }) => { } const updateCart = (variantId, quantity, source) => { - let dataUpdate + let dataUpdate = { + productId: variantId, + quantity, + selected: true, + source: source === 'buy' ? 'buy' : null + } + if (product.variants.length > 1) { let variantIndex = product.variants.findIndex((varian) => varian.id == variantId) - dataUpdate = { - productId: variantId, - quantity, - programLineId: product.variants[variantIndex].programActive, - selected: true, - source: source === 'buy' ? 'buy' : null - } + dataUpdate['programLineId'] = product.variants[variantIndex].programActive } else { - dataUpdate = { - productId: variantId, - quantity, - programLineId: promotionActiveId, - selected: true, - source: source === 'buy' ? 'buy' : null - } + dataUpdate['programLineId'] = promotionActiveId } + updateItemCart(dataUpdate) } - const handleAddToCart = (variantId) => { - if (!auth) { - router.push(`/login?next=/shop/product/${slug}`) - return - } + const redirectToLogin = (action, variantId, quantity) => { + const nextURL = `/shop/product/${slug}?action=${action}&variantId=${variantId}&qty=${quantity}` + router.push(`/login?next=${encodeURIComponent(nextURL)}`) + return true + } + const handleAddToCart = (variantId) => { const quantity = variantQuantityRefs.current[variantId].value if (!validQuantity(quantity)) return + if (!auth) { + return redirectToLogin('add_to_cart', variantId, quantity) + } + let source = 'cart' updateCart(variantId, quantity, source) setRefreshCart(true) @@ -141,6 +141,10 @@ const ProductDesktop = ({ products, wishlist, toggleWishlist }) => { const quantity = variantQuantityRefs.current[variant].value if (!validQuantity(quantity)) return + if (!auth) { + return redirectToLogin('buy', variant, quantity) + } + let source = 'buy' updateCart(variant, quantity, source) router.push(`/shop/checkout?source=buy`) diff --git a/src/lib/product/components/Product/ProductMobile.jsx b/src/lib/product/components/Product/ProductMobile.jsx index 402490f7..70ac1cbc 100644 --- a/src/lib/product/components/Product/ProductMobile.jsx +++ b/src/lib/product/components/Product/ProductMobile.jsx @@ -20,9 +20,12 @@ import odooApi from '@/core/api/odooApi' import ImageNext from 'next/image' import CountDown2 from '@/core/components/elements/CountDown/CountDown2' import Breadcrumb from './Breadcrumb' +import useAuth from '@/core/hooks/useAuth' const ProductMobile = ({ product, wishlist, toggleWishlist }) => { const router = useRouter() + const auth = useAuth() + const { slug } = router.query const [quantity, setQuantity] = useState('1') const [selectedVariant, setSelectedVariant] = useState(null) @@ -128,9 +131,20 @@ const ProductMobile = ({ product, wishlist, toggleWishlist }) => { return isValid } + const redirectToLogin = (action) => { + const nextURL = `/shop/product/${slug}?action=${action}&variantId=${activeVariant.id}&qty=${quantity}` + router.push(`/login?next=${encodeURIComponent(nextURL)}`) + return true + } + const handleClickCart = () => { if (!validAction()) return gtagAddToCart(activeVariant, quantity) + + if (!auth) { + return redirectToLogin('add_to_cart') + } + updateItemCart({ productId: activeVariant.id, quantity, @@ -143,6 +157,10 @@ const ProductMobile = ({ product, wishlist, toggleWishlist }) => { const handleClickBuy = () => { if (!validAction()) return + if (!auth) { + return redirectToLogin('buy') + } + updateItemCart({ productId: activeVariant.id, quantity, -- cgit v1.2.3