1 files changed, 29 insertions, 0 deletions
diff --git a/src-migrate/modules/product-detail/components/SimilarBottom.tsx b/src-migrate/modules/product-detail/components/SimilarBottom.tsx
new file mode 100644
index 00000000..40d4dd82
--- /dev/null
+++ b/src-migrate/modules/product-detail/components/SimilarBottom.tsx
@@ -0,0 +1,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
+\ No newline at end of file