1 files changed, 15 insertions, 11 deletions
diff --git a/src/pages/index.jsx b/src/pages/index.jsx
index 2a996b5d..5ca7b939 100644
--- a/src/pages/index.jsx
+++ b/src/pages/index.jsx
@@ -3,33 +3,29 @@ import ImageSkeleton from '@/core/components/elements/Skeleton/ImageSkeleton'
 import PopularProductSkeleton from '@/lib/home/components/Skeleton/PopularProductSkeleton'
 import MobileView from '@/core/components/views/MobileView'
 import DesktopView from '@/core/components/views/DesktopView'
-import { useEffect, useRef, useState } from 'react'
-import { NextSeo } from 'next-seo'
+import { useRef } from 'react'
 import Seo from '@/core/components/Seo'
 import { useQuery } from 'react-query'
 import odooApi from '@/core/api/odooApi'
-import Image from '@/core/components/elements/Image/Image'
+import Image from 'next/image'
 
 const BasicLayout = dynamic(() => import('@/core/components/layouts/BasicLayout'))
-
+const FlashSale = dynamic(() => import('@/lib/flashSale/components/FlashSale'))
 const HeroBanner = dynamic(() => import('@/lib/home/components/HeroBanner'), {
   loading: () => <ImageSkeleton />
 })
-
 const PreferredBrand = dynamic(() => import('@/lib/home/components/PreferredBrand'), {
   loading: () => <PopularProductSkeleton />
 })
-
 const PopularProduct = dynamic(() => import('@/lib/home/components/PopularProduct'), {
   loading: () => <PopularProductSkeleton />
 })
-
 const CategoryHomeId = dynamic(() => import('@/lib/home/components/CategoryHomeId'), {
   loading: () => <PopularProductSkeleton />
 })
 
 export default function Home() {
-  const fetchSecondHeroBanner = async () => await odooApi('GET', '/api/v1/banner?type=index-b-2')
+  const fetchSecondHeroBanner = async () => await odooApi('GET', '/api/v1/banner?type=index-a-2')
   const secondHeroBanner = useQuery('secondHeroBanner', fetchSecondHeroBanner)
 
   const bannerRef = useRef(null)
@@ -57,12 +53,18 @@ export default function Home() {
       <DesktopView>
         <div className='container mx-auto'>
           <div className='flex h-[360px]' ref={wrapperRef} onLoad={handleOnLoad}>
-            <div className='w-3/12'>
+            <div className='w-2/12'>
               {secondHeroBanner.isFetched && (
-                <Image src={secondHeroBanner.data[0].image} alt={secondHeroBanner.data[0].name} />
+                <Image
+                  src={secondHeroBanner.data[0].image}
+                  width={512}
+                  height={1024}
+                  alt={secondHeroBanner.data[0].name}
+                  className='object-cover object-center h-full'
+                />
               )}
             </div>
-            <div className='w-6/12 px-1' ref={bannerRef}>
+            <div className='w-7/12 px-1' ref={bannerRef}>
               <HeroBanner />
             </div>
             <div className='w-3/12'>
@@ -72,6 +74,7 @@ export default function Home() {
 
           <div className='my-16 flex flex-col gap-y-10'>
             <PreferredBrand />
+            <FlashSale />
             <CategoryHomeId />
           </div>
         </div>
@@ -81,6 +84,7 @@ export default function Home() {
         <HeroBanner />
         <div className='flex flex-col gap-y-6 my-6'>
           <PreferredBrand />
+          <FlashSale />
           <PopularProduct />
           <CategoryHomeId />
         </div>