Files
shop-front/src/app/page.tsx
T
2025-08-27 15:57:15 +03:30

64 lines
1.7 KiB
TypeScript

import { NextPage } from 'next'
import Layout from '@/hoc/Layout'
import Carousel from './home/components/Carousel'
import HotOffer from './home/components/HotOffer'
import Categories from './home/components/Categories'
import Banners3 from './home/components/Banners3'
import Blogs from './home/components/Blogs'
import NewestProducts from './home/components/LatestProducts'
import Banners4 from './home/components/Banners4'
import PopularProducts from './home/components/PopularProducts'
import { HydrationBoundary, QueryClient, dehydrate } from '@tanstack/react-query'
import { Suspense } from 'react'
import PageLoading from '@/components/PageLoading'
import { getLandingQueryOptions } from './home/hooks/useHomeData'
const HomePage: NextPage = () => {
return (
<div>
<Carousel />
<div className='mt-24 px-20'>
<HotOffer />
<div className='mt-24'>
<Categories />
</div>
<div className='mt-24'>
<Banners3 />
</div>
</div>
<div className='mt-24 bg-[#FAF8F6] p-20'>
<NewestProducts />
<div className='mt-24'>
<Banners4 />
</div>
<div className='mt-20'>
<PopularProducts />
</div>
</div>
<div className='mt-24 px-20'>
<Blogs />
</div>
</div>
)
}
export default async function HomePageWithLayout() {
const queryClient = new QueryClient()
await queryClient.prefetchQuery(getLandingQueryOptions)
const dehydratedState = dehydrate(queryClient)
return (
<Layout>
<Suspense fallback={<PageLoading />}>
<HydrationBoundary state={dehydratedState}>
<HomePage />
</HydrationBoundary>
</Suspense>
</Layout>
)
}