From f86b2adc680a9c6fa0ac92c84bf6d14e2f866d9a Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Fri, 2 Aug 2024 14:48:51 +0700 Subject: update popup cart --- src-migrate/modules/promo/components/PromoList.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'src-migrate/modules/promo/components') diff --git a/src-migrate/modules/promo/components/PromoList.tsx b/src-migrate/modules/promo/components/PromoList.tsx index 42725034..4d0db3c2 100644 --- a/src-migrate/modules/promo/components/PromoList.tsx +++ b/src-migrate/modules/promo/components/PromoList.tsx @@ -114,7 +114,7 @@ const PromoList: React.FC = ({ selectedPromo }) => { {promoData?.map((promotion: IPromotion) => (
- +
))} @@ -122,7 +122,7 @@ const PromoList: React.FC = ({ selectedPromo }) => { )} {isMobile && (promoData?.map((promotion: IPromotion) => (
- +
)))} -- cgit v1.2.3 From 89345a3d1d7201272bff1b4e4a8ffb4fcf5b3e9e Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Thu, 22 Aug 2024 10:15:35 +0700 Subject: add ? to data fetch --- src-migrate/modules/promo/components/Hero.tsx | 10 +++++----- .../modules/promo/components/HeroDiskon.tsx | 22 +++++++++++----------- src-migrate/modules/promo/components/PromoList.tsx | 4 ++-- src-migrate/modules/promo/components/Voucher.tsx | 16 ++++++++-------- 4 files changed, 26 insertions(+), 26 deletions(-) (limited to 'src-migrate/modules/promo/components') diff --git a/src-migrate/modules/promo/components/Hero.tsx b/src-migrate/modules/promo/components/Hero.tsx index c5f0afad..97cbe0b7 100644 --- a/src-migrate/modules/promo/components/Hero.tsx +++ b/src-migrate/modules/promo/components/Hero.tsx @@ -60,12 +60,12 @@ const Hero = () => {
- {banners.map((banner, index) => ( + {banners?.map((banner, index) => (
-
{banner.headlineBanner? banner.headlineBanner : "Pasti Hemat & Untung Selama Belanja di Indoteknik.com!"}
+
{banner?.headlineBanner? banner?.headlineBanner : "Pasti Hemat & Untung Selama Belanja di Indoteknik.com!"}
-
{banner.descriptionBanner? banner.descriptionBanner : "Cari paket yang kami sediakan dengan penawaran harga & Nikmati kemudahan dalam setiap transaksi dengan fitur lengkap Pembayaran hingga barang sampai!"}
+
{banner?.descriptionBanner? banner?.descriptionBanner : "Cari paket yang kami sediakan dengan penawaran harga & Nikmati kemudahan dalam setiap transaksi dengan fitur lengkap Pembayaran hingga barang sampai!"}
{ width={439} height={150} quality={100} - src={banner.image} - alt={banner.name} + src={banner?.image} + alt={banner?.name} className='w-full h-full object-cover object-center rounded-2xl' /> diff --git a/src-migrate/modules/promo/components/HeroDiskon.tsx b/src-migrate/modules/promo/components/HeroDiskon.tsx index 6d38c763..8b8edcc0 100644 --- a/src-migrate/modules/promo/components/HeroDiskon.tsx +++ b/src-migrate/modules/promo/components/HeroDiskon.tsx @@ -39,7 +39,7 @@ const Hero = () => { queryFn: () => getBanner({ type: 'banner-promotion' }) }) - const banners = useMemo(() => bannerQuery.data || [], [bannerQuery.data]); + const banners = useMemo(() => bannerQuery?.data || [], [bannerQuery?.data]); useEffect(() => { if (banners.length > 1) { @@ -56,8 +56,8 @@ const Hero = () => { {banners.map((banner, index) => ( {banner.name} { {banners.map((banner, index) => ( {banner.name} { {banners.map((banner, index) => ( {banner.name} { {banners.map((banner, index) => ( {banner.name} { {banners.map((banner, index) => ( {banner.name} = ({ selectedPromo }) => { const items = await fetchPromoItemsSolr(`type_value_s:${slug}`, 0, 10); setPromoItems(items); - const promoDataPromises = items.map(async (item) => { + const promoDataPromises = items?.map(async (item) => { try { const response = await fetchPromoItemsSolr(`id:${item.id}`, 0, 10); return response; @@ -69,7 +69,7 @@ const PromoList: React.FC = ({ selectedPromo }) => { }); const promoDataArray = await Promise.all(promoDataPromises); - const mergedPromoData = promoDataArray.reduce((accumulator, currentValue) => accumulator.concat(currentValue), []); + const mergedPromoData = promoDataArray?.reduce((accumulator, currentValue) => accumulator.concat(currentValue), []); setPromoData(mergedPromoData); } catch (error) { diff --git a/src-migrate/modules/promo/components/Voucher.tsx b/src-migrate/modules/promo/components/Voucher.tsx index e5877e51..510fe746 100644 --- a/src-migrate/modules/promo/components/Voucher.tsx +++ b/src-migrate/modules/promo/components/Voucher.tsx @@ -56,7 +56,7 @@ const VoucherComponent = () => { spaceBetween: 2, }; - const dataVouchers = useMemo(() => voucherQuery.data || [], [voucherQuery.data]); + const dataVouchers = useMemo(() => voucherQuery?.data || [], [voucherQuery?.data]); const vouchers = auth?.id? listVouchers : dataVouchers; @@ -121,30 +121,30 @@ const VoucherComponent = () => {
- {voucherQuery.isLoading && ( + {voucherQuery?.isLoading && (
{Array.from({ length: 3 }).map((_, index) => (
))}
)} - {!voucherQuery.isLoading && ( + {!voucherQuery?.isLoading && (
{vouchers?.map((voucher) => (
- {voucher.name} + {voucher?.name}
-
{voucher.name}
-
{voucher.description}
+
{voucher?.name}
+
{voucher?.description}
Kode Promo
-
{voucher.code}
+
{voucher?.code}
- +
-- cgit v1.2.3 From 36601aba6017aeef16f89351eb487238402ab52e Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Tue, 24 Sep 2024 16:12:50 +0700 Subject: update Perapihan Tag --- src-migrate/modules/promo/components/Hero.tsx | 103 +++++----- .../modules/promo/components/PromotinProgram.jsx | 223 +++++++++++++-------- src-migrate/modules/promo/components/Voucher.tsx | 65 ++++-- 3 files changed, 241 insertions(+), 150 deletions(-) (limited to 'src-migrate/modules/promo/components') diff --git a/src-migrate/modules/promo/components/Hero.tsx b/src-migrate/modules/promo/components/Hero.tsx index 97cbe0b7..7d0aad11 100644 --- a/src-migrate/modules/promo/components/Hero.tsx +++ b/src-migrate/modules/promo/components/Hero.tsx @@ -3,34 +3,34 @@ import 'swiper/css'; import Image from 'next/image'; import { useEffect, useMemo } from 'react'; import { useQuery } from 'react-query'; -import { Swiper, SwiperProps, SwiperSlide } from 'swiper/react'; +import { Swiper, SwiperProps, SwiperSlide } from 'swiper/react'; import style from '../styles/hero.module.css'; import 'swiper/css/navigation'; import 'swiper/css/pagination'; -import { Navigation, Pagination, Autoplay } from 'swiper'; +import { Navigation, Pagination, Autoplay } from 'swiper'; import MobileView from '../../../../src/core/components/views/MobileView'; import DesktopView from '@/core/components/views/DesktopView'; -import {bannerApi} from '../../../../src/api/bannerApi' +import { bannerApi } from '../../../../src/api/bannerApi'; interface IPromotionProgram { headlineBanner: string; descriptionBanner: string; - image: string ; + image: string; name: string; } const swiperBanner: SwiperProps = { - modules:[Navigation, Pagination, Autoplay], + modules: [Navigation, Pagination, Autoplay], autoplay: { delay: 6000, - disableOnInteraction: false + disableOnInteraction: false, }, loop: true, className: 'h-[400px] w-full', slidesPerView: 1, spaceBetween: 10, - pagination:true, -} + pagination: true, +}; const swiperBannerMob = { autoplay: { delay: 6000, @@ -43,7 +43,10 @@ const swiperBannerMob = { }; const Hero = () => { - const heroBanner = useQuery('allPromo', bannerApi({ type: 'banner-semua-promo' })); + const heroBanner = useQuery( + 'allPromo', + bannerApi({ type: 'banner-semua-promo' }) + ); const banners: IPromotionProgram[] = useMemo( () => heroBanner?.data || [], @@ -54,52 +57,60 @@ const Hero = () => { ...swiperBannerMob, pagination: { dynamicBullets: false, clickable: true }, }; - + return ( <>
- - {banners?.map((banner, index) => ( - -
-
{banner?.headlineBanner? banner?.headlineBanner : "Pasti Hemat & Untung Selama Belanja di Indoteknik.com!"}
-
-
{banner?.descriptionBanner? banner?.descriptionBanner : "Cari paket yang kami sediakan dengan penawaran harga & Nikmati kemudahan dalam setiap transaksi dengan fitur lengkap Pembayaran hingga barang sampai!"}
+ + {banners?.map((banner, index) => ( + +
+
+ {banner?.headlineBanner + ? banner?.headlineBanner + : 'Pasti Hemat & Untung Selama Belanja di Indoteknik.com!'}
-
- {banner.name} +
+
+ {banner?.descriptionBanner + ? banner?.descriptionBanner + : 'Cari paket yang kami sediakan dengan penawaran harga & Nikmati kemudahan dalam setiap transaksi dengan fitur lengkap Pembayaran hingga barang sampai!'}
- - ))} - -
- - - - {banners?.map((banner, index) => ( - - {banner?.name} +
+
+ {banner.name} +
))} - +
+ + + + {banners?.map((banner, index) => ( + + {banner?.name} + + ))} + - ) -} + ); +}; -export default Hero \ No newline at end of file +export default Hero; diff --git a/src-migrate/modules/promo/components/PromotinProgram.jsx b/src-migrate/modules/promo/components/PromotinProgram.jsx index 33839944..43e4eedf 100644 --- a/src-migrate/modules/promo/components/PromotinProgram.jsx +++ b/src-migrate/modules/promo/components/PromotinProgram.jsx @@ -1,9 +1,7 @@ import React from 'react'; import Image from 'next/image'; -import { InfoIcon } from "lucide-react"; -import MobileView from '../../../../src/core/components/views/MobileView'; -import DesktopView from '@/core/components/views/DesktopView'; -import { Swiper, SwiperProps, SwiperSlide } from 'swiper/react'; +import { InfoIcon } from 'lucide-react'; +import { Swiper, SwiperProps, SwiperSlide } from 'swiper/react'; import 'swiper/css'; import useDevice from '@/core/hooks/useDevice'; @@ -11,9 +9,12 @@ const PromotionProgram = ({ selectedPromo, onSelectPromo }) => { const { isMobile } = useDevice(); return ( <> -
Serba Serbi Promo
+

+ {' '} + Serba Serbi Promo +

- {/*
+ {/*
onSelectPromo('Diskon')} className={`border p-2 flex items-center gap-x-2 rounded-lg cursor-pointer ${selectedPromo === 'Diskon' ? 'bg-red-50 border-red-500 text-red-500' : 'border-gray-200 text-gray-900'}`} @@ -39,93 +40,147 @@ const PromotionProgram = ({ selectedPromo, onSelectPromo }) => {
*/} - - - -
-
onSelectPromo('Bundling')} - className={`border h-full p-1 flex items-center gap-x-2 rounded-lg cursor-pointer ${selectedPromo === 'Bundling' ? 'bg-red-50 border-red-500 text-red-500' : 'border-gray-200 text-gray-900'}`} - > -
- -
-
-
-

Paket Silat

- -
-

- Pilihan bundling barang kombinasi Silat. -

+ + + +
+
onSelectPromo('Bundling')} + className={`border h-full p-1 flex items-center gap-x-2 rounded-lg cursor-pointer ${ + selectedPromo === 'Bundling' + ? 'bg-red-50 border-red-500 text-red-500' + : 'border-gray-200 text-gray-900' + }`} + > +
+ +
+
+
+

+ Paket Silat +

+
+

+ Pilihan bundling barang kombinasi Silat. +

- - -
-
onSelectPromo('Loading')} - className={`border p-2 h-full flex items-center gap-x-2 rounded-lg cursor-pointer ${selectedPromo === 'Loading' ? 'bg-red-50 border-red-500 text-red-500' : 'border-gray-200 text-gray-900'}`} - > -
- -
-
-
-

Paket Barong

- -
-

- Beli banyak barang/partai barang borong. -

+
+ + +
+
onSelectPromo('Loading')} + className={`border p-2 h-full flex items-center gap-x-2 rounded-lg cursor-pointer ${ + selectedPromo === 'Loading' + ? 'bg-red-50 border-red-500 text-red-500' + : 'border-gray-200 text-gray-900' + }`} + > +
+ +
+
+
+

+ Paket Barong +

+
+

+ Beli banyak barang/partai barang borong. +

- - -
-
onSelectPromo('Merchandise')} - className={`border p-2 h-full flex items-center gap-x-2 rounded-lg cursor-pointer ${selectedPromo === 'Merchandise' ? 'bg-red-50 border-red-500 text-red-500' : 'border-gray-200 text-gray-900'}`} - > -
- -
-
-
-

Paket Angklung

- -
-

- Gratis barang promosi/merchandise menang langsung. -

+
+ + +
+
onSelectPromo('Merchandise')} + className={`border p-2 h-full flex items-center gap-x-2 rounded-lg cursor-pointer ${ + selectedPromo === 'Merchandise' + ? 'bg-red-50 border-red-500 text-red-500' + : 'border-gray-200 text-gray-900' + }`} + > +
+ +
+
+
+

+ Paket Angklung +

+
+

+ Gratis barang promosi/merchandise menang langsung. +

- - +
+ +
); diff --git a/src-migrate/modules/promo/components/Voucher.tsx b/src-migrate/modules/promo/components/Voucher.tsx index 510fe746..034d13e9 100644 --- a/src-migrate/modules/promo/components/Voucher.tsx +++ b/src-migrate/modules/promo/components/Voucher.tsx @@ -55,15 +55,18 @@ const VoucherComponent = () => { slidesPerView: isMobile ? 1.2 : 3.2, spaceBetween: 2, }; - - const dataVouchers = useMemo(() => voucherQuery?.data || [], [voucherQuery?.data]); - const vouchers = auth?.id? listVouchers : dataVouchers; + const dataVouchers = useMemo( + () => voucherQuery?.data || [], + [voucherQuery?.data] + ); + const vouchers = auth?.id ? listVouchers : dataVouchers; const copyText = (text: string) => { if (navigator.clipboard && navigator.clipboard.writeText) { - navigator.clipboard.writeText(text) + navigator.clipboard + .writeText(text) .then(() => { toast({ title: 'Salin ke papan klip', @@ -72,7 +75,7 @@ const VoucherComponent = () => { duration: 3000, isClosable: true, position: 'top', - }) + }); }) .catch(() => { fallbackCopyTextToClipboard(text); @@ -80,10 +83,10 @@ const VoucherComponent = () => { } else { fallbackCopyTextToClipboard(text); } - } + }; const fallbackCopyTextToClipboard = (text: string) => { - const textArea = document.createElement("textarea"); + const textArea = document.createElement('textarea'); textArea.value = text; // Tambahkan style untuk menyembunyikan textArea secara visual textArea.style.position = 'fixed'; @@ -108,23 +111,26 @@ const VoucherComponent = () => { duration: 3000, isClosable: true, position: 'top', - }) + }); } catch (err) { console.error('Fallback: Oops, unable to copy', err); } document.body.removeChild(textArea); - } + }; return ( <> -
Pakai Voucher Belanja
+

Pakai Voucher Belanja

{voucherQuery?.isLoading && (
{Array.from({ length: 3 }).map((_, index) => ( -
+
))}
)} @@ -134,17 +140,36 @@ const VoucherComponent = () => { {vouchers?.map((voucher) => (
- {voucher?.name} + {voucher?.name}
-
{voucher?.name}
-
{voucher?.description}
+
+ {voucher?.name} +
+
+ {voucher?.description} +
-
Kode Promo
-
{voucher?.code}
+
+ Kode Promo +
+
+ {voucher?.code} +
- +
@@ -154,7 +179,7 @@ const VoucherComponent = () => {
)} - ) -} + ); +}; -export default VoucherComponent +export default VoucherComponent; -- cgit v1.2.3