"use client";

import type { Control } from "react-hook-form";

import { transactionFieldLabels } from "@/components/form/common/field-labels";
import { formSpanFull } from "@/components/form/common/form-layout";
import { FormSectionLayout } from "@/components/form/common/form-section-layout";
import { TextAreaField } from "@/components/form/fields/text-area-field";
import { TextField } from "@/components/form/fields/text-field";
import type { CommonTransactionFormValues } from "@/components/form/schemas/transaction-schema";

type BrokerDetailsSectionProps = {
  control: Control<CommonTransactionFormValues>;
};

export function BrokerDetailsSection({ control }: BrokerDetailsSectionProps) {
  return (
    <FormSectionLayout>
      <TextField control={control} name="b_1" label={transactionFieldLabels.b_1} />
      <TextField control={control} name="b_2" label={transactionFieldLabels.b_2} />
      <TextField control={control} name="b_3" label={transactionFieldLabels.b_3} />
      <TextField control={control} name="r_m" label={transactionFieldLabels.r_m} />
      <TextField control={control} name="r_link" label={transactionFieldLabels.r_link} />
      <TextAreaField
        control={control}
        name="b_notes"
        label={transactionFieldLabels.b_notes}
        className={formSpanFull}
      />
    </FormSectionLayout>
  );
}