src/lib/home/components/CategoryHome.jsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

import ProductSlider from "@/lib/product/components/ProductSlider"
import useCategoryHome from "../hooks/useCategoryHome"
import PopularProductSkeleton from "./Skeleton/PopularProductSkeleton"

const CategoryHome = ({ id }) => {
  const { categoryHome } = useCategoryHome({ id })
  
  return (
    <div className="p-4 relative bg-yellow_r-2">
      { categoryHome.data ? (
        <ProductSlider 
          products={{
            products: categoryHome.data?.[0].products,
            banner: {
              image: categoryHome.data?.[0].image,
              name: categoryHome.data?.[0].name,
              url: `/shop/search?category=${categoryHome.data?.[0].name}`
            }
          }} 
          simpleTitle
          bannerMode
        />
      ) : <PopularProductSkeleton /> }
    </div>
  )
}

export default CategoryHome