import apiOdoo from '@/core/utils/apiOdoo';
import { useEffect, useState } from 'react';
import ProductSlider from './ProductSlider';

export default function ProductSimilar({ productId }) {
  const [similarProducts, setSimilarProducts] = useState(null);

  useEffect(() => {
    const getSimilarProducts = async () => {
      if (productId && !similarProducts) {
        const dataSimilarProducts = await apiOdoo('GET', `/api/v1/product/${productId}/similar?limit=20`);
        setSimilarProducts(dataSimilarProducts);
      }
    }
    getSimilarProducts();
  }, [productId, similarProducts]);


  return (
    <div className="p-4">
      <h2 className="font-bold mb-4">Kamu Mungkin Juga Suka</h2>
      <ProductSlider products={similarProducts}/>
    </div>
  )
}