import { useEffect, useState } from "react";
import { AlertCircle } from "lucide-react";
import {
    Dialog,
    DialogContent,
    DialogDescription,
    DialogFooter,
    DialogHeader,
    DialogTitle,
} from "../../../components/ui/dialog.tsx";
import { Alert, AlertDescription } from "../../../components/ui/alert.tsx";
import { Button } from "../../../components/ui/button.tsx";
import { Input } from "../../../components/ui/input.tsx";
import { Label } from "../../../components/ui/label.tsx";
import { Textarea } from "../../../components/ui/textarea.tsx";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../../../components/ui/select.tsx";
import { mayHaveBeenWritten, relayServerFailure } from "../../../utils/fetchFailureMessage";
import { formatDateTime } from "../../../utils/dateUtils";
import { UnconfirmedResult, type RefusedRequisition, type RequisitionContact } from "../../../hooks/useInboundRequisitions.ts";

export interface ContactDraft {
    method: "" | "phone" | "fax";
    recipient: string;
    spokeWith: string;
    outcome: string;
}

export const BLANK_CONTACT: ContactDraft = { method: "", recipient: "", spokeWith: "", outcome: "" };

/** One id and time per attempt, kept across retries so the server recognises a resend. */
export interface AttemptStamp {
    id: string;
    occurredAt: string;
}

export const newStamp = (): AttemptStamp => ({ id: crypto.randomUUID(), occurredAt: new Date().toISOString() });

export const contactReady = (draft: ContactDraft) => Boolean(draft.method) && draft.outcome.trim().length > 0;

export const contactFrom = (draft: ContactDraft, stamp: AttemptStamp): Omit<RequisitionContact, "recordedBy"> => ({
    id: stamp.id,
    method: draft.method as "phone" | "fax",
    outcome: draft.outcome.trim(),
    occurredAt: stamp.occurredAt,
    ...(draft.recipient.trim() ? { recipient: draft.recipient.trim() } : {}),
    ...(draft.spokeWith.trim() ? { spokeWith: draft.spokeWith.trim() } : {}),
});

// A lost response is unknown, not a failure: the server may have kept it, and a resend is safe.
export const failureWording = (failure: unknown, what: string) => (failure instanceof UnconfirmedResult || mayHaveBeenWritten(failure)
    ? `We could not confirm whether the ${what} was saved. Check the Refused list before trying again; trying again will not record it twice.`
    : relayServerFailure(failure, `The ${what} was not saved.`));

export const describeContact = (contact: RequisitionContact) =>
    [
        `${contact.method === "fax" ? "Fax" : "Phone"} ${formatDateTime(contact.occurredAt)}`,
        contact.recipient,
        contact.spokeWith ? `Spoke with ${contact.spokeWith}` : undefined,
        contact.outcome,
    ].filter(Boolean).join(" · ");

export const ContactFields = ({ draft, onChange, disabled, idPrefix }: {
    draft: ContactDraft;
    onChange: (next: ContactDraft) => void;
    disabled?: boolean;
    idPrefix: string;
}) => {
    const set = (key: keyof ContactDraft) => (value: string) => onChange({ ...draft, [key]: value });
    return (
        <div className="grid gap-3">
            <div className="grid gap-1">
                <Label htmlFor={`${idPrefix}-method`}>How</Label>
                <Select value={draft.method} onValueChange={set("method")} disabled={disabled}>
                    <SelectTrigger id={`${idPrefix}-method`} aria-label="How">
                        <SelectValue placeholder="Choose phone or fax" />
                    </SelectTrigger>
                    <SelectContent>
                        <SelectItem value="phone">Phone</SelectItem>
                        <SelectItem value="fax">Fax</SelectItem>
                    </SelectContent>
                </Select>
            </div>
            <div className="grid gap-1">
                <Label htmlFor={`${idPrefix}-recipient`}>Number</Label>
                <Input id={`${idPrefix}-recipient`} value={draft.recipient} maxLength={100} disabled={disabled}
                    onChange={(event) => set("recipient")(event.target.value)} />
            </div>
            <div className="grid gap-1">
                <Label htmlFor={`${idPrefix}-spoke`}>Spoke with</Label>
                <Input id={`${idPrefix}-spoke`} value={draft.spokeWith} maxLength={120} disabled={disabled}
                    onChange={(event) => set("spokeWith")(event.target.value)} />
            </div>
            <div className="grid gap-1">
                <Label htmlFor={`${idPrefix}-outcome`}>What happened</Label>
                <Textarea id={`${idPrefix}-outcome`} value={draft.outcome} rows={2} maxLength={500} disabled={disabled}
                    onChange={(event) => set("outcome")(event.target.value)} />
            </div>
        </div>
    );
};

interface Props {
    requisition?: RefusedRequisition;
    onClose: () => void;
    recordContact: (requisitionId: string, contact: Omit<RequisitionContact, "recordedBy">) => Promise<unknown>;
}

const RequisitionContactDialog = ({ requisition, onClose, recordContact }: Props) => {
    const [draft, setDraft] = useState<ContactDraft>(BLANK_CONTACT);
    const [stamp, setStamp] = useState<AttemptStamp>(newStamp);
    const [busy, setBusy] = useState(false);
    const [error, setError] = useState<string>();

    useEffect(() => {
        setDraft(BLANK_CONTACT);
        setStamp(newStamp());
        setError(undefined);
    }, [requisition?.requisitionId]);

    if (!requisition?.requisitionId) return null;

    const submit = async () => {
        setBusy(true);
        setError(undefined);
        try {
            await recordContact(requisition.requisitionId as string, contactFrom(draft, stamp));
            onClose();
        } catch (failure) {
            console.error("Error recording a requisition contact attempt:", failure);
            setError(failureWording(failure, "contact attempt"));
        } finally {
            setBusy(false);
        }
    };

    return (
        <Dialog open onOpenChange={(open) => { if (!open && !busy) onClose(); }}>
            <DialogContent>
                <DialogHeader>
                    <DialogTitle>Record contact attempt</DialogTitle>
                    <DialogDescription>
                        {`How you tried to tell ${requisition.from ?? "the sender"} about the refusal, and what happened.`}
                    </DialogDescription>
                </DialogHeader>

                {error ? (
                    <Alert variant="destructive">
                        <AlertCircle className="h-4 w-4" />
                        <AlertDescription>{error}</AlertDescription>
                    </Alert>
                ) : null}

                <ContactFields draft={draft} onChange={setDraft} disabled={busy} idPrefix="later-contact" />

                <DialogFooter>
                    <Button className="btn btn-blue" disabled={!contactReady(draft) || busy} onClick={() => void submit()}>
                        {busy ? "Saving…" : "Record contact attempt"}
                    </Button>
                </DialogFooter>
            </DialogContent>
        </Dialog>
    );
};

export default RequisitionContactDialog;