"use client";

import DynamicFormBuilder from "@/components/forms/DynamicFormBuilder";
import FormFooter from "@/components/ui/FormFooter";
import type { CreateCustomerCredentials } from "@/lib/api";
import { createCustomerFormSections } from "./customerFormSections";
import useCreateCustomerPresenter from "./useCreateCustomerPresenter";

interface IProps {
  editMode?: boolean;
  defaultValues?: CreateCustomerCredentials;
  id?: string;
}

const CreateCustomer = ({ defaultValues, editMode, id }: IProps) => {
  const {
    errors,
    handleSubmit,
    register,
    watch,
    control,
    onSubmit,
    companies,
    showPassword,
    setShowPassword,
  } = useCreateCustomerPresenter({ defaultValues, editMode, id });

  const companyItems =
    companies?.map((company) => ({
      value: company.id,
      label: company.name,
    })) ?? [];

  return (
    <DynamicFormBuilder<CreateCustomerCredentials>
      sections={createCustomerFormSections({
        editMode,
        companyItems,
        watch,
        showPassword,
        setShowPassword,
      })}
      register={register}
      control={control}
      errors={errors}
      handleSubmit={handleSubmit}
      onSubmit={onSubmit}
      footer={<FormFooter />}
    />
  );
};

export default CreateCustomer;
