/* Platform Admin — Approvals queue (core feature) */ // Bilingual priority labels (AP-1 / AP-2) — shared by the queue + drawer. const PRIORITY_LABEL = { high: { en: "High", ar: "عاجل" }, normal: { en: "Normal", ar: "عادي" }, low: { en: "Low", ar: "منخفض" }, }; function _priorityLabel(p, lang) { const m = PRIORITY_LABEL[String(p || "").toLowerCase()]; return m ? (m[lang] || m.en) : (p || ""); } function ApprovalsPage({ lang, openApproval }) { const [filter, setFilter] = React.useState("all"); const [typeFilter, setTypeFilter] = React.useState("all"); const [sort, setSort] = React.useState("oldest"); const all = window.ADMIN_APPROVALS; const filtered = all.filter(a => { if (filter === "high" && a.priority !== "high") return false; if (filter === "normal" && a.priority !== "normal") return false; if (filter === "low" && a.priority !== "low") return false; if (typeFilter !== "all" && a.type !== typeFilter) return false; return true; }); const sorted = [...filtered].sort((a, b) => { if (sort === "oldest") return new Date(a.submitted) - new Date(b.submitted); if (sort === "newest") return new Date(b.submitted) - new Date(a.submitted); if (sort === "priority") { const rank = { high: 0, normal: 1, low: 2 }; return rank[a.priority] - rank[b.priority]; } return 0; }); const counts = { all: all.length, high: all.filter(a => a.priority === "high").length, normal: all.filter(a => a.priority === "normal").length, low: all.filter(a => a.priority === "low").length, }; const types = Object.keys(AP_TYPE_LABEL); return (
{/* Intro strip */}
{lang === "en" ? "Every maker change lands here first." : "كلّ تغيير يمرّ من هنا أوّلًا."}
{lang === "en" ? "Nothing goes live on the site until you approve it. Review the diff, approve, reject, or request changes." : "لا يُنشر شيء حتى توافق عليه. راجع التغيير وأقرّ أو ارفض أو اطلب تعديل."}
{counts.all}
{lang === "en" ? "pending" : "معلّق"}
{counts.high}
{lang === "en" ? "high" : "عاجل"}
{/* Filters */}
{[ { k: "all", l: lang === "en" ? "All" : "الكل", c: counts.all }, { k: "high", l: lang === "en" ? "High" : "عاجل", c: counts.high }, { k: "normal", l: lang === "en" ? "Normal" : "عادي", c: counts.normal }, { k: "low", l: lang === "en" ? "Low" : "منخفض", c: counts.low }, ].map(f => ( ))}
{/* Table / list */}
{/* Desktop header */}
{lang === "en" ? "Request" : "الطلب"}
{lang === "en" ? "Maker" : "الصانع"}
{lang === "en" ? "Type" : "النوع"}
{lang === "en" ? "Pri." : "أولويّة"}
{lang === "en" ? "Submitted" : "مقدَّم"}
{sorted.length === 0 && (
{lang === "en" ? "Inbox zero." : "الصندوق فارغ."}
{lang === "en" ? "No pending approvals for this filter." : "لا يوجد طلبات معلّقة."}
)} {sorted.map((a, i) => { const type = AP_TYPE_LABEL[a.type] || { en: a.type, tone: "muted" }; return ( ); })}
); } // ——— Approval detail drawer ——— function ApprovalDrawer({ approval, onClose, lang, onAction }) { const [note, setNote] = React.useState(""); const [action, setAction] = React.useState(null); // null | 'approve' | 'reject' | 'changes' // ESC closes the drawer; body scroll is locked while it's open. React.useEffect(() => { if (!approval) return; const prev = document.body.style.overflow; document.body.style.overflow = "hidden"; const onKey = (e) => { if (e.key === "Escape") onClose(); }; window.addEventListener("keydown", onKey); return () => { document.body.style.overflow = prev; window.removeEventListener("keydown", onKey); }; }, [approval, onClose]); if (!approval) return null; const type = AP_TYPE_LABEL[approval.type] || { en: approval.type, tone: "muted" }; // AP-4 — a note is REQUIRED when rejecting or requesting changes. const noteRequired = action === "reject" || action === "changes"; const [noteErr, setNoteErr] = React.useState(false); React.useEffect(() => { setNoteErr(false); }, [action]); const submit = () => { if (noteRequired && !note.trim()) { setNoteErr(true); return; } onAction(approval, action, note); setNote(""); setAction(null); setNoteErr(false); }; return (
e.stopPropagation()} style={{ width: "min(640px, 100%)", height: "100%", background: "var(--paper)", display: "flex", flexDirection: "column", boxShadow: "-20px 0 60px rgba(0,0,0,0.25)", }}> {/* Header */}
{type[lang] || type.en} {approval.id}

{window.approvalTitle(approval, lang)}

{approval.summary}
{/* Body */}
{/* Maker card */}
m.slug === approval.maker)?.tone) || "sand"} label="" meta="" />
{approval.makerName}
{approval.maker &&
{(() => { const m = window.ADMIN_MAKERS.find(x => x.slug === approval.maker); if (!m) return ""; const trade = window.categoryLabel ? window.categoryLabel(m.trade, lang) : m.trade; const rubric = (m.rubric != null) ? `${m.rubric}/100` : (lang === "en" ? "unrated" : "غير مقيَّم"); return `${trade} · ${m.city} · ${lang === "en" ? "rubric" : "تقييم"} ${rubric}`; })()}
} {!approval.maker &&
{lang === "en" ? "New applicant" : "متقدّم جديد"}
}
{approval.maker && ( {lang === "en" ? "Public profile ↗" : "الصفحة العامّة ↗"} )}
{/* Diff */}
{lang === "en" ? "What's changing" : "ما الذي سيتغيّر"}
{approval.diff.map((d, i) => (
{d.k}
{d.old && (
− {d.old}
)}
{d.old ? "+ " : ""}{d.new}
))}
{/* Maker note */} {approval.note && (
{lang === "en" ? "Note from maker" : "ملاحظة من الصانع"}
"{approval.note}"
)} {/* Meta */}
{lang === "en" ? "Submitted" : "مقدَّم"}
{window.fmtDate(approval.submitted, lang)}
{lang === "en" ? "Request ID" : "رقم الطلب"}
{approval.id}
{/* Action panel */} {action && (
{action === "approve" && (lang === "en" ? "Approve this change?" : "موافقة على التغيير؟")} {action === "reject" && (lang === "en" ? "Reject this change?" : "رفض التغيير؟")} {action === "changes" && (lang === "en" ? "Ask for changes?" : "اطلب تعديل؟")}