import React from 'react';
import { Variant } from '@theme/views/product';
import { VariantType } from '@akinon/next/types';

interface ProductVariantsProps {
  variants: VariantType[];
  onVariantChange: () => void;
}

export const ProductVariants: React.FC<ProductVariantsProps> = ({
  variants,
  onVariantChange
}) => {
  return (
    <div className="flex flex-col">
      {variants.map((variant) => (
        <Variant
          key={variant.attribute_key}
          {...variant}
          className="mb-4"
          onChange={onVariantChange}
        />
      ))}
    </div>
  );
};