import { Controller, useWatch } from "react-hook-form";
import FilterBodyField from "./FilterBodyField";

const FilterBodyControllerWithDependency = ({
  column,
  control,
  reset,
  errors,
}) => {
  const dependencyField = useWatch({ control, name: column.dependencyId });

  return (
    <Controller
      name={`${column.id}`}
      control={control}
      render={({ field: { value, name, onBlur, onChange } }) => {
        return (
          <FilterBodyField
            column={column}
            filterParameters={value}
            handleChange={onChange}
            handleBlur={onBlur}
            dependencyFieldValue={dependencyField}
            resetForm={() => reset()}
            errors={errors}
          />
        );
      }}
    />
  );
};
export default FilterBodyControllerWithDependency;
