blob: fd4f9b4d6a3aecd55a7d4674678a848cfc8d1e07 (
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
|
import { useState } from "react"
import VariantCard from "./VariantCard"
const VariantGroupCard = ({
variants,
...props
}) => {
const [ showAll, setShowAll ] = useState(false)
const variantsToShow = showAll ? variants : variants.slice(0, 2)
return (
<>
{ variantsToShow?.map((variant, index) => (
<VariantCard
key={index}
product={variant}
{...props}
/>
)) }
{ variants.length > 2 && (
<button
type="button"
className="btn-light py-2 w-full"
onClick={() => setShowAll(!showAll)}
>
{ !showAll ? `Lihat Semua +${variants.length - variantsToShow.length}` : 'Tutup' }
</button>
) }
</>
)
}
export default VariantGroupCard
|