From d324d01bb9413a023a158a7bd15ba36bb7beb9bc Mon Sep 17 00:00:00 2001
From: trisusilo48 <tri.susilo@altama.co.id>
Date: Fri, 29 Nov 2024 14:38:24 +0700
Subject: update performance

---
 src/lib/home/components/PromotionProgram.jsx | 47 ++++++++--------------------
 1 file changed, 13 insertions(+), 34 deletions(-)

(limited to 'src/lib/home/components/PromotionProgram.jsx')

diff --git a/src/lib/home/components/PromotionProgram.jsx b/src/lib/home/components/PromotionProgram.jsx
index 562fa138..fc23bf78 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 />;
   }
 
-- 
cgit v1.2.3


From 1b4d7f65ee08a56ca6cc57bfc6336ca3ccad3a21 Mon Sep 17 00:00:00 2001
From: trisusilo48 <tri.susilo@altama.co.id>
Date: Tue, 3 Dec 2024 14:42:36 +0700
Subject: update performance desktop

---
 src/lib/home/components/PromotionProgram.jsx | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

(limited to 'src/lib/home/components/PromotionProgram.jsx')

diff --git a/src/lib/home/components/PromotionProgram.jsx b/src/lib/home/components/PromotionProgram.jsx
index fc23bf78..d8bf3edb 100644
--- a/src/lib/home/components/PromotionProgram.jsx
+++ b/src/lib/home/components/PromotionProgram.jsx
@@ -69,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>
           ))}
@@ -82,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>
-- 
cgit v1.2.3