/* Google Reviews → Discount codes. */
const { useCallback } = React;
const _j = { "Content-Type": "application/json" };
function apiR(path, method = "GET", body) {
return fetch(path, {
method,
headers: body !== undefined ? _j : undefined,
body: body !== undefined ? JSON.stringify(body) : undefined,
}).then(async r => {
if (!r.ok) { let m; try { m = (await r.json()).error; } catch {} throw new Error(m || r.status + " " + r.statusText); }
return r.json();
});
}
/* ── Tiny helpers ─────────────────────────────────────────────── */
function Stars({ n }) {
const v = Math.round(n || 0);
return {"★".repeat(v)}{"☆".repeat(5 - v)};
}
const S_COLOR = { unmatched: "#9ca3af", matched: "#3b82f6", sent: "#f97316", used: "#22c55e" };
const S_LABEL = { unmatched: "Unmatched", matched: "Ready to send", sent: "Sent", used: "Used" };
function Pill({ status }) {
const c = S_COLOR[status] || S_COLOR.unmatched;
return (
{S_LABEL[status] || status}
);
}
/* Primary mint button */
function MintBtn({ children, onClick, loading, disabled }) {
return (
);
}
/* Ghost / secondary button */
function GhostBtn({ children, onClick, loading, disabled, danger }) {
return (
);
}
/* ── Customer search modal ────────────────────────────────────── */
function CustomerSearchModal({ review, onLink, onClose }) {
const [q, setQ] = useState(review.reviewerName || "");
const [results, setResults] = useState(null);
const [loading, setLoading] = useState(false);
const [err, setErr] = useState(null);
const [email, setEmail] = useState("");
const [manualName, setManualName] = useState(review.reviewerName || "");
const search = useCallback(async () => {
if (!q.trim()) return;
setLoading(true); setErr(null);
try { const r = await apiR("/api/reviews/customers?q=" + encodeURIComponent(q)); setResults(r.customers || []); }
catch (e) { setErr(e.message); }
finally { setLoading(false); }
}, [q]);
useEffect(() => { search(); }, []);
return (
e.stopPropagation()}>
Link customer
for review by {review.reviewerName}
setQ(e.target.value)}
placeholder="Search by name or email…" style={{ flex: 1, fontSize: 13 }}
onKeyDown={e => e.key === "Enter" && search()} />
{err &&
{err}
}
{results !== null && results.length === 0 && (
No customers found
)}
{(results || []).map(c => (
{c.name}
{c.email} · {c.ordersCount} orders
onLink(c)}>Link
))}
);
}
/* ── Review card ──────────────────────────────────────────────── */
function ReviewCard({ review, onRefresh }) {
const [busy, setBusy] = useState(null);
const [err, setErr] = useState(null);
const [showLink, setShowLink] = useState(false);
const [showNote, setShowNote] = useState(false);
const [notes, setNotes] = useState(review.notes || "");
const act = useCallback(async (action, method = "POST", body) => {
setBusy(action); setErr(null);
try { await apiR(`/api/reviews/${review.id}/${action}`, method, body); await onRefresh(); }
catch (e) { setErr(e.message); }
finally { setBusy(null); }
}, [review.id, onRefresh]);
// Delete hits the bare resource (DELETE /api/reviews/:id) — no action suffix.
const remove = useCallback(async () => {
setBusy("delete"); setErr(null);
try { await apiR(`/api/reviews/${review.id}`, "DELETE"); await onRefresh(); }
catch (e) { setErr(e.message); }
finally { setBusy(null); }
}, [review.id, onRefresh]);
const linkCustomer = useCallback(async (c) => {
setBusy("match"); setErr(null);
try {
await apiR(`/api/reviews/${review.id}/match`, "POST", { customerId: c.id, customerEmail: c.email, customerName: c.name });
setShowLink(false); await onRefresh();
} catch (e) { setErr(e.message); }
finally { setBusy(null); }
}, [review.id, onRefresh]);
const dateStr = review.reviewPublishedAt
? new Date(review.reviewPublishedAt).toLocaleDateString("en-GB", { day: "numeric", month: "short", year: "numeric" })
: "";
const borderColor = S_COLOR[review.status] || S_COLOR.unmatched;
// Primary action button
let primary = null;
if (review.status === "matched" || (review.customerEmail && !review.discountCode)) {
primary = act("issue")}>Issue & Send;
} else if (!review.customerEmail) {
primary = setShowLink(true)}>Link customer;
}
return (
<>
{/* Col 1 — Reviewer */}
{review.reviewerName}
{dateStr}
{(review.followups || []).length > 0 && !review.discountUsed && (
{(review.followups || []).length} follow-up{(review.followups || []).length !== 1 ? "s" : ""} sent
)}
{/* Col 2 — Review text */}
{review.reviewText || No review text}
{/* Col 3 — Customer */}
{review.customerEmail ? (
<>
{review.customerName || "—"}
{review.customerEmail}
act("unlink", "POST")} loading={busy === "unlink"}>Unlink
) : (
)}
{/* Col 4 — Discount code + actions */}
{/* Discount code */}
{review.discountCode ? (
{review.discountCode}
{review.discountAdminLink && (
↗
)}
{review.discountUsed && (
{review.discountUsedManual ? "✓ Marked used" : "✓ Redeemed in Shopify"}
{review.discountUsedAt ? ` · ${new Date(review.discountUsedAt).toLocaleDateString("en-GB")}` : ""}
)}
) : (
— no code yet —
)}
{/* Primary action */}
{primary &&
{primary}
}
{/* Secondary actions row */}
{review.discountCode && review.customerEmail && (
act("resend")}>Resend
)}
{review.discountCode && review.customerEmail && (
{ if (confirm("Void old code and create a new one?")) act("reissue"); }}>Re-issue
)}
{!review.discountUsed && review.discountCode && (
act("mark-used")}>Mark used
)}
{review.discountUsed && review.discountUsedManual && (
act("mark-unused")}>Unmark
)}
{review.status === "sent" && !review.followupStopped && (
act("stop-followups")}>Stop follow-ups
)}
setShowNote(v => !v)}>{showNote ? "Hide note" : (review.notes ? "Note ✎" : "Note")}
remove()}>Delete
{err &&
{err}
}