import { KlaviyoListItem, KlaviyoListTypes } from './KlaviyoListItem';

interface KlaviyoListProps {
  items: KlaviyoListTypes[];
  selected: string[];
  onSelect: React.ChangeEventHandler<HTMLInputElement>;
}

export const KlaviyoList = ({
  items,
  selected,
  onSelect,
}: KlaviyoListProps) => {
  return (
    <div className="padding4 spacingY2">
      {items?.map((list) => {
        return (
          <KlaviyoListItem
            item={list}
            selected={selected.indexOf(list.id) !== -1}
            onSelect={onSelect}
            key={list.id}
          />
        );
      })}
    </div>
  );
};