summaryrefslogtreecommitdiff
path: root/src/lib/home/components/PromotionProgram.jsx
diff options
context:
space:
mode:
authorit-fixcomart <it@fixcomart.co.id>2024-12-24 08:51:37 +0700
committerit-fixcomart <it@fixcomart.co.id>2024-12-24 08:51:37 +0700
commit22bf497d3fd524a95982e090f2c8a1be6bde656b (patch)
tree1c394154c78ea81e06b302eeffcb9dfb14497144 /src/lib/home/components/PromotionProgram.jsx
parentb2afb5c847c9983b098a3223fbcfdb666e65c8cb (diff)
parentd76f96c44f85e7e0efbd544e6b97bd80920b0039 (diff)
Merge branch 'new-release' into Feature/switch-account
# Conflicts: # src-migrate/modules/register/components/FormBisnis.tsx # src/lib/auth/components/Menu.jsx
Diffstat (limited to 'src/lib/home/components/PromotionProgram.jsx')
-rw-r--r--src/lib/home/components/PromotionProgram.jsx59
1 files changed, 20 insertions, 39 deletions
diff --git a/src/lib/home/components/PromotionProgram.jsx b/src/lib/home/components/PromotionProgram.jsx
index 562fa138..d8bf3edb 100644
--- a/src/lib/home/components/PromotionProgram.jsx
+++ b/src/lib/home/components/PromotionProgram.jsx
@@ -4,56 +4,35 @@ import { bannerApi } from '@/api/bannerApi';
import useDevice from '@/core/hooks/useDevice';
import { Swiper, SwiperSlide } from 'swiper/react';
import BannerPromoSkeleton from '../components/Skeleton/BannerPromoSkeleton';
+
import { useEffect, useState } from 'react';
const { useQuery } = require('react-query');
const BannerSection = () => {
const { isMobile, isDesktop } = useDevice();
const [data, setData] = useState(null);
const [shouldFetch, setShouldFetch] = useState(false);
+ const [ isLoading, setIsLoading] = useState(true);
useEffect(() => {
const fetchData = async () => {
- const res = await fetch(`/api/hero-banner?type=banner-promotion`);
- const { data } = await res.json();
- if (data) {
- setData(data);
+ try {
+ const res = await fetch(`/api/hero-banner?type=banner-promotion`);
+ const { data } = await res.json();
+ if (data) {
+ setData(data);
+ }
+ } catch (e) {
+ console.log(e);
+ } finally {
+ setIsLoading(false);
}
};
fetchData();
}, []);
- // useEffect(() => {
- // const localData = localStorage.getItem('Homepage_promotionProgram');
- // if (localData) {
- // setData(JSON.parse(localData));
- // } else {
- // setShouldFetch(true);
- // }
- // }, []);
-
- // const getPromotionProgram = useQuery(
- // 'promotionProgram',
- // bannerApi({ type: 'banner-promotion' }),
- // {
- // enabled: shouldFetch,
- // onSuccess: (data) => {
- // if (data) {
- // localStorage.setItem(
- // 'Homepage_promotionProgram',
- // JSON.stringify(data)
- // );
- // setData(data);
- // }
- // },
- // }
- // );
-
const promotionProgram = data;
- // if (getPromotionProgram?.isLoading && !data) {
- // return <BannerPromoSkeleton />;
- // }
- if (!data) {
+ if (isLoading) {
return <BannerPromoSkeleton />;
}
@@ -90,7 +69,8 @@ const BannerSection = () => {
quality={85}
src={banner.image}
alt={banner.name}
- className='h-auto w-full rounded hover:scale-105 transition duration-500 ease-in-out'
+ className='rounded hover:scale-105 transition duration-500 ease-in-out'
+ loading='eager'
/>
</Link>
))}
@@ -103,12 +83,13 @@ const BannerSection = () => {
<SwiperSlide key={banner.id}>
<Link key={banner.id} href={banner.url}>
<Image
- width={439}
- height={150}
- quality={85}
+ width={350}
+ height={100}
+ quality={70}
src={banner.image}
alt={banner.name}
- className='h-auto w-full rounded '
+ className='rounded '
+ loading='eager'
/>
</Link>
</SwiperSlide>