"use client";

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

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

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

export function PricingDetailsSection({ control }: PricingDetailsSectionProps) {
  return (
    <FormSectionLayout>
      <NumberField control={control} name="quantity" label={transactionFieldLabels.quantity} step="0.0001" />
      <NumberField control={control} name="price" label={transactionFieldLabels.price} />
      <NumberField control={control} name="amount" label={transactionFieldLabels.amount} />
      <NumberField control={control} name="t_price" label={transactionFieldLabels.t_price} />
      <NumberField control={control} name="commission" label={transactionFieldLabels.commission} />
      <TextField control={control} name="p_currency" label={transactionFieldLabels.p_currency} />
      <NumberField control={control} name="exchange_rate" label={transactionFieldLabels.exchange_rate} step="0.000001" />
      <NumberField control={control} name="premium" label={transactionFieldLabels.premium} />
    </FormSectionLayout>
  );
}