Pending companies ({state.pendingCompanies.length})
{state.pendingCompanies.length === 0 ? (
No companies waiting on approval.
) : (
{state.pendingCompanies.map((c) => (
approveCompany(c.id, tier, am, geo, xeroContactId)}
onReject={() => rejectCompany(c.id)}
/>
))}
)}
Pending users ({state.pendingUsers.length})
{state.pendingUsers.length === 0 ? (
No users waiting on approval.
) : (
{state.pendingUsers.map((u) => (
approveUser(u.id)}
onReject={() => rejectUser(u.id)}
/>
))}
)}
);
}
function CompanyApprovalRow({ company, busy, isReadOnly, onApprove, onReject }) {
const [tier, setTier] = useState("gold");
const [amName, setAmName] = useState("");
const [amEmail, setAmEmail] = useState("");
const [amPhone, setAmPhone] = useState("");
const [region, setRegion] = useState("UK");
const [country, setCountry] = useState("United Kingdom");
const [xeroContact, setXeroContact] = useState(null); // { contactId, name }
const [xeroStatus, setXeroStatus] = useState({ status: "loading", connected: false });
const [approveError, setApproveError] = useState("");
const loadXeroStatus = () => {
fetch("/api/admin/xero/status", { credentials: "same-origin" })
.then((r) => r.json())
.then((data) => setXeroStatus({ status: "ready", connected: !!data.connected }))
.catch(() => setXeroStatus({ status: "error", connected: false }));
};
useEffect(loadXeroStatus, []); // eslint-disable-line react-hooks/exhaustive-deps -- mount-only
const countryOptions = window.GEO_DATA.countriesForRegion(region);
const handleRegionChange = (nextRegion) => {
setRegion(nextRegion);
setCountry(window.GEO_DATA.countriesForRegion(nextRegion)[0] || "");
};
const canApprove = !!region && !!country && !!xeroContact;
const doApprove = async () => {
setApproveError("");
const err = await onApprove(
tier, { name: amName, email: amEmail, phone: amPhone }, { region, country }, xeroContact.contactId
);
if (err) setApproveError(err);
};
return (
);
}
function UserApprovalRow({ user, busy, isReadOnly, onApprove, onReject }) {
return (