import { Controller, Control, FieldError } from "react-hook-form";

interface FormRadioProps {
  name: string;
  control: Control<any>;
  label: string;
  options: { label: string; value: string }[];
  required?: boolean;
  disabled?: boolean;
  error?: FieldError;
}

export default function FormRadio({
  name,
  control,
  label,
  options,
  required = false,
  disabled = false,
  error,
}: FormRadioProps) {
  return (
    <div className="space-y-2">
      <label className="block text-sm font-medium text-gray-700">
        {label}
        {required && <span className="text-red-500 ml-1">*</span>}
      </label>
      <Controller
        name={name}
        control={control}
        render={({ field }) => (
          <div className="flex gap-6">
            {options.map((option) => (
              <label key={option.value} className="flex items-center gap-2 cursor-pointer">
                <input
                  type="radio"
                  value={option.value}
                  checked={field.value === option.value}
                  onChange={(e) => field.onChange(e.target.value)}
                  disabled={disabled}
                  className="w-4 h-4 text-teal-600 focus:ring-teal-500 disabled:opacity-50"
                />
                <span className="text-sm text-gray-700">{option.label}</span>
              </label>
            ))}
          </div>
        )}
      />
      {error && <p className="text-sm text-red-500">{error.message}</p>}
    </div>
  );
}