From c88d98f06a6301bad6dd6d2e58b4908d8562638c Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Fri, 7 Jun 2024 17:08:09 +0700 Subject: add promotion program --- src/lib/home/components/PromotionProgram.jsx | 31 ++++++++++++++++++++++++++++ 1 file changed, 31 insertions(+) create mode 100644 src/lib/home/components/PromotionProgram.jsx (limited to 'src/lib/home') diff --git a/src/lib/home/components/PromotionProgram.jsx b/src/lib/home/components/PromotionProgram.jsx new file mode 100644 index 00000000..461383a1 --- /dev/null +++ b/src/lib/home/components/PromotionProgram.jsx @@ -0,0 +1,31 @@ +import Link from '@/core/components/elements/Link/Link' +import Image from 'next/image' +import { bannerApi } from '@/api/bannerApi'; + +const { useQuery } = require('react-query') + +const BannerSection = () => { + const promotionProgram = useQuery('promotionProgram', bannerApi({ type: 'banner-promotion' })); + + return ( + promotionProgram.data && + promotionProgram.data?.length > 0 && ( +
+ {promotionProgram.data?.map((banner) => ( + + {banner.name} + + ))} +
+ ) + ) +} + +export default BannerSection -- cgit v1.2.3 From 5e5b67e5b98d3183044dc5149fe67a29feeb3c41 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Mon, 10 Jun 2024 16:53:28 +0700 Subject: update promotion-program --- src/lib/home/components/PromotionProgram.jsx | 22 +++++++++++++++++----- 1 file changed, 17 insertions(+), 5 deletions(-) (limited to 'src/lib/home') diff --git a/src/lib/home/components/PromotionProgram.jsx b/src/lib/home/components/PromotionProgram.jsx index 461383a1..a3c09a9b 100644 --- a/src/lib/home/components/PromotionProgram.jsx +++ b/src/lib/home/components/PromotionProgram.jsx @@ -1,16 +1,25 @@ import Link from '@/core/components/elements/Link/Link' import Image from 'next/image' import { bannerApi } from '@/api/bannerApi'; - +import useDevice from '@/core/hooks/useDevice' const { useQuery } = require('react-query') - const BannerSection = () => { const promotionProgram = useQuery('promotionProgram', bannerApi({ type: 'banner-promotion' })); + const { isMobile, isDesktop } = useDevice() return ( - promotionProgram.data && +
+
+
Promo Tersedia
+ {isDesktop && ( + + Lihat Semua + + )} +
+ {promotionProgram.data && promotionProgram.data?.length > 0 && ( -
+
{promotionProgram.data?.map((banner) => ( { ))}
- ) + + )} +
+ ) } -- cgit v1.2.3 From 9565ddf794165e297acf511a108f9a9643ee615d Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Tue, 11 Jun 2024 13:40:23 +0700 Subject: update promotion program --- src/lib/home/components/PromotionProgram.jsx | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) (limited to 'src/lib/home') diff --git a/src/lib/home/components/PromotionProgram.jsx b/src/lib/home/components/PromotionProgram.jsx index a3c09a9b..98bc7c7f 100644 --- a/src/lib/home/components/PromotionProgram.jsx +++ b/src/lib/home/components/PromotionProgram.jsx @@ -9,17 +9,19 @@ const BannerSection = () => { return (
-
+
Promo Tersedia
{isDesktop && ( - - Lihat Semua - + + Lihat Semua + )}
{promotionProgram.data && promotionProgram.data?.length > 0 && ( -
+
{promotionProgram.data?.map((banner) => ( { quality={100} src={banner.image} alt={banner.name} - className='h-auto w-full rounded' + className='h-auto w-full rounded hover:scale-105 transition duration-500 ease-in-out' /> ))} -- cgit v1.2.3 From 01bea5fe1b68fee2d673274b44295db6fc665e29 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Mon, 24 Jun 2024 14:36:56 +0700 Subject: ubah button lihat semua --- src/lib/home/components/PromotionProgram.jsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) (limited to 'src/lib/home') diff --git a/src/lib/home/components/PromotionProgram.jsx b/src/lib/home/components/PromotionProgram.jsx index 98bc7c7f..66216d19 100644 --- a/src/lib/home/components/PromotionProgram.jsx +++ b/src/lib/home/components/PromotionProgram.jsx @@ -12,9 +12,7 @@ const BannerSection = () => {
Promo Tersedia
{isDesktop && ( - + Lihat Semua )} -- cgit v1.2.3 From cac51e393df3adfbb2ea971be9a26daf78e6ef90 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Fri, 28 Jun 2024 10:13:16 +0700 Subject: update button lihat semua --- src/lib/home/components/PromotionProgram.jsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) (limited to 'src/lib/home') diff --git a/src/lib/home/components/PromotionProgram.jsx b/src/lib/home/components/PromotionProgram.jsx index 98bc7c7f..66216d19 100644 --- a/src/lib/home/components/PromotionProgram.jsx +++ b/src/lib/home/components/PromotionProgram.jsx @@ -12,9 +12,7 @@ const BannerSection = () => {
Promo Tersedia
{isDesktop && ( - + Lihat Semua )} -- cgit v1.2.3 From b5effbf8b6b4927614ab15fcf1f9b8ba1afcdadf Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Fri, 28 Jun 2024 11:10:30 +0700 Subject: update button lihat semua dan promocrumb --- src/lib/home/components/PromotionProgram.jsx | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) (limited to 'src/lib/home') diff --git a/src/lib/home/components/PromotionProgram.jsx b/src/lib/home/components/PromotionProgram.jsx index 66216d19..66ed6749 100644 --- a/src/lib/home/components/PromotionProgram.jsx +++ b/src/lib/home/components/PromotionProgram.jsx @@ -2,19 +2,21 @@ import Link from '@/core/components/elements/Link/Link' import Image from 'next/image' import { bannerApi } from '@/api/bannerApi'; import useDevice from '@/core/hooks/useDevice' +import { div } from 'lodash-contrib'; const { useQuery } = require('react-query') const BannerSection = () => { const promotionProgram = useQuery('promotionProgram', bannerApi({ type: 'banner-promotion' })); const { isMobile, isDesktop } = useDevice() - + console.log("promotionProgram",promotionProgram) return (
Promo Tersedia
{isDesktop && ( - - Lihat Semua - +
+ // + // Lihat Semua + // )}
{promotionProgram.data && -- cgit v1.2.3 From 1455ce5887a3d03597192118ba84d3c27f165b12 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Fri, 28 Jun 2024 11:17:08 +0700 Subject: delete console log --- src/lib/home/components/PromotionProgram.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src/lib/home') diff --git a/src/lib/home/components/PromotionProgram.jsx b/src/lib/home/components/PromotionProgram.jsx index 66ed6749..c2779fd2 100644 --- a/src/lib/home/components/PromotionProgram.jsx +++ b/src/lib/home/components/PromotionProgram.jsx @@ -7,7 +7,7 @@ const { useQuery } = require('react-query') const BannerSection = () => { const promotionProgram = useQuery('promotionProgram', bannerApi({ type: 'banner-promotion' })); const { isMobile, isDesktop } = useDevice() - console.log("promotionProgram",promotionProgram) + return (
-- cgit v1.2.3 From ca0faeb73b521a40a2e96b2e7b724b839db6aa57 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Fri, 28 Jun 2024 16:47:06 +0700 Subject: update mobile view --- src/lib/home/components/PromotionProgram.jsx | 29 ++++++++++++++++++++++++---- 1 file changed, 25 insertions(+), 4 deletions(-) (limited to 'src/lib/home') diff --git a/src/lib/home/components/PromotionProgram.jsx b/src/lib/home/components/PromotionProgram.jsx index c2779fd2..b204df8e 100644 --- a/src/lib/home/components/PromotionProgram.jsx +++ b/src/lib/home/components/PromotionProgram.jsx @@ -2,12 +2,12 @@ import Link from '@/core/components/elements/Link/Link' import Image from 'next/image' import { bannerApi } from '@/api/bannerApi'; import useDevice from '@/core/hooks/useDevice' -import { div } from 'lodash-contrib'; +import { Swiper, SwiperSlide } from 'swiper/react'; const { useQuery } = require('react-query') const BannerSection = () => { const promotionProgram = useQuery('promotionProgram', bannerApi({ type: 'banner-promotion' })); const { isMobile, isDesktop } = useDevice() - + return (
@@ -19,7 +19,7 @@ const BannerSection = () => { // )}
- {promotionProgram.data && + {isDesktop && (promotionProgram.data && promotionProgram.data?.length > 0 && (
{promotionProgram.data?.map((banner) => ( @@ -36,7 +36,28 @@ const BannerSection = () => { ))}
- )} + ))} + +{isMobile && ( + + + {promotionProgram.data?.map((banner) => ( + + + {banner.name} + + + ))} + + + )}
) -- cgit v1.2.3 From 51fb7cb3adeb99c428e716a17cc524b5dbbe3da7 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Fri, 5 Jul 2024 17:00:48 +0700 Subject: fix bug sequence brands homepage --- src/lib/home/components/PreferredBrand.jsx | 38 ++++++++++++++++++++++++++---- 1 file changed, 33 insertions(+), 5 deletions(-) (limited to 'src/lib/home') diff --git a/src/lib/home/components/PreferredBrand.jsx b/src/lib/home/components/PreferredBrand.jsx index 571c4745..ec09aa4e 100644 --- a/src/lib/home/components/PreferredBrand.jsx +++ b/src/lib/home/components/PreferredBrand.jsx @@ -1,13 +1,41 @@ import { Swiper, SwiperSlide } from 'swiper/react' +import { useCallback, useEffect, useState } from 'react' import usePreferredBrand from '../hooks/usePreferredBrand' import PreferredBrandSkeleton from './Skeleton/PreferredBrandSkeleton' import BrandCard from '@/lib/brand/components/BrandCard' import useDevice from '@/core/hooks/useDevice' import Link from '@/core/components/elements/Link/Link' +import axios from 'axios' const PreferredBrand = () => { let query = 'level_s' let params = 'prioritas' + const [isLoading, setIsLoading] = useState(true) + const [startWith, setStartWith] = useState(null) + const [manufactures, setManufactures] = useState([]) + + const loadBrand = useCallback(async () => { + setIsLoading(true) + const name = startWith ? `${startWith}*` : '' + const result = await axios(`${process.env.NEXT_PUBLIC_SELF_HOST}/api/shop/brands?params=${name}`) + + setIsLoading(false) + setManufactures((manufactures) => [...result.data]) + }, [startWith]) + + const toggleStartWith = (alphabet) => { + setManufactures([]) + if (alphabet == startWith) { + setStartWith(null) + return + } + setStartWith(alphabet) + } + + useEffect(() => { + loadBrand() + }, [loadBrand]) + const { preferredBrands } = usePreferredBrand(query) const { isMobile, isDesktop } = useDevice() @@ -21,12 +49,12 @@ const PreferredBrand = () => { )}
- {preferredBrands.isLoading && } - {!preferredBrands.isLoading && ( + {manufactures.isLoading && } + {!manufactures.isLoading && ( - {preferredBrands.data?.data.map((brand) => ( - - + {manufactures.map((manufacture) => ( + + ))} -- cgit v1.2.3 From 937013e8bf9f176c18a31d94205b9116d2a02224 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Tue, 16 Jul 2024 15:52:08 +0700 Subject: update button lihat semua mobile --- src/lib/home/components/PreferredBrand.jsx | 5 +++++ src/lib/home/components/PromotionProgram.jsx | 5 +++++ 2 files changed, 10 insertions(+) (limited to 'src/lib/home') diff --git a/src/lib/home/components/PreferredBrand.jsx b/src/lib/home/components/PreferredBrand.jsx index 571c4745..ef5e743e 100644 --- a/src/lib/home/components/PreferredBrand.jsx +++ b/src/lib/home/components/PreferredBrand.jsx @@ -20,6 +20,11 @@ const PreferredBrand = () => { Lihat Semua )} + {isMobile && ( + + Lihat Semua + + )}
{preferredBrands.isLoading && } {!preferredBrands.isLoading && ( diff --git a/src/lib/home/components/PromotionProgram.jsx b/src/lib/home/components/PromotionProgram.jsx index 66216d19..fabaf307 100644 --- a/src/lib/home/components/PromotionProgram.jsx +++ b/src/lib/home/components/PromotionProgram.jsx @@ -16,6 +16,11 @@ const BannerSection = () => { Lihat Semua )} + {isMobile && ( + + Lihat Semua + + )}
{promotionProgram.data && promotionProgram.data?.length > 0 && ( -- cgit v1.2.3 From 617f920b5d60e989c08f8afd0e969d0d285b5a36 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Wed, 7 Aug 2024 09:36:36 +0700 Subject: add skeleton to banner promo homepage --- src/lib/home/components/PromotionProgram.jsx | 5 +++++ src/lib/home/components/Skeleton/BannerPromoSkeleton.jsx | 16 ++++++++++++++++ 2 files changed, 21 insertions(+) create mode 100644 src/lib/home/components/Skeleton/BannerPromoSkeleton.jsx (limited to 'src/lib/home') diff --git a/src/lib/home/components/PromotionProgram.jsx b/src/lib/home/components/PromotionProgram.jsx index 99258d94..c2f76069 100644 --- a/src/lib/home/components/PromotionProgram.jsx +++ b/src/lib/home/components/PromotionProgram.jsx @@ -3,11 +3,16 @@ import Image from 'next/image' import { bannerApi } from '@/api/bannerApi'; import useDevice from '@/core/hooks/useDevice' import { Swiper, SwiperSlide } from 'swiper/react'; +import BannerPromoSkeleton from '../components/Skeleton/BannerPromoSkeleton'; const { useQuery } = require('react-query') const BannerSection = () => { const promotionProgram = useQuery('promotionProgram', bannerApi({ type: 'banner-promotion' })); const { isMobile, isDesktop } = useDevice() + if (promotionProgram.isLoading) { + return ; + } + return (
diff --git a/src/lib/home/components/Skeleton/BannerPromoSkeleton.jsx b/src/lib/home/components/Skeleton/BannerPromoSkeleton.jsx new file mode 100644 index 00000000..c5f39f19 --- /dev/null +++ b/src/lib/home/components/Skeleton/BannerPromoSkeleton.jsx @@ -0,0 +1,16 @@ +import useDevice from '@/core/hooks/useDevice' +import Skeleton from 'react-loading-skeleton' + +const BannerPromoSkeleton = () => { + const { isDesktop } = useDevice() + + return ( +
+ {Array.from({ length: isDesktop ? 3 : 1.2 }, (_, index) => ( + + ))} +
+ ) +} + +export default BannerPromoSkeleton -- cgit v1.2.3