import { ISwitchLabel } from "../types/switchLabel";

interface ISwitchToggleProps {
  labels: ISwitchLabel[];
  currentLabel: ISwitchLabel;
  onClick: (label: ISwitchLabel) => void;
}

function SwitchToggle({ labels, currentLabel, onClick }: ISwitchToggleProps) {
  return (
    <div className="flex bg-white rounded-lg border border-[#E2E2DC] p-1 select-none text-s w-fit">
      {labels.map((lab) => (
        <div
          key={lab.id}
          onClick={() => onClick(lab)}
          className={`${
            lab.id === currentLabel.id ? "bg-[#00BED7] text-white" : ""
          } rounded-lg px-6 py-[10px] cursor-pointer transition-all duration-300 ease-in-out`}
        >
          {lab.label}
        </div>
      ))}
    </div>
  );
}

export default SwitchToggle;
