/* ============================================================
Report site shell — public maintenance request form + tracker.
No login. Submits to the API and polls the caller's own tickets
by email so status stays live.
============================================================ */
function ReportApp() {
const [trackEmail, setTrackEmail] = useState("");
const [myTickets, setMyTickets] = useState([]);
async function refreshTracked(contact) {
if (!contact) return;
try {
const r = await API.trackTickets(contact);
setMyTickets(r.tickets || []);
} catch (_e) { /* ignore transient errors */ }
}
// Look up past requests by email or phone (from the "track" entry on the form).
async function handleTrack(contact) {
const c = (contact || "").trim();
if (!c) return [];
const r = await API.trackTickets(c);
const list = r.tickets || [];
setTrackEmail(c);
setMyTickets(list);
return list;
}
async function handleSubmit({ form, photos }) {
const payload = {
title: form.title, category: form.category, priority: form.priority,
description: form.description, name: form.name, role: form.role,
troop: form.troop, email: form.email, phone: form.phone,
property: form.property, unit: form.unit,
photos,
};
const r = await API.submitTicket(payload);
// Enable live tracking by whatever contact they gave (email preferred, else phone).
const contact = form.email.trim() || form.phone.trim();
if (contact) {
setTrackEmail(contact);
refreshTracked(contact);
}
return r.ticket; // { id, ... }
}
// Poll the tracker so status updates from the crew appear without a refresh.
useEffect(() => {
if (!trackEmail) return;
const t = setInterval(() => refreshTracked(trackEmail), 20000);
return () => clearInterval(t);
}, [trackEmail]);
return (
);
}
ReactDOM.createRoot(document.getElementById("root")).render();