"use client";

import { useState } from "react";
import { prepareVendorEmail } from "@/app/(portal)/po/[id]/email-actions";

/**
 * "Email to vendor" (issue #14): generates the PO PDF, stores it, and opens an
 * Outlook (default mail client) draft addressed to the vendor's primary contact
 * with a download link in the body. The user reviews and sends it themselves.
 */
export function EmailVendorButton({ poId }: { poId: string }) {
  const [pending, setPending] = useState(false);
  const [error, setError] = useState("");

  async function handleClick() {
    setPending(true);
    setError("");
    const result = await prepareVendorEmail(poId);
    setPending(false);
    if ("error" in result) {
      setError(result.error);
    } else {
      // Opens the default mail client (Outlook) with a pre-filled draft.
      window.location.href = result.mailto;
    }
  }

  return (
    <div className="inline-flex flex-col items-start gap-1">
      <button
        onClick={handleClick}
        disabled={pending}
        className="rounded-lg border border-neutral-300 bg-white px-3 py-2 text-sm font-medium text-neutral-700 hover:bg-neutral-50 disabled:opacity-60"
      >
        {pending ? "Preparing…" : "Email to vendor"}
      </button>
      {error && <span className="text-xs text-danger-700 max-w-xs">{error}</span>}
    </div>
  );
}