/* FP&A Copilot — export management pack modal */ const { useState: useStateExport, useEffect: useEffectExport } = React; function ExportModal({ onClose, sessionId, period, analysisType, firmName }) { const { Icon, Button } = window; const [tab, setTab] = useStateExport("download"); // "download" | "email" const [fmt, setFmt] = useStateExport("pdf"); const [loading, setLoading] = useStateExport(false); const [recipients, setRecipients] = useStateExport(""); const [subject, setSubject] = useStateExport( () => `Management Pack — ${period?.label || "Report"}` ); const [emailStatus, setEmailStatus] = useStateExport(null); // null | "sending" | "sent" | { error } const [downloadError, setDownloadError] = useStateExport(null); // Commentary editing state const [showEdit, setShowEdit] = useStateExport(false); const [commentary, setCommentary] = useStateExport(null); // null = not yet loaded const [origComm, setOrigComm] = useStateExport(null); const [editLoading, setEditLoading] = useStateExport(false); const isDirty = commentary && origComm && JSON.stringify(commentary) !== JSON.stringify(origComm); // Load commentary from session the first time the edit panel opens useEffectExport(() => { if (!showEdit || commentary !== null) return; setEditLoading(true); fetch(apiUrl(`/api/data/${sessionId}?period=&mode=monthly`)) .then(r => r.json()) .then(d => { const bullets = d.commentary || []; setCommentary(bullets); setOrigComm(bullets); }) .catch(() => { setCommentary([]); setOrigComm([]); }) .finally(() => setEditLoading(false)); }, [showEdit]); const opts = [ { id: "pdf", icon: "file-text", t: "PDF management pack", s: "Board-ready: summary, commentary, tables" }, { id: "xlsx", icon: "table-2", t: "Excel workbook (.xlsx)", s: "Variance, KPIs and commentary — 3 sheets, colour-coded" }, { id: "zip", icon: "file-archive", t: "CSV pack (.zip)", s: "Category summary, variance detail, movements" }, ]; const periodParam = analysisType === "budget_vs_actual" ? (period?.label === "Actual" ? "full_year" : (period?.label || "full_year")) : (period?.label || ""); // If commentary was edited, persist it before the export runs const _saveIfDirty = async () => { if (!isDirty) return; await fetch(apiUrl(`/api/sessions/${sessionId}/commentary`), { method: "PATCH", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ commentary }), }); setOrigComm([...commentary]); // reset dirty flag }; const download = async () => { setLoading(true); setDownloadError(null); try { await _saveIfDirty(); const params = new URLSearchParams({ period: periodParam, fmt }); if (firmName) params.set("firm", firmName); const res = await fetch(apiUrl(`/api/export/${sessionId}?${params}`)); if (!res.ok) { let detail = `HTTP ${res.status}`; try { const j = await res.json(); detail = j.detail || detail; } catch (_) {} throw new Error(detail); } const blob = await res.blob(); const url = URL.createObjectURL(blob); const a = document.createElement("a"); a.href = url; const ext = fmt === "pdf" ? "pdf" : fmt === "xlsx" ? "xlsx" : "zip"; a.download = `management_pack_${(period?.label || "export").replace(/ /g, "_")}.${ext}`; a.click(); URL.revokeObjectURL(url); onClose(); } catch (e) { setDownloadError(e.message); } finally { setLoading(false); } }; const sendEmail = async () => { const rcpts = recipients.split(/[,\n;]+/).map(r => r.trim()).filter(Boolean); if (!rcpts.length) { setEmailStatus({ error: "Enter at least one recipient email address." }); return; } setEmailStatus("sending"); try { await _saveIfDirty(); const res = await fetch(apiUrl(`/api/email/${sessionId}`), { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ recipients: rcpts, subject: subject || `Management Pack — ${period?.label || "Report"}`, period: periodParam, mode: "monthly", fmt: "pdf", firm: firmName || undefined, }), }); const json = await res.json().catch(() => ({})); if (!res.ok) throw new Error(json.detail || `HTTP ${res.status}`); setEmailStatus({ sent: true, count: rcpts.length }); } catch (e) { setEmailStatus({ error: e.message }); } }; const inputStyle = { width: "100%", padding: "8px 12px", boxSizing: "border-box", font: "var(--text-body)", fontSize: 13.5, color: "var(--ink)", background: "var(--surface-2)", border: "1px solid var(--border-strong)", borderRadius: "var(--radius-sm)", outline: "none", }; const bulletInputStyle = { flex: 1, padding: "6px 10px", boxSizing: "border-box", font: "var(--text-body)", fontSize: 13, color: "var(--ink)", background: "var(--surface-2)", border: "1px solid var(--border)", borderRadius: "var(--radius-sm)", outline: "none", }; return (
e.stopPropagation()}>

Export management pack

{/* Tab toggle: Download / Email */}
{[ { id: "download", icon: "download", label: "Download" }, { id: "email", icon: "mail", label: "Email pack" }, ].map((t) => ( ))}
{/* Period label */}
{analysisType === "budget_vs_actual" ? "Actual vs Budget" : `${period?.label || "Selected period"} · vs prior period`}
{/* ── Download mode ── */} {tab === "download" && ( {opts.map((o) => (
setFmt(o.id)}>
{o.t}
{o.s}
))} {/* Commentary editing — PDF only */} {fmt === "pdf" && (
{showEdit && (
{editLoading ? (
Loading commentary…
) : (
{(commentary || []).map((bullet, i) => (
· { const next = [...commentary]; next[i] = e.target.value; setCommentary(next); }} style={bulletInputStyle} />
))}
Edits are applied to the downloaded PDF only — they don't change the analysis.
)}
)}
)} {/* Include commentary toggle — shown when NOT editing */} {!(fmt === "pdf" && showEdit) && ( )} {/* Download error */} {downloadError && (
Export failed: {downloadError}
)} )} {/* ── Email mode ── */} {tab === "email" && (
{emailStatus?.sent ? (
Pack sent to {emailStatus.count} recipient{emailStatus.count !== 1 ? "s" : ""}
The PDF management pack has been dispatched.
) : (