"use client";

import { createTransferAction } from "@/app/actions/admin";
import { ImageUploadField } from "@/components/forms/image-upload-field";
import { SubmitButton } from "@/components/forms/submit-button";
import {
  TransferPartyFields,
  type TransferSponsorOption
} from "@/components/forms/transfer-party-fields";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { DEFAULT_TRANSFER_AMOUNT } from "@/lib/constants";
import { todayIso } from "@/lib/dates";

export function TransferCreateForm({ sponsors }: { sponsors: TransferSponsorOption[] }) {
  return (
    <form action={createTransferAction} encType="multipart/form-data" className="grid gap-5">
      <div className="grid gap-5 md:grid-cols-2">
        <TransferPartyFields
          sponsors={sponsors}
          idPrefix="create-transfer"
          autoSelectFirstOrphan
        />
      </div>

      <div className="grid gap-5 md:grid-cols-2 xl:grid-cols-3">
        <div>
          <Label>المبلغ المحوّل</Label>
          <Input name="amount" type="number" min={0} defaultValue={DEFAULT_TRANSFER_AMOUNT} required />
        </div>
        <div>
          <Label>تاريخ التحويل (يوم/شهر/سنة)</Label>
          <Input name="transferDate" type="date" defaultValue={todayIso()} required />
        </div>
        <div>
          <Label>مرجع العملية</Label>
          <Input name="reference" />
        </div>
        <div className="md:col-span-2">
          <Label>ملاحظة تظهر للمتبرع</Label>
          <Input name="sponsorVisibleNotes" />
        </div>
        <div>
          <Label>ملاحظة داخلية للإدارة</Label>
          <Input name="internalNotes" />
        </div>
      </div>
      <div className="max-w-md">
        <ImageUploadField name="receipt" label="صورة الإيصال" required={false} />
      </div>
      <p className="text-xs leading-6 text-[var(--ink-soft)]">
        يحدد النظام الفترة الشهرية تلقائياً من تاريخ التحويل، ويؤكد التحويل عند رفع الإيصال.
      </p>
      <SubmitButton pendingText="جارٍ حفظ التحويل ورفع الإيصال..." className="w-full sm:w-auto sm:justify-self-start">
        حفظ التحويل
      </SubmitButton>
    </form>
  );
}