diff options
| author | it-fixcomart <it@fixcomart.co.id> | 2024-06-10 16:53:28 +0700 |
|---|---|---|
| committer | it-fixcomart <it@fixcomart.co.id> | 2024-06-10 16:53:28 +0700 |
| commit | 5e5b67e5b98d3183044dc5149fe67a29feeb3c41 (patch) | |
| tree | 11776ab7470ef0a555c6eec93bd79dca1189721e /src/lib/home/components | |
| parent | c88d98f06a6301bad6dd6d2e58b4908d8562638c (diff) | |
<iman> update promotion-program
Diffstat (limited to 'src/lib/home/components')
| -rw-r--r-- | src/lib/home/components/PromotionProgram.jsx | 22 |
1 files changed, 17 insertions, 5 deletions
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 && + <div className='px-4 sm:px-0'> + <div className='flex justify-between items-center mb-4'> + <div className='font-semibold sm:text-h-lg'>Promo Tersedia</div> + {isDesktop && ( + <Link href='/shop/promo' className='!text-red-500 font-semibold'> + Lihat Semua + </Link> + )} + </div> + {promotionProgram.data && promotionProgram.data?.length > 0 && ( - <div className='grid grid-cols-3 sm:grid-cols-3 gap-4 rounded rounded-md'> + <div className='bg-red-300 grid grid-cols-3 sm:grid-cols-3 gap-4 rounded-md'> {promotionProgram.data?.map((banner) => ( <Link key={banner.id} href={banner.url}> <Image @@ -24,7 +33,10 @@ const BannerSection = () => { </Link> ))} </div> - ) + + )} + </div> + ) } |
