// screens-validation.jsx — Phase 6 Live Revenue Validation & Agent Certification UI.
// One hub screen, internal tabs. Every metric renders LIVE from /api/validation|/founder|/evidence
// and is LABELLED with its data-source validation level. Honest empty/PRE-VALIDATION states
// everywhere — when there is no real-customer data, the UI says so. Nothing fabricated.
const VT = (lang, ar, en) => (lang === "ar" ? ar : en);
// Company-currency money formatter for the Revenue Command Center (target/closed/
// forecast/gap are all denominated in the company target currency).
function vsar(n) { return window.fmtCurrency(n, window.MaxabCurrency.companyCurrency()); }
function vpct(n) { return n == null ? "—" : n + "%"; }
function VLevelBadge({ level, label }) {
const tone = level >= 3 ? "lime" : level === 2 ? "blue" : "neutral";
return {"L" + level + " · " + (label || "")};
}
function VEmpty({ icon, title, body }) {
return
{title}
{body &&
{body}
}
;
}
function VStat({ label, value, sub, tone }) {
return
{label}
{value}
{sub &&
{sub}
}
;
}
const VALIDATION_TABS = [
{ key: "report", ar: "الأداء الحقيقي", en: "Real Performance" },
{ key: "certification", ar: "الشهادات", en: "Certifications" },
{ key: "benchmark", ar: "المقارنة", en: "Benchmark" },
{ key: "founder", ar: "مراجعة المؤسس", en: "Founder Review" },
{ key: "humanVsAi", ar: "بشري مقابل ذكاء", en: "Human vs AI" },
{ key: "marketScore", ar: "تحقّق السوق", en: "Market Score" },
{ key: "evidence", ar: "سجل الأدلة", en: "Evidence" },
{ key: "product", ar: "تحقّق المنتج", en: "Product Validation" },
{ key: "readiness", ar: "الجاهزية", en: "Readiness" },
];
// SINGLE-OWNER: the Target → Plan → Approve → Execute workflow is owned by Managers → Revenue Director
// (RevenueWorkflowPanel). This screen is the Revenue & Customer DATA / audit layer — its planning &
// execution surfaces render READ-ONLY and LINK to the Revenue Director instead of duplicating ownership.
function navToRevenueDirector(go) { try { window.__navTab = { screen: "head", director: "revenue" }; window.dispatchEvent(new CustomEvent("maxab:navtab", { detail: window.__navTab })); } catch (e) {} if (go) go("head"); }
function RevenueOwnerPointer({ go, T }) {
return (
{T("لتغيير الهدف أو الخطة أو التنفيذ", "To change the target, plan or execution")}{T("الورك‑فلو يملكه مدير الإيراد — هذه الشاشة للعرض والتدقيق فقط.", "This workflow is owned by the Revenue Director — this screen is read-only data & audit.")}
);
}
// REVENUE SECTION IA (action-first rebuild) — the dense Advanced wall is split into 7 focused
// sub-screens, each answering ONE business question with action-first cards. Every section component
// is REUSED verbatim (no engine/collection/calc rebuilt) — this is purely information architecture.
const REVENUE_TABS = [
{ key: "command", ar: "نظرة عامة", en: "Overview", desc: ["اليوم: الهدف، أهم الإجراءات، والقرارات المطلوبة. الورك‑فلو يملكه مدير الإيراد.", "Today: the target, top actions, and the decisions you must approve. The workflow is owned by the Revenue Director."] },
{ key: "planning", ar: "تخطيط الهدف", en: "Target Planning", desc: ["اضبط الهدف والاستراتيجية: السُّلّم، تلقائي/يدوي، القطاع، المنتج، والحدود.", "Set the target + strategy: the ladder, auto/manual, vertical, product and limits."] },
{ key: "execution", ar: "لوحة التنفيذ", en: "Execution Board", desc: ["حوّل توصيات مدير الإيرادات إلى عمل: اعتمد، نفّذ، عدّل، أو ارفض.", "Turn Revenue Director recommendations into work: approve, execute, edit, reject."] },
{ key: "product", ar: "استراتيجية المنتج", en: "Product Strategy", desc: ["ماذا نبيع؟ الربحية، الباقات، المسارات، والعروض.", "What to sell: profitability, packages, revenue paths and offers."] },
{ key: "vertical", ar: "استراتيجية القطاع", en: "Vertical Strategy", desc: ["لمن نبيع؟ ربحية القطاعات وأين نركّز الشهر القادم.", "Who to sell to: vertical profitability and where to focus next month."] },
{ key: "success", ar: "نجاح العملاء", en: "Customer Success", desc: ["احمِ الإيراد ووسّعه: التجديد، التوسّع، ومخاطر التسرّب.", "Protect + expand revenue: renewals, expansion and churn risk."] },
{ key: "intelligence", ar: "الذكاء والتدقيق", en: "Intelligence & Audit", desc: ["من أين تأتي الأرقام؟ المصدر، الحساب، الثقة، وفجوات البيانات.", "Where the numbers come from: source, calculation, confidence and data gaps."] },
];
function RevenueTabStrip({ active, onPick, lang }) {
return (
{REVENUE_TABS.map((tb) => (
))}
);
}
// Shared loading/error guard for a Revenue tab panel (all panels read cc = commandCenter payload).
function revGuard(cc, T) {
if (!cc || cc.error) return ;
return null;
}
function ValidationScreen() {
const { lang } = useLang();
const { go } = useApp();
useStore();
const T = (ar, en) => VT(lang, ar, en);
// The Target → Plan → Approve → Execute workflow has a SINGLE owner: Managers → Revenue Director.
// This screen is the Revenue/Customer DATA + audit layer; it points to the owner instead of duplicating it.
const goRevenueDirector = () => { try { window.__navTab = { screen: "head", director: "revenue" }; window.dispatchEvent(new CustomEvent("maxab:navtab", { detail: window.__navTab })); } catch (e) {} go("head"); };
const [revtab, setRevtab] = React.useState("command");
const [auditView, setAuditView] = React.useState(null); // old validation-metrics sub-views (inside Intelligence)
// Deep link from the sidebar / events. New: {revtab}. Legacy: {mode:"ceo"|"advanced"} → command/intelligence.
React.useEffect(() => {
const apply = (n) => { if (n && n.screen === "validation") { if (n.revtab) setRevtab(n.revtab); else if (n.mode === "advanced") setRevtab("intelligence"); else if (n.mode === "ceo") setRevtab("command"); window.__navTab = null; } };
try { apply(window.__navTab); } catch (e) {}
const h = (e) => apply(e.detail);
window.addEventListener("maxab:navtab", h);
return () => window.removeEventListener("maxab:navtab", h);
}, []);
// Every Revenue tab reads the single commandCenter + ownerOverview payload (no duplicate fetches).
React.useEffect(() => {
Actions.loadValidation("ownerOverview"); Actions.loadValidation("commandCenter");
if (revtab === "product") { Actions.loadValidation("productSubscription"); Actions.loadValidation("productSourceCode"); }
}, [revtab]);
React.useEffect(() => { if (!auditView) return; if (auditView === "founder") { Actions.loadFounderReviews(); return; } Actions.loadValidation(auditView); }, [auditView]);
const goTab = (k) => { setRevtab(k); setAuditView(null); try { window.scrollTo(0, 0); } catch (e) {} };
const meta = REVENUE_TABS.find((t) => t.key === revtab) || REVENUE_TABS[0];
return (
{/* PERSISTENT read-only banner (mandate Part 9) — every Revenue tab here is DATA & AUDIT. The single
operable Target → Plan → Approve → Execute workflow is owned by Managers → Revenue Director, so the
founder is never confused about where to act. Shown on all tabs, not just Overview. */}
{T("شاشة للعرض والتدقيق فقط", "Read-only — data & audit")}{T("لضبط الهدف أو الخطة أو التنفيذ، افتح مدير الإيراد — هو المالك الوحيد للورك‑فلو.", "To set the target, plan or execute, open the Revenue Director — the single owner of the workflow.")}
);
}
// ---- The 7 Revenue tab panels — each composes EXISTING sections (reuse, nothing rebuilt). --------
// 2. TARGET PLANNING — set + control the revenue strategy (target ladder, Auto/Manual, focus, limits).
function TargetPlanningTab({ T }) {
const { lang } = useLang(); const { go } = useApp(); const cc = vget("commandCenter");
const L = (x) => (x && typeof x === "object" && !Array.isArray(x) ? (lang === "ar" ? x.ar : x.en) : x);
const g = revGuard(cc, T); if (g) return g;
return (
);
}
// 3. EXECUTION BOARD — turn recommendations into work (approve / execute / edit / reject + agent plans).
function ExecutionBoardTab({ T }) {
const { lang } = useLang(); const { go } = useApp(); const cc = vget("commandCenter");
const L = (x) => (x && typeof x === "object" && !Array.isArray(x) ? (lang === "ar" ? x.ar : x.en) : x);
const g = revGuard(cc, T); if (g) return g;
return (
);
}
// 4. PRODUCT STRATEGY — what to sell (profitability, packages, paths, offers, ROI).
function ProductStrategyTab({ T }) {
const { lang } = useLang(); const { go } = useApp(); const cc = vget("commandCenter");
const L = (x) => (x && typeof x === "object" && !Array.isArray(x) ? (lang === "ar" ? x.ar : x.en) : x);
const g = revGuard(cc, T); if (g) return g;
return (
);
}
// 5. VERTICAL STRATEGY — who to sell to (vertical profitability + competitive position).
function VerticalStrategyTab({ T }) {
const { lang } = useLang(); const cc = vget("commandCenter");
const g = revGuard(cc, T); if (g) return g;
return (
);
}
// 6. CUSTOMER SUCCESS & RENEWALS — protect + expand revenue (renewals, expansion, churn, danger zone).
// Founder Decisions live in Command Center (the daily approve-queue); Customer Success keeps its own
// founder-decision surface via the Danger Zone (keep / extend grace / suspend / reactivate).
function CustomerSuccessTab({ T }) {
const { lang } = useLang(); const cc = vget("commandCenter");
const g = revGuard(cc, T); if (g) return g;
return (
);
}
// 7. INTELLIGENCE & REALITY AUDIT — where the numbers come from + the validation/certification views.
// Setup gates + funnel-health diagnostic + foundational "finish setup" actions (from ownerOverview).
// Reused verbatim from the old Advanced wall so the onboarding/data-health view is not lost.
function SetupHealthSection({ T, setAuditView }) {
const { lang } = useLang(); const { go } = useApp();
const L = (x) => (x && typeof x === "object" && !Array.isArray(x) ? (lang === "ar" ? x.ar : x.en) : x);
const d = vget("ownerOverview");
if (!d || d.error) return null;
const s = d.summary || {};
const stageTone = d.stage === "Earning" ? "lime" : d.stage === "First customers" ? "blue" : "orange";
const foundational = (d.actions || []).filter((a) => a.kind === "setup" || a.kind === "proof");
const handle = (target) => { if (OWNER_ADVANCED_TABS.includes(target)) { setAuditView && setAuditView(target); } else { go(target); } };
return (
+ {vsar(m.testValue)} {T("معلّم كمكسوب بلا دفع", "marked won, unpaid")}
: null}
{T("الخطوة", "Do this")}: {L(q.action)}
{open ? (
{L(q.meaning)}
{L(q.why)}
) : null}
);
}
// ---- Slice 2: Command Center sections -----------------------------------------
const AGENT_STATUS = {
exceeding: { tone: "lime", ar: "يتجاوز الهدف", en: "Exceeding" },
on_track: { tone: "blue", ar: "على المسار", en: "On Track" },
behind: { tone: "orange", ar: "متأخّر", en: "Behind" },
at_risk: { tone: "orange", ar: "في خطر", en: "At Risk" },
critical: { tone: "red", ar: "حرج", en: "Critical" },
};
const ALLOC_ICON = { allocate_opportunities: "users", follow_up: "clock", coach: "sparkles", product_focus: "layers", prioritise_opportunity: "target" };
// Company target hero + inline editor (Parts 1+2).
// Multi-currency reporting — Revenue/Pipeline grouped by currency. Renders ONLY when
// more than one currency is present (a single-currency install shows the normal totals).
// Honest: converts into the company currency only when the operator configured rates;
// otherwise shows the per-currency breakdown + "no conversion configured".
function CurrencyBreakdownSection({ cc, T, go }) {
const { lang } = useLang();
const ctx = cc && cc.currencyContext;
if (!ctx || !ctx.mixed) return null;
const chips = (m) => Object.keys(m || {}).sort().map((c) => window.fmtCurrency(m[c], c, lang)).join(" · ");
const block = (title, sum) => (
{title}
{chips(sum.byCurrency)}
{sum.converted && sum.total != null ?
≈ {window.fmtCurrency(sum.total, ctx.target, lang)} {T("محوّل بأسعارك", "converted at your rates")}
: null}
);
return (
{!ctx.ratesConfigured ? (
{T("عملات متعددة — لم تُهيَّأ أسعار التحويل، لذا لا نجمعها في رقم واحد. أضِف أسعاراً في الإعدادات ← العملة لعرض إجمالي محوَّل.", "Multiple currencies — no conversion configured, so we don't merge them into one number. Add rates in Settings → Currency to see a converted total.")}
);
return (
{T("حاسبة العائد — استبدال فريق الإيرادات", "ROI Calculator — Revenue Team Replacement")}} flush>
{T("قارن تكلفة فريقك الحالي بتكلفة منظومة الإيرادات الذكية السنوية. الأرقام مشتقّة من مدخلاتك — لا تقديرات ملفّقة.", "Compare your current team's cost to the AI Revenue Organization annual subscription. Numbers derive from your inputs — no fabricated estimates.")}
{T(`تستبدل ${pkg.replaces.min}–${pkg.replaces.max} موظفين بمنظومة إيرادات تعمل 24/7.`, `Replaces ${pkg.replaces.min}–${pkg.replaces.max} employees with a 24/7 revenue organization.`)}
: null}
{saved ? {T("تم الحفظ — يُحتسب في قمع العائد", "Saved — counts toward the ROI funnel")} : null}
) :
{T("أدخل عدد الموظفين والرواتب لرؤية المقارنة.", "Enter employee counts and salaries to see the comparison.")}
{T("استهلاك الذكاء غير مشمول — تحضر مفتاحك الخاص. MAXAB لا تبيع الرموز.", "AI usage is not included — bring your own key. MAXAB does not resell tokens.")}