/* eslint-disable */ // ============================================================ // APP SHELL — Sidebar + TopBar + floating PersonaSwitcher // ============================================================ const { useState: useSh_S, useEffect: useSh_E, useRef: useSh_R } = React; // ---------- Sidebar ---------- const Sidebar = ({ menu, persona, role, currentActionId, onNavigate, collapsed, setCollapsed, onOpenSettings }) => { // Group menu items by section const sections = []; (menu || []).forEach((it) => { if (!it.visible) return; const key = it.section || ""; let s = sections.find((x) => x.label === key); if (!s) { s = { label: key, items: [] }; sections.push(s); } s.items.push(it); }); return ( ); }; // ---------- Top bar ---------- const TopBar = ({ title, subtitle, persona, role, onMenuClick, isAdmin, isEditing, onStartEdit, onStopEdit, onSaveEdit, hasDraft }) => (

{title}

{isEditing && ( Edit mode )}
{subtitle &&
{subtitle}
}
{isAdmin && (
{isEditing ? ( <> {hasDraft && ( Save )} Done editing ) : ( Edit configuration )}
)}
); // ---------- Persona switcher ---------- const PersonaSwitcher = ({ role, setRole }) => { const [open, setOpen] = useSh_S(false); const ref = useSh_R(null); useSh_E(() => { if (!open) return; const onDown = (e) => { if (ref.current && !ref.current.contains(e.target)) setOpen(false); }; document.addEventListener("mousedown", onDown); return () => document.removeEventListener("mousedown", onDown); }, [open]); const persona = PERSONAS[role]; return (
{open && (
Demo Switch preview user
{ROLES.map((r) => { const p = PERSONAS[r.id]; const active = r.id === role; return ( ); })}
)}
); }; // ---------- Account modal (placeholder) ---------- const AccountModal = ({ open, onClose, persona, role }) => (
{persona.name}
{persona.title}
In production this would link to user settings, billing, sign-out. The prototype's "Switch user" is the persona widget in the bottom-right.
); // ---------- Not-allowed page ---------- const NotAllowedPage = ({ persona, role }) => (
Page not available
{persona.name} doesn't have access to this action. Switch preview user in the bottom-right.
); Object.assign(window, { Sidebar, TopBar, PersonaSwitcher, AccountModal, NotAllowedPage });