blob: d70a314d786d56361218a7fc52bb74e35ff669f9 (
plain)
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
29
30
31
32
33
34
35
36
|
import { Skeleton } from '@chakra-ui/react'
import ProductCard from '~/modules/product-card'
import useProductSimilar from '~/modules/product-similar/hooks/useProductSimilar'
import { IProductDetail } from '~/types/product'
type Props = {
product: IProductDetail
}
const SimilarSide = ({ product }: Props) => {
const productSimilar = useProductSimilar({
name: product.name,
except: { productId: product.id, manufactureId: product.manufacture.id },
})
const products = productSimilar.data?.products || []
return (
<Skeleton
isLoaded={!productSimilar.isLoading}
className="h-[500px] overflow-auto grid grid-cols-1 gap-y-4 divide-y divide-gray-300 border border-gray-300 rounded-lg"
rounded='lg'
>
{products.map((product) => (
<ProductCard
key={product.id}
product={product}
layout='horizontal'
/>
))}
</Skeleton>
)
}
export default SimilarSide
|
