// src/pages/DashboardPage/BillingPage/InvoiceStatusModal.tsx
// The confirm dialog behind Mark as paid (records the remaining balance as a payment, which closes the
// invoice) and Void (-> cancelled or entered-in-error). Modeled directly on
// ArchiveConfirmModal (src/components/ArchiveConfirmModal/ArchiveConfirmModal.tsx): a ui/alert-dialog with
// a raw confirm <button> (not AlertDialogAction, which auto-closes on click - we need the dialog to stay
// open while `submitting` and to surface `error` on failure) and AlertDialogCancel as the only "cancel".
import { useEffect, useState } from 'react';
import {
    AlertDialog,
    AlertDialogContent,
    AlertDialogHeader,
    AlertDialogTitle,
    AlertDialogDescription,
    AlertDialogFooter,
    AlertDialogCancel,
} from '../../../components/ui/alert-dialog';
import { RadioGroup, RadioGroupItem } from '../../../components/ui/radio-group';

export type InvoiceStatusAction = 'void' | 'paid';

// The exact FHIR Invoice.status values this modal can hand back to the caller. 'paid' always resolves to
// 'balanced'; 'void' resolves to whichever reason the staff member picks.
export type InvoiceConfirmedStatus = 'balanced' | 'cancelled' | 'entered-in-error';
type VoidReason = Extract<InvoiceConfirmedStatus, 'entered-in-error' | 'cancelled'>;

const VOID_REASONS: { value: VoidReason; label: string }[] = [
    { value: 'entered-in-error', label: 'Entered in error' },
    { value: 'cancelled', label: 'Cancelled' },
];

export type InvoiceStatusModalProps = {
    open: boolean;
    onOpenChange: (open: boolean) => void;
    action: InvoiceStatusAction;
    submitting?: boolean;
    error?: string;
    // The remaining balance Mark as paid records, already formatted.
    paidAmount?: string;
    onConfirm: (status: InvoiceConfirmedStatus) => void;
};

const InvoiceStatusModal = ({
    open,
    onOpenChange,
    action,
    submitting,
    error,
    paidAmount,
    onConfirm,
}: InvoiceStatusModalProps) => {
    const [reason, setReason] = useState<VoidReason | undefined>();
    const isVoid = action === 'void';
    const invalid = isVoid && !reason;

    // Clear any reason chosen for a previous invoice each time the modal (re)opens, so a stale pick never
    // carries forward onto a different invoice.
    useEffect(() => {
        if (open) setReason(undefined);
    }, [open]);

    const handleConfirm = () => {
        if (isVoid) {
            if (reason) onConfirm(reason);
            return;
        }
        onConfirm('balanced');
    };

    return (
        <AlertDialog open={open} onOpenChange={onOpenChange}>
            <AlertDialogContent>
                <AlertDialogHeader>
                    <AlertDialogTitle>
                        {isVoid ? 'Void this invoice?' : 'Record this invoice as paid?'}
                    </AlertDialogTitle>
                    <AlertDialogDescription>
                        {isVoid
                            ? 'This stops the invoice from being collected on. Nothing is deleted. Choose a reason:'
                            : `This records the remaining ${paidAmount ?? 'balance'} as received and closes the invoice.`}
                    </AlertDialogDescription>
                </AlertDialogHeader>

                {isVoid && (
                    <RadioGroup
                        value={reason}
                        onValueChange={(value) => setReason(value as VoidReason)}
                        className="flex flex-col gap-2"
                        disabled={submitting}
                    >
                        {VOID_REASONS.map((r) => (
                            <div key={r.value} className="flex items-center gap-2">
                                <RadioGroupItem value={r.value} id={`invoice-void-${r.value}`} />
                                <label htmlFor={`invoice-void-${r.value}`} className="ak-label cursor-pointer">
                                    {r.label}
                                </label>
                            </div>
                        ))}
                    </RadioGroup>
                )}

                {error && <div className="ak-notice ak-notice--error">{error}</div>}

                <AlertDialogFooter>
                    <AlertDialogCancel className="btn btn-amber" disabled={submitting}>
                        {isVoid ? 'Leave it open' : 'Not paid yet'}
                    </AlertDialogCancel>
                    <button
                        type="button"
                        className={isVoid ? 'btn btn-red' : 'btn btn-green'}
                        disabled={invalid || submitting}
                        onClick={handleConfirm}
                    >
                        {submitting ? (isVoid ? 'Voiding…' : 'Recording…') : isVoid ? 'Void' : 'Mark as Paid'}
                    </button>
                </AlertDialogFooter>
            </AlertDialogContent>
        </AlertDialog>
    );
};

export default InvoiceStatusModal;