import RoundedButton from "@/components/elements/RoundedButton";

interface AgeSelectionProps {
  selectedAge: string;
  setSelectedAge: (age: string) => void;
  setFieldValue: (field: string, value: string) => void;
}

const AgeSelection = ({ selectedAge, setSelectedAge, setFieldValue }: AgeSelectionProps) => {
  return (
    <div className="flex gap-2">
      {["18-25", "25-30", "all"].map((age) => (
        <RoundedButton
          key={age}
          className={`p-1 px-2 text-xs min-w-24 ${selectedAge === age ? "bg-blue-500 text-white" : ""}`}
          onClick={(e) => {
            e.preventDefault();
            setSelectedAge(age);
            setFieldValue("age", age);
          }}
        >
          {age === "all" ? "بدون محدودیت" : `${age} سال`}
        </RoundedButton>
      ))}
    </div>
  );
};

export default AgeSelection;
