"use client";
import { useFieldArray, useForm } from "react-hook-form";

export interface IChartStepFields {
  title: string;
  missed_amount: string;
  data: { key: string; value: number }[];
}

const useChartStepPresenter = (initialData?: IChartStepFields) => {
  const {
    register,
    handleSubmit,
    control,
    watch,
    formState: { errors },
    getValues,
  } = useForm<IChartStepFields>({
    defaultValues: initialData || {
      data: [{ key: "", value: 0 }],
    },
  });

  const { fields, append, remove } = useFieldArray({
    control,
    name: "data",
  });

  const onSubmit = (data: IChartStepFields) => {
    console.log(data);
  };

  const collectData = async () => {
    return getValues();
  };

  return {
    register,
    handleSubmit,
    errors,
    onSubmit,
    fields,
    append,
    remove,
    control,
    watch,
    getValues,
    collectData,
  };
};

export default useChartStepPresenter;
