const SelectOption = ({
  type,
  formData,
  setFormData,
  formValue,
  value,
}: {
  type: "frequency" | "duration";
  formData: FormDataType;
  formValue: string;
  setFormData: Dispatch<SetStateAction<FormDataType>>;
  value: Duration | FrequencyType;
}) => {
  return (
    <div
      onClick={() => {
        type === "frequency"
          ? setFormData({ ...formData, frequency: value, days: [] })
          : setFormData({ ...formData, duration: value });
      }}
      className={cn(
        "rounded-xl py-2 px-4 border hover:cursor-pointer",
        formValue === value
          ? "bg-primary text-white border-transparent"
          : "bg-white border-primary text-primary"
      )}
    >
      <p>{value}</p>
    </div>
  );
};