import { Controller, useFormContext } from 'react-hook-form';
import { Switch } from '../form/Switch';

// We control "onChange" & "value" here
type FormSwitchProps = Omit<Omit<React.ComponentProps<typeof Switch>, 'onChange'>, 'value'> & {
  name: string;
};

export function FormSwitch(props: FormSwitchProps) {
  const { name, ...restOfProps } = props;
  const { control } = useFormContext();

  return (
    <Controller
      control={control}
      render={({ field: { onChange, value } }) => {
        return (
          <Switch
            {...restOfProps}
            onChange={(value) => {
              onChange(value);
              return true;
            }}
            value={value}
          />
        );
      }}
      name={name}
    />
  );
}