summaryrefslogtreecommitdiff
path: root/src-migrate/modules/product-detail/components/SimilarBottom.tsx
blob: 40d4dd825a46237f97adb9758a73930aac9d3a3b (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
import { Skeleton } from '@chakra-ui/react'
import useProductSimilar from '~/modules/product-similar/hooks/useProductSimilar'
import ProductSlider from '~/modules/product-slider'
import { IProductDetail } from '~/types/product'

type Props = {
  product: IProductDetail
}

const SimilarBottom = ({ product }: Props) => {
  const productSimilar = useProductSimilar({
    name: product.name,
    except: { productId: product.id }
  })

  const products = productSimilar.data?.products || []

  return (
    <Skeleton
      isLoaded={!productSimilar.isLoading}
      rounded='lg'
      className='h-[350px]'
    >
      <ProductSlider products={products} productLayout='vertical' />
    </Skeleton>
  );
}

export default SimilarBottom