From 037c06c8c7ee0751105b5aea22819a5c4c41fdd8 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Thu, 29 Feb 2024 16:14:31 +0700 Subject: Add utm source function on product card --- src/lib/product/components/ProductCard.jsx | 134 +++++++++++++++++------------ 1 file changed, 78 insertions(+), 56 deletions(-) (limited to 'src/lib/product/components/ProductCard.jsx') diff --git a/src/lib/product/components/ProductCard.jsx b/src/lib/product/components/ProductCard.jsx index 1cec0804..9908a573 100644 --- a/src/lib/product/components/ProductCard.jsx +++ b/src/lib/product/components/ProductCard.jsx @@ -1,34 +1,46 @@ -import Image from '@/core/components/elements/Image/Image' -import Link from '@/core/components/elements/Link/Link' -import currencyFormat from '@/core/utils/currencyFormat' -import { sellingProductFormat } from '@/core/utils/formatValue' -import { createSlug } from '@/core/utils/slug' -import whatsappUrl from '@/core/utils/whatsappUrl' -import ImageNext from 'next/image' -import { useRouter } from 'next/router' -import { useMemo } from 'react' +import clsx from 'clsx'; +import ImageNext from 'next/image'; +import { useRouter } from 'next/router'; +import { useMemo } from 'react'; + +import Image from '@/core/components/elements/Image/Image'; +import Link from '@/core/components/elements/Link/Link'; +import currencyFormat from '@/core/utils/currencyFormat'; +import { sellingProductFormat } from '@/core/utils/formatValue'; +import { createSlug } from '@/core/utils/slug'; +import whatsappUrl from '@/core/utils/whatsappUrl'; +import useUtmSource from '~/hooks/useUtmSource'; const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { - const router = useRouter() + const router = useRouter(); + const utmSource = useUtmSource(); const callForPriceWhatsapp = whatsappUrl('product', { name: product.name, manufacture: product.manufacture?.name, - url: createSlug('/shop/product/', product.name, product.id, true) - }) + url: createSlug('/shop/product/', product.name, product.id, true), + }); const image = useMemo(() => { - if (product.image) return product.image + '?ratio=square' - return '/images/noimage.jpeg' - }, [product.image]) + if (product.image) return product.image + '?ratio=square'; + return '/images/noimage.jpeg'; + }, [product.image]); + + const URL = { + product: + createSlug('/shop/product/', product?.name, product?.id) + + `?utm_source=${utmSource}`, + manufacture: createSlug( + '/shop/brands/', + product?.manufacture?.name, + product?.manufacture.id + ), + }; if (variant == 'vertical') { return (
- + {product?.name} { height={5} /> - {product?.flashSale?.tag != 'false' || product?.flashSale?.tag + {product?.flashSale?.tag != 'false' || + product?.flashSale?.tag ? product?.flashSale?.tag : 'FLASH SALE'} @@ -75,27 +88,21 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => {
{product?.manufacture?.name ? ( - + {product.manufacture.name} ) : (
-
)} {product?.name} - {product?.flashSale?.id > 0 && product?.lowestPrice.discountPercentage > 0 ? ( + {product?.flashSale?.id > 0 && + product?.lowestPrice.discountPercentage > 0 ? ( <>
@@ -109,7 +116,11 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { {product?.lowestPrice.priceDiscount > 0 ? ( currencyFormat(product?.lowestPrice.priceDiscount) ) : ( - + Call for Inquiry )} @@ -122,11 +133,17 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { {currencyFormat(product?.lowestPrice.price)}
Inc. PPN:{' '} - {currencyFormat(product.lowestPrice.price * process.env.NEXT_PUBLIC_PPN)} + {currencyFormat( + product.lowestPrice.price * process.env.NEXT_PUBLIC_PPN + )}
) : ( - + Call for Inquiry )} @@ -134,7 +151,9 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { )}
- {product?.stockTotal > 0 &&
Ready Stock
} + {product?.stockTotal > 0 && ( +
Ready Stock
+ )} {/*
{product?.stockTotal > 5 ? '> 5' : '< 5'}
*/} {product?.qtySold > 0 && (
@@ -144,17 +163,14 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => {
- ) + ); } if (variant == 'horizontal') { return (
- + {product?.name} {
)} {product?.manufacture?.name ? ( - + {product.manufacture.name} ) : (
-
)} {product?.name} - {product?.flashSale?.id > 0 && product?.lowestPrice?.discountPercentage > 0 ? ( + {product?.flashSale?.id > 0 && + product?.lowestPrice?.discountPercentage > 0 ? ( <> {product?.lowestPrice.discountPercentage > 0 && (
@@ -220,7 +230,11 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { {product?.lowestPrice?.priceDiscount > 0 ? ( currencyFormat(product?.lowestPrice?.priceDiscount) ) : ( - + Call for Inquiry )} @@ -233,11 +247,17 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { {currencyFormat(product?.lowestPrice.price)}
Inc. PPN:{' '} - {currencyFormat(product.lowestPrice.price * process.env.NEXT_PUBLIC_PPN)} + {currencyFormat( + product.lowestPrice.price * process.env.NEXT_PUBLIC_PPN + )}
) : ( - + Call for Inquiry )} @@ -245,7 +265,9 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { )}
- {product?.stockTotal > 0 &&
Ready Stock
} + {product?.stockTotal > 0 && ( +
Ready Stock
+ )} {/*
{product?.stockTotal > 5 ? '> 5' : '< 5'}
*/} {product?.qtySold > 0 && (
@@ -255,8 +277,8 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => {
- ) + ); } -} +}; -export default ProductCard +export default ProductCard; -- cgit v1.2.3 From 87bc6b410b875d6f811e21e1e1d6f974e7cac653 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Tue, 5 Mar 2024 13:22:30 +0700 Subject: Update background flash sale --- src/lib/product/components/ProductCard.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src/lib/product/components/ProductCard.jsx') diff --git a/src/lib/product/components/ProductCard.jsx b/src/lib/product/components/ProductCard.jsx index 9908a573..38ed35f8 100644 --- a/src/lib/product/components/ProductCard.jsx +++ b/src/lib/product/components/ProductCard.jsx @@ -50,7 +50,7 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => {
Date: Wed, 5 Jun 2024 13:02:27 +0700 Subject: add Informasi SNI & TKDN --- src/lib/product/components/ProductCard.jsx | 109 +++++++++++++++++++++++++++-- 1 file changed, 102 insertions(+), 7 deletions(-) (limited to 'src/lib/product/components/ProductCard.jsx') diff --git a/src/lib/product/components/ProductCard.jsx b/src/lib/product/components/ProductCard.jsx index 38ed35f8..8dde4dbe 100644 --- a/src/lib/product/components/ProductCard.jsx +++ b/src/lib/product/components/ProductCard.jsx @@ -1,7 +1,7 @@ import clsx from 'clsx'; import ImageNext from 'next/image'; import { useRouter } from 'next/router'; -import { useMemo } from 'react'; +import { useMemo, useEffect, useState } from 'react'; import Image from '@/core/components/elements/Image/Image'; import Link from '@/core/components/elements/Link/Link'; @@ -15,6 +15,47 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { const router = useRouter(); const utmSource = useUtmSource(); + const [isSni, setIsSni] = useState(false); + const [isTkdn, setTkdn] = useState(false); + + useEffect(() => { + // Lakukan pemanggilan API untuk memeriksa isSni + const fetchSniData = async () => { + try { + const response = await fetch('URL_API_SNI'); + const data = await response.json(); + if (data && data.sni) { + setIsSni(true); + } else { + setIsSni(false); + } + } catch (error) { + console.error('Error fetching SNI data:', error); + setIsSni(false); + } + }; + + // Lakukan pemanggilan API untuk memeriksa isTkdn + const fetchTkdnData = async () => { + try { + const response = await fetch('URL_API_TKDN'); + const data = await response.json(); + if (data && data.tkdn) { + setTkdn(true); + } else { + setTkdn(false); + } + } catch (error) { + console.error('Error fetching TKDN data:', error); + setTkdn(false); + } + }; + fetchSniData(); + fetchTkdnData(); + return () => { + }; + }, []); + const callForPriceWhatsapp = whatsappUrl('product', { name: product.name, manufacture: product.manufacture?.name, @@ -41,11 +82,39 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { return (
+
{product?.name} +
+
+ {!isSni && ( + + )} +
+
+ {!isTkdn && ( + + )} +
+
+
+ + {router.pathname != '/' && product?.flashSale?.id > 0 && (
@@ -171,11 +240,37 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => {
- {product?.name} +
+ {product?.name} +
+
+ {!isSni && ( + + )} +
+
+ {!isTkdn && ( + + )} +
+
+
{product.variantTotal > 1 && (
{product.variantTotal} Varian -- cgit v1.2.3 From 87432c8627896711167813654dce2969ce45e643 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Wed, 5 Jun 2024 13:11:26 +0700 Subject: add Informasi SNI & TKDN --- src/lib/product/components/ProductCard.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'src/lib/product/components/ProductCard.jsx') diff --git a/src/lib/product/components/ProductCard.jsx b/src/lib/product/components/ProductCard.jsx index 8dde4dbe..00edc29d 100644 --- a/src/lib/product/components/ProductCard.jsx +++ b/src/lib/product/components/ProductCard.jsx @@ -90,7 +90,7 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { />
- {!isSni && ( + {isSni && ( { )}
- {!isTkdn && ( + {isTkdn && ( Date: Wed, 5 Jun 2024 15:24:42 +0700 Subject: add feature SNI-TKDR --- src/lib/product/components/ProductCard.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'src/lib/product/components/ProductCard.jsx') diff --git a/src/lib/product/components/ProductCard.jsx b/src/lib/product/components/ProductCard.jsx index 00edc29d..8dde4dbe 100644 --- a/src/lib/product/components/ProductCard.jsx +++ b/src/lib/product/components/ProductCard.jsx @@ -90,7 +90,7 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { />
- {isSni && ( + {!isSni && ( { )}
- {isTkdn && ( + {!isTkdn && ( Date: Wed, 5 Jun 2024 16:50:38 +0700 Subject: add feature SNI-TKDN --- src/lib/product/components/ProductCard.jsx | 103 +++++++++-------------------- 1 file changed, 32 insertions(+), 71 deletions(-) (limited to 'src/lib/product/components/ProductCard.jsx') diff --git a/src/lib/product/components/ProductCard.jsx b/src/lib/product/components/ProductCard.jsx index 8dde4dbe..48a30b51 100644 --- a/src/lib/product/components/ProductCard.jsx +++ b/src/lib/product/components/ProductCard.jsx @@ -1,7 +1,7 @@ import clsx from 'clsx'; import ImageNext from 'next/image'; import { useRouter } from 'next/router'; -import { useMemo, useEffect, useState } from 'react'; +import { useMemo} from 'react'; import Image from '@/core/components/elements/Image/Image'; import Link from '@/core/components/elements/Link/Link'; @@ -15,46 +15,7 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { const router = useRouter(); const utmSource = useUtmSource(); - const [isSni, setIsSni] = useState(false); - const [isTkdn, setTkdn] = useState(false); - - useEffect(() => { - // Lakukan pemanggilan API untuk memeriksa isSni - const fetchSniData = async () => { - try { - const response = await fetch('URL_API_SNI'); - const data = await response.json(); - if (data && data.sni) { - setIsSni(true); - } else { - setIsSni(false); - } - } catch (error) { - console.error('Error fetching SNI data:', error); - setIsSni(false); - } - }; - - // Lakukan pemanggilan API untuk memeriksa isTkdn - const fetchTkdnData = async () => { - try { - const response = await fetch('URL_API_TKDN'); - const data = await response.json(); - if (data && data.tkdn) { - setTkdn(true); - } else { - setTkdn(false); - } - } catch (error) { - console.error('Error fetching TKDN data:', error); - setTkdn(false); - } - }; - fetchSniData(); - fetchTkdnData(); - return () => { - }; - }, []); + const callForPriceWhatsapp = whatsappUrl('product', { name: product.name, @@ -90,7 +51,7 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { />
- {!isSni && ( + {product.isSni && ( { )}
- {!isTkdn && ( + {product.isTkdn && ( {
- {product?.name} -
-
- {!isSni && ( - - )} -
-
- {!isTkdn && ( - - )} + {product?.name} +
+
+ {product.isSni && ( + + )} +
+
+ {product.isTkdn && ( + + )} +
-
{product.variantTotal > 1 && (
-- cgit v1.2.3 From f39f03f4d4e59597ffcc73ddb1b108c233842bf8 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Wed, 5 Jun 2024 17:01:12 +0700 Subject: add feature SNI-TKDN --- src/lib/product/components/ProductCard.jsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) (limited to 'src/lib/product/components/ProductCard.jsx') diff --git a/src/lib/product/components/ProductCard.jsx b/src/lib/product/components/ProductCard.jsx index 48a30b51..357f3fd9 100644 --- a/src/lib/product/components/ProductCard.jsx +++ b/src/lib/product/components/ProductCard.jsx @@ -1,7 +1,7 @@ import clsx from 'clsx'; import ImageNext from 'next/image'; import { useRouter } from 'next/router'; -import { useMemo} from 'react'; +import { useMemo, useEffect, useState } from 'react'; import Image from '@/core/components/elements/Image/Image'; import Link from '@/core/components/elements/Link/Link'; @@ -15,7 +15,6 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { const router = useRouter(); const utmSource = useUtmSource(); - const callForPriceWhatsapp = whatsappUrl('product', { name: product.name, -- cgit v1.2.3 From e7ff25b6c0763149981df738ff50871b851bf4a6 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Thu, 6 Jun 2024 10:07:51 +0700 Subject: add feature SNI-TKDN --- src/lib/product/components/ProductCard.jsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) (limited to 'src/lib/product/components/ProductCard.jsx') diff --git a/src/lib/product/components/ProductCard.jsx b/src/lib/product/components/ProductCard.jsx index 357f3fd9..98732407 100644 --- a/src/lib/product/components/ProductCard.jsx +++ b/src/lib/product/components/ProductCard.jsx @@ -50,7 +50,7 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => { />
- {product.isSni && ( + {product?.isSni && ( { )}
- {product.isTkdn && ( + {product?.isTkdn && ( { />
- {product.isSni && ( + {product?.isSni && ( { )}
- {product.isTkdn && ( + {product?.isTkdn && (