Refactor hero banner and popular product section

1 files changed, 11 insertions, 12 deletions

diff --git a/src/pages/index.jsx b/src/pages/index.jsx
index ea4949b2..43a3b8c9 100644
--- a/src/pages/index.jsx
+++ b/src/pages/index.jsx
@@ -1,29 +1,28 @@
 import dynamic from 'next/dynamic'
-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 { useRef } from 'react'
 import Seo from '@/core/components/Seo'
 import DelayRender from '@/core/components/elements/DelayRender/DelayRender'
-import HeroBannerSecondary from '@/components/ui/HeroBannerSecondary'
 import { HeroBannerSkeleton } from '@/components/skeleton/BannerSkeleton'
+import { PopularProductSkeleton } from '@/components/skeleton/PopularProductSkeleton'
 
 const BasicLayout = dynamic(() => import('@/core/components/layouts/BasicLayout'))
-const FlashSale = dynamic(() => import('@/lib/flashSale/components/FlashSale'))
-const BannerSection = dynamic(() => import('@/lib/home/components/BannerSection'))
 const HeroBanner = dynamic(() => import('@/components/ui/HeroBanner'), {
   loading: () => <HeroBannerSkeleton />
 })
-const PreferredBrand = dynamic(() => import('@/lib/home/components/PreferredBrand'), {
-  loading: () => <PopularProductSkeleton />
-})
-const PopularProduct = dynamic(() => import('@/lib/home/components/PopularProduct'), {
-  loading: () => <PopularProductSkeleton />
+const HeroBannerSecondary = dynamic(() => import('@/components/ui/HeroBannerSecondary'), {
+  loading: () => <HeroBannerSkeleton />
 })
-const CategoryHomeId = dynamic(() => import('@/lib/home/components/CategoryHomeId'), {
+const PopularProduct = dynamic(() => import('@/components/ui/PopularProduct'), {
   loading: () => <PopularProductSkeleton />
 })
+
+const PreferredBrand = dynamic(() => import('@/lib/home/components/PreferredBrand'))
+
+const FlashSale = dynamic(() => import('@/lib/flashSale/components/FlashSale'))
+const BannerSection = dynamic(() => import('@/lib/home/components/BannerSection'))
+const CategoryHomeId = dynamic(() => import('@/lib/home/components/CategoryHomeId'))
 const CustomerReviews = dynamic(() => import('@/lib/review/components/CustomerReviews'))
 
 export default function Home() {
@@ -51,7 +50,7 @@ export default function Home() {
 
       <DesktopView>
         <div className='container mx-auto'>
-          <div className='flex h-[360px]' ref={wrapperRef} onLoad={handleOnLoad}>
+          <div className='flex min-h-[400px] h-[460px]' ref={wrapperRef} onLoad={handleOnLoad}>
             <div className='w-2/12'>
               <HeroBannerSecondary />
             </div>