import React from 'react';
import {useController} from 'react-hook-form';
import {SurveyQuestion} from '@modules/peopleExperience/interfaces';
import FormInput from '@modules/peopleExperience/components/FormInput';

interface Props {
  question: SurveyQuestion;
}

function RequestFormInput({
  question: {id, title, type, subType, options, required},
}: Props) {
  const {
    field,
    fieldState: {error},
  } = useController({name: id});
  return (
    <FormInput
      error={!!error}
      questionId={id}
      title={title}
      required={required}
      type={type}
      subType={subType}
      options={options}
      onChangeValue={field.onChange}
      value={field.value}
    />
  );
}

export default RequestFormInput;