@eintrek/erp-shell 0.1.51 → 0.1.53

package/dist/index.js

@@ -13,8 +13,8 @@ var navigation = require('next/navigation');
 var Link = require('next/link');
 var reactDom = require('react-dom');
 var nextThemes = require('next-themes');
-var reactQueryDevtools = require('@tanstack/react-query-devtools');
 var axios = require('axios');
+var reactQueryDevtools = require('@tanstack/react-query-devtools');
 
 function _interopNamespaceDefault(e) {
     var n = Object.create(null);
@@ -822,270 +822,982 @@ function isRecordID(segment) {
         /^[0-9a-f]{24,}$/i.test(segment));
 }
 
-function isExternalHref(href) {
-    return /^https?:\/\//i.test(href) || href.startsWith("//");
-}
-function NavUser({ organization, avatarSrc, profileHref, selectOrganizationHref = "/select-organization", signInRedirectHref = "/auth/signin", systemLinks, showSelectOrganization = true, showLanguageSwitch = true, variant = "brand", } = {}) {
-    const { data: session, status } = react.useSession();
-    const router = navigation.useRouter();
-    const { theme, setTheme } = nextThemes.useTheme();
-    const [isSigningOut, setIsSigningOut] = React.useState(false);
-    const [isOpen, setIsOpen] = React.useState(false);
-    const [showThemeMenu, setShowThemeMenu] = React.useState(false);
-    const [showLanguageMenu, setShowLanguageMenu] = React.useState(false);
-    const [showAppsMenu, setShowAppsMenu] = React.useState(false);
-    const buttonRef = React.useRef(null);
-    const [position, setPosition] = React.useState({ top: 0, left: 0 });
-    const user = session?.user
-        ? {
-            name: session.user.name || "ผู้ใช้",
-            email: session.user.email || "",
-            // avatarSrc first: the NextAuth session carries no picture unless the
-            // host app deliberately puts one in the JWT, so relying on
-            // session.user.image alone left every user on their initials forever.
-            avatar: avatarSrc || session.user.image || undefined,
-        }
-        : null;
-    const getInitials = (name) => {
-        if (!name)
-            return "U";
-        return name
-            .split(" ")
-            .map(n => n[0])
-            .join("")
-            .toUpperCase()
-            .slice(0, 2);
-    };
-    const handleSignOut = async () => {
-        setIsSigningOut(true);
-        try {
-            await react.signOut({ callbackUrl: signInRedirectHref, redirect: true });
-        }
-        catch (error) {
-            console.error("Sign out error:", error);
-            window.location.href = signInRedirectHref;
-        }
-        finally {
-            setIsSigningOut(false);
-        }
-    };
-    const handleSelectOrganization = () => {
-        setIsOpen(false);
-        router.push(selectOrganizationHref);
-    };
-    const handleProfile = () => {
-        setIsOpen(false);
-        if (profileHref)
-            router.push(profileHref);
-    };
-    const handleSystemLink = (href) => {
-        setIsOpen(false);
-        if (isExternalHref(href)) {
-            window.location.assign(href);
-            return;
-        }
-        router.push(href);
+let open = false;
+let hosts = 0;
+let declaredApp = null;
+// The message the dialog should open on (the ตอบกลับ link's ?help=H1004),
+// until it is closed or left.
+let pendingRef = null;
+const listeners = new Set();
+function emit() {
+    listeners.forEach(l => l());
+}
+function subscribe(l) {
+    listeners.add(l);
+    return () => {
+        listeners.delete(l);
     };
-    const handleThemeChange = (newTheme) => {
-        setTheme(newTheme);
-        setShowThemeMenu(false);
-    };
-    const handleLanguageChange = (language) => {
-        console.log("Change language to:", language);
-        setShowLanguageMenu(false);
-    };
-    React.useEffect(() => {
-        if (isOpen && buttonRef.current) {
-            const rect = buttonRef.current.getBoundingClientRect();
-            setPosition({ top: rect.bottom, left: rect.right + 8 });
-        }
-    }, [isOpen]);
-    React.useEffect(() => {
-        if (!isOpen)
-            return;
-        const handleClickOutside = (event) => {
-            if (buttonRef.current &&
-                !buttonRef.current.contains(event.target) &&
-                !event.target.closest('[data-dropdown="nav-user"]')) {
-                setIsOpen(false);
-            }
-        };
-        document.addEventListener("mousedown", handleClickOutside);
-        return () => document.removeEventListener("mousedown", handleClickOutside);
-    }, [isOpen]);
-    if (status === "loading") {
-        return (jsxRuntime.jsx("div", { className: "p-2", children: jsxRuntime.jsxs("div", { className: "flex items-center gap-2 p-2 rounded-md", children: [jsxRuntime.jsx("div", { className: "h-8 w-8 rounded-lg bg-sidebar-accent animate-pulse" }), jsxRuntime.jsxs("div", { className: "flex-1 space-y-1", children: [jsxRuntime.jsx("div", { className: "h-4 w-24 bg-sidebar-accent rounded animate-pulse" }), jsxRuntime.jsx("div", { className: "h-3 w-32 bg-sidebar-accent rounded animate-pulse" })] })] }) }));
+}
+/** Opens the dialog — a no-op when no layout has mounted one. */
+function openHelp() {
+    if (!open) {
+        open = true;
+        emit();
     }
-    if (!user)
-        return null;
-    const visibleSystemLinks = (systemLinks ?? []).filter(link => link.href && link.label);
-    const dropdownContent = isOpen ? (jsxRuntime.jsxs("div", { "data-dropdown": "nav-user", className: "fixed w-52 sm:w-60 md:w-80 rounded-lg bg-sidebar border border-sidebar-border shadow-xl z-50 overflow-hidden\n                 -translate-x-[65%] -translate-y-[110%] sm:translate-x-0 sm:-translate-y-full", style: { top: `${position.top}px`, left: `${position.left}px` }, children: [organization && (jsxRuntime.jsx("div", { className: "p-4 border-b border-sidebar-border bg-sidebar-accent/30", children: jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [organization.logoUrl ? (
-                        // eslint-disable-next-line @next/next/no-img-element
-                        jsxRuntime.jsx("img", { src: organization.logoUrl, alt: organization.name ?? "โลโก้บริษัท", className: "h-8 w-8 flex-shrink-0 rounded object-contain bg-white", 
-                            // A dead logo URL must not leave a broken-image glyph in the
-                            // sidebar; drop back to the generic icon's empty slot.
-                            onError: e => {
-                                e.currentTarget.style.display = "none";
-                            } })) : (jsxRuntime.jsx(lucideReact.Building2, { className: "h-5 w-5 text-sidebar-foreground/70 flex-shrink-0" })), jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [jsxRuntime.jsx("div", { className: "font-medium text-sm sm:truncate", children: organization.name }), organization.description && (jsxRuntime.jsx("div", { className: "text-xs text-sidebar-foreground/70 truncate mt-0.5", children: organization.description }))] })] }) })), jsxRuntime.jsxs("div", { className: "p-2", children: [jsxRuntime.jsxs("div", { className: "relative", children: [jsxRuntime.jsxs("button", { onClick: () => {
-                                    setShowThemeMenu(!showThemeMenu);
-                                    setShowLanguageMenu(false);
-                                    setShowAppsMenu(false);
-                                }, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.Palette, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E40\u0E1B\u0E25\u0E35\u0E48\u0E22\u0E19\u0E18\u0E35\u0E21" }), jsxRuntime.jsx(lucideReact.ChevronUp, { className: `h-4 w-4 transition-transform ${showThemeMenu ? "rotate-180" : ""}` })] }), showThemeMenu && (jsxRuntime.jsx("div", { className: "mt-1 ml-4 space-y-1", children: [
-                                    { key: "light", label: "สว่าง", Icon: lucideReact.Sun },
-                                    { key: "dark", label: "มืด", Icon: lucideReact.Moon },
-                                    { key: "system", label: "ตามระบบ", Icon: lucideReact.Monitor },
-                                ].map(({ key, label, Icon }) => (jsxRuntime.jsxs("button", { onClick: () => handleThemeChange(key), className: "flex w-full items-center gap-3 px-3 py-2 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(Icon, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: label }), theme === key && (jsxRuntime.jsx("div", { className: "h-2 w-2 rounded-full bg-primary" }))] }, key))) }))] }), showLanguageSwitch && (jsxRuntime.jsxs("div", { className: "relative", children: [jsxRuntime.jsxs("button", { onClick: () => {
-                                    setShowLanguageMenu(!showLanguageMenu);
-                                    setShowThemeMenu(false);
-                                    setShowAppsMenu(false);
-                                }, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.Globe, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E40\u0E1B\u0E25\u0E35\u0E48\u0E22\u0E19\u0E20\u0E32\u0E29\u0E32" }), jsxRuntime.jsx(lucideReact.ChevronUp, { className: `h-4 w-4 transition-transform ${showLanguageMenu ? "rotate-180" : ""}` })] }), showLanguageMenu && (jsxRuntime.jsx("div", { className: "mt-1 ml-4 space-y-1", children: [
-                                    { code: "th", label: "ไทย" },
-                                    { code: "en", label: "English" },
-                                    { code: "zh", label: "中文" },
-                                    { code: "ja", label: "日本語" },
-                                ].map(({ code, label }) => (jsxRuntime.jsxs("button", { onClick: () => handleLanguageChange(code), className: "flex w-full items-center gap-3 px-3 py-2 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx("span", { className: "flex-1 text-left", children: label }), organization?.language === code && (jsxRuntime.jsx("div", { className: "h-2 w-2 rounded-full bg-primary" }))] }, code))) }))] })), profileHref && (jsxRuntime.jsxs("button", { onClick: handleProfile, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.User, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E2A\u0E48\u0E27\u0E19\u0E15\u0E31\u0E27" })] })), showSelectOrganization && (jsxRuntime.jsxs("button", { onClick: handleSelectOrganization, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.Building2, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E18\u0E38\u0E23\u0E01\u0E34\u0E08" })] })), visibleSystemLinks.length > 0 && (jsxRuntime.jsxs("div", { className: "relative", children: [jsxRuntime.jsxs("button", { onClick: () => {
-                                    setShowAppsMenu(!showAppsMenu);
-                                    setShowThemeMenu(false);
-                                    setShowLanguageMenu(false);
-                                }, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.LayoutGrid, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E41\u0E2D\u0E1B\u0E1E\u0E25\u0E34\u0E40\u0E04\u0E0A\u0E31\u0E19" }), jsxRuntime.jsx(lucideReact.ChevronUp, { className: `h-4 w-4 transition-transform ${showAppsMenu ? "rotate-180" : ""}` })] }), showAppsMenu && (jsxRuntime.jsx("div", { className: "mt-1 ml-4 space-y-1", children: visibleSystemLinks.map(link => (jsxRuntime.jsxs("button", { type: "button", onClick: () => handleSystemLink(link.href), className: "flex w-full items-center gap-3 px-3 py-2 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [link.icon ?? jsxRuntime.jsx(lucideReact.ExternalLink, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: link.label }), link.active && (jsxRuntime.jsx("div", { className: "h-2 w-2 rounded-full bg-primary" }))] }, `${link.label}:${link.href}`))) }))] })), jsxRuntime.jsx("button", { onClick: handleSignOut, disabled: isSigningOut, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors disabled:opacity-50 disabled:cursor-not-allowed mt-1", children: isSigningOut ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 animate-spin" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E2D\u0E2D\u0E01\u0E08\u0E32\u0E01\u0E23\u0E30\u0E1A\u0E1A..." })] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(lucideReact.LogOut, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E2D\u0E2D\u0E01\u0E08\u0E32\u0E01\u0E23\u0E30\u0E1A\u0E1A" })] })) })] })] })) : null;
-    if (variant === "workspace") {
-        return (jsxRuntime.jsx("div", { className: "mt-3.5 border-t border-sidebar-border pt-3", children: jsxRuntime.jsxs("div", { className: "relative", children: [jsxRuntime.jsxs("button", { ref: buttonRef, onClick: () => setIsOpen(!isOpen), "aria-expanded": isOpen, className: "flex w-full items-center gap-[11px] rounded-lg px-3 py-1.5 text-left transition-colors hover:bg-sidebar-accent/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sidebar-ring", children: [jsxRuntime.jsxs(erpTheme.Avatar, { className: "size-[34px] shrink-0 rounded-full border-[3px] border-sidebar-accent", children: [user.avatar ? (jsxRuntime.jsx(erpTheme.AvatarImage, { src: user.avatar, alt: user.name })) : null, jsxRuntime.jsx(erpTheme.AvatarFallback, { className: "rounded-full bg-sidebar-accent text-sm font-medium text-sidebar-accent-foreground", children: getInitials(user.name) })] }), jsxRuntime.jsxs("span", { className: "grid min-w-0 flex-1 leading-tight", children: [jsxRuntime.jsx("strong", { className: "truncate text-[13px] font-semibold", title: user.name, children: user.name }), jsxRuntime.jsx("small", { className: "truncate text-[11px] text-muted-foreground", title: user.email, children: user.email })] }), jsxRuntime.jsx(lucideReact.ChevronsUpDown, { className: "size-3.5 shrink-0 text-muted-foreground" })] }), typeof window !== "undefined" &&
-                        reactDom.createPortal(dropdownContent, document.body)] }) }));
+}
+function closeHelp() {
+    pendingRef = null;
+    if (open) {
+        open = false;
+        emit();
     }
-    return (jsxRuntime.jsx("div", { className: "p-2", children: jsxRuntime.jsxs("div", { className: "relative", children: [jsxRuntime.jsxs("button", { ref: buttonRef, onClick: () => setIsOpen(!isOpen), className: "flex w-full items-center gap-2 p-2 rounded-md transition-colors", children: [jsxRuntime.jsxs(erpTheme.Avatar, { className: "h-8 w-8 rounded-lg", children: [user.avatar ? (jsxRuntime.jsx(erpTheme.AvatarImage, { src: user.avatar, alt: user.name })) : null, jsxRuntime.jsx(erpTheme.AvatarFallback, { className: "rounded-lg bg-primary text-primary-foreground w-8 h-8", children: getInitials(user.name) })] }), jsxRuntime.jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [jsxRuntime.jsx("span", { className: "truncate font-medium", title: user.name, children: user.name }), jsxRuntime.jsx("span", { className: "truncate text-xs text-sidebar-foreground/70", title: user.email, children: user.email })] }), jsxRuntime.jsx(lucideReact.ChevronUp, { className: `ml-auto size-4 transition-transform ${isOpen ? "rotate-180" : ""}` })] }), typeof window !== "undefined" &&
-                    reactDom.createPortal(dropdownContent, document.body)] }) }));
 }
-
+/** Opens the dialog on one of the person's messages, by id or "H1004". */
+function openHelpOn(ref) {
+    pendingRef = ref;
+    open = true;
+    emit();
+}
+/** The message the dialog was asked to open on, if it has not been left. */
+function pendingHelpRef() {
+    return pendingRef;
+}
+/** The dialog moved on from the message it was opened on. */
+function clearPendingHelpRef() {
+    pendingRef = null;
+}
 /**
- * Plan feature keys (billable entitlements). Mirror of platform-apis plan.go.
- *
- * This lives in the shell because every app gates on the same keys, and five
- * private copies of the same list drift: the app-switcher list did exactly
- * that before it moved here.
+ * Called by the dialog host on mount; returns its unmount. A host that
+ * mounts while a message is waiting to be shown (a page that mounted its
+ * layout twice) opens the dialog again.
  */
-const PLAN_FEATURES = {
-    ORG_CHART: "org_chart",
-    APPROVAL_WORKFLOW: "approval_workflow",
-    API_ACCESS: "api_access",
-    SSO: "sso",
-    BASIC_ACCOUNTING_HR: "basic_accounting_hr",
-    MODULE_PLATFORM: "module.platform",
-    MODULE_HR: "module.hr",
-    MODULE_ACCOUNTING: "module.accounting",
-    MODULE_SALES: "module.sales",
-    MODULE_PURCHASING: "module.purchasing",
-    MODULE_INVENTORY: "module.inventory",
-    MODULE_PROJECT: "module.project",
-    MODULE_SECRETARIAT: "module.secretariat",
-    /** AI pack (paid or trial): AI calls on AntNiti's key while credits remain. */
-    AI: "ai",
-};
-/** Keys the Accounx add-on carries with it (same alias as org_effective_features). */
-const ACCOUNTING_SUB_KEYS = [
-    PLAN_FEATURES.MODULE_SALES,
-    PLAN_FEATURES.MODULE_PURCHASING,
-    PLAN_FEATURES.MODULE_SECRETARIAT,
-];
+function registerHelpHost() {
+    hosts += 1;
+    if (pendingRef)
+        open = true;
+    emit();
+    return () => {
+        hosts -= 1;
+        if (hosts <= 0) {
+            hosts = 0;
+            open = false;
+        }
+        emit();
+    };
+}
+function useHelpOpen() {
+    return React.useSyncExternalStore(subscribe, () => open, () => false);
+}
+/** True while a dialog host is mounted, i.e. the ช่วยเหลือ entry works. */
+function useHelpAvailable() {
+    return React.useSyncExternalStore(subscribe, () => hosts > 0, () => false);
+}
 /**
- * True when plan features include key. Aliases, mirroring the backend:
- * legacy basic_accounting_hr → module.hr + module.accounting (+ its sub-keys);
- * module.accounting → module.sales, module.purchasing, module.secretariat.
+ * Every app names itself when it builds its app-switcher links
+ * (buildSystemLinks({ activeApp })); the dialog reads that to say which app
+ * a message came from without each app passing it again.
  */
-function hasPlanFeature(features, feature) {
-    if (!features?.length)
-        return false;
-    if (features.includes(feature))
-        return true;
-    if ((feature === PLAN_FEATURES.MODULE_HR ||
-        feature === PLAN_FEATURES.MODULE_ACCOUNTING ||
-        ACCOUNTING_SUB_KEYS.includes(feature)) &&
-        features.includes(PLAN_FEATURES.BASIC_ACCOUNTING_HR)) {
-        return true;
-    }
-    if (ACCOUNTING_SUB_KEYS.includes(feature) &&
-        features.includes(PLAN_FEATURES.MODULE_ACCOUNTING)) {
-        return true;
-    }
-    if (feature === PLAN_FEATURES.BASIC_ACCOUNTING_HR &&
-        features.includes(PLAN_FEATURES.MODULE_HR) &&
-        features.includes(PLAN_FEATURES.MODULE_ACCOUNTING)) {
-        return true;
-    }
-    return false;
+function declareHelpApp(app) {
+    declaredApp = app;
 }
-
-function normaliseBase(value, fallback) {
-    return (value ?? fallback).replace(/\/$/, "");
+function declaredHelpApp() {
+    return declaredApp;
 }
+
 /**
- * One list, in display order, for the whole suite.
+ * The caller's roles in the current organisation, as platform-api answers
+ * GET /organizations/:id/my-roles, and how the user card words them.
  *
- * It used to be copied into every app's own nav-user.tsx, which is how Invenx
- * shipped without a link to Plannex: five copies, one of them edited by hand.
- * Adding the sixth app is now a change here plus a version bump.
+ * No runtime imports: the tests run this file in Node as it is.
  */
-const APPS = [
-    {
-        id: "platform",
-        label: "แพลตฟอร์ม",
-        icon: jsxRuntime.jsx(lucideReact.Building2, { className: "h-4 w-4 shrink-0" }),
-        features: null,
-        baseUrl: () => normaliseBase(process.env.NEXT_PUBLIC_PLATFORM_URL, "https://platform.antniti.com"),
-    },
-    {
-        id: "accounx",
-        label: "Accounx",
-        icon: jsxRuntime.jsx(lucideReact.Calculator, { className: "h-4 w-4 shrink-0" }),
-        features: [PLAN_FEATURES.MODULE_ACCOUNTING],
-        baseUrl: () => normaliseBase(process.env.NEXT_PUBLIC_ACCOUNTING_URL, "https://accounx.antniti.com"),
-    },
-    {
-        id: "invenx",
-        label: "Invenx",
-        icon: jsxRuntime.jsx(lucideReact.Warehouse, { className: "h-4 w-4 shrink-0" }),
-        features: [PLAN_FEATURES.MODULE_INVENTORY],
-        baseUrl: () => normaliseBase(process.env.NEXT_PUBLIC_INVENX_URL, "https://invenx.antniti.com"),
-    },
-    {
-        id: "plannex",
-        label: "Plannex",
-        icon: jsxRuntime.jsx(lucideReact.FolderKanban, { className: "h-4 w-4 shrink-0" }),
-        // Tasks, day-logs and work records are free with HR; projects need the add-on.
-        features: [PLAN_FEATURES.MODULE_HR, PLAN_FEATURES.MODULE_PROJECT],
-        baseUrl: () => normaliseBase(process.env.NEXT_PUBLIC_PLANNEX_URL, "https://plannex.antniti.com"),
-    },
-    {
-        id: "peoplx",
-        label: "Peoplx",
-        icon: jsxRuntime.jsx(lucideReact.Users, { className: "h-4 w-4 shrink-0" }),
-        features: [PLAN_FEATURES.MODULE_HR],
-        baseUrl: () => normaliseBase(process.env.NEXT_PUBLIC_HR_URL, "https://peoplx.antniti.com"),
-    },
-];
+/** The owner's chip. Ownership is a flag, not a role. */
+const OWNER_CHIP = "เจ้าของ";
+/** How many role names the card spells out before counting the rest. */
+const CARD_ROLE_LIMIT = 2;
+const isRecord = (v) => typeof v === "object" && v !== null && !Array.isArray(v);
 /**
- * Builds the cross-app link list for <NavUser systemLinks>.
- *
- * The current app is always present even when the org's plan no longer covers
- * it — the user is looking at it, so hiding the link would only make the menu
- * disagree with the screen.
+ * The answer, checked. Anything that is not the shape the card needs — an
+ * older API, a proxy's error page, another organisation's answer — is null,
+ * and the card shows no role line.
  */
-function buildSystemLinks({ orgCode, activeApp, features, }) {
-    if (!orgCode)
-        return [];
-    return APPS.filter(app => app.id === activeApp ||
-        app.features === null ||
-        app.features.some(key => hasPlanFeature(features, key))).map(app => ({
-        label: app.label,
-        icon: app.icon,
-        // Same-app link stays relative so it never leaves the current origin.
-        href: app.id === activeApp ? `/${orgCode}` : `${app.baseUrl()}/${orgCode}`,
-        ...(app.id === activeApp ? { active: true } : {}),
-    }));
-}
-
-// Helper function to check if pathname matches a URL pattern
-// This prevents false matches like /reports/sales matching /sales
-// Handles paths with or without [code] prefix
+function parseMyRoles(payload, organizationId) {
+    if (!isRecord(payload))
+        return null;
+    // Envelope { success, data } or the bare data.
+    const data = isRecord(payload.data) ? payload.data : payload;
+    if (!Array.isArray(data.roles))
+        return null;
+    if (typeof data.organization_id === "string" && data.organization_id !== organizationId) {
+        return null;
+    }
+    const roles = [];
+    const seen = new Set();
+    for (const r of data.roles) {
+        if (!isRecord(r))
+            continue;
+        const name = typeof r.name_th === "string" ? r.name_th.trim() : "";
+        const key = typeof r.key === "string" ? r.key : "";
+        // A role with no name is left out, never shown by its key.
+        if (!name || seen.has(name))
+            continue;
+        seen.add(name);
+        roles.push({
+            key,
+            name_th: name,
+            app: typeof r.app === "string" ? r.app : "",
+            kind: typeof r.kind === "string" ? r.kind : "",
+        });
+    }
+    return { organizationId, isOwner: data.is_owner === true, roles };
+}
+/** The card names the first two roles and counts the rest. */
+function cardRoleLine(roles, limit = CARD_ROLE_LIMIT) {
+    const names = roles.map(r => r.name_th);
+    return { shown: names.slice(0, limit), more: Math.max(0, names.length - limit) };
+}
+/** Everything, for the tooltip: "เจ้าของ · ผู้ดูแลสูงสุด · พนักงานทั่วไป". */
+function roleSummary(my) {
+    return [...(my.isOwner ? [OWNER_CHIP] : []), ...my.roles.map(r => r.name_th)].join(" · ");
+}
+/** Whether there is anything to show at all. */
+function hasRoleLine(my) {
+    return !!my && (my.isOwner || my.roles.length > 0);
+}
+
+const TOKEN_TTL_MS = 30000;
+let cachedToken = null;
+let cachedAt = 0;
+let inFlightTokenPromise = null;
+const readSessionToken = async () => {
+    const response = await fetch("/api/auth/session", {
+        credentials: "include",
+        cache: "no-store",
+    });
+    if (!response.ok)
+        return null;
+    const session = (await response.json());
+    return session.accessToken ?? null;
+};
+const getAccessToken = async (forceRefresh = false) => {
+    const now = Date.now();
+    if (!forceRefresh && cachedToken && now - cachedAt < TOKEN_TTL_MS) {
+        return cachedToken;
+    }
+    if (!inFlightTokenPromise) {
+        inFlightTokenPromise = readSessionToken()
+            .then(token => {
+            cachedToken = token;
+            cachedAt = Date.now();
+            return token;
+        })
+            .finally(() => {
+            inFlightTokenPromise = null;
+        });
+    }
+    return inFlightTokenPromise;
+};
+const clearAccessTokenCache = () => {
+    cachedToken = null;
+    cachedAt = 0;
+};
+
+class ApiError extends Error {
+    constructor(message, options) {
+        super(message);
+        Object.defineProperty(this, "status", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "code", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "field", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "details", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        this.name = "ApiError";
+        this.status = options?.status;
+        this.code = options?.code;
+        this.field = options?.field;
+        this.details = options?.details;
+    }
+}
+const toApiError = (error) => {
+    if (error instanceof ApiError)
+        return error;
+    if (axios.isAxiosError(error)) {
+        const axiosErr = error;
+        const message = axiosErr.response?.data?.message ||
+            axiosErr.response?.data?.error ||
+            axiosErr.message ||
+            "Request failed";
+        return new ApiError(message, {
+            status: axiosErr.response?.status,
+            code: axiosErr.response?.data?.code,
+            field: axiosErr.response?.data?.field,
+            details: axiosErr.response?.data?.details,
+        });
+    }
+    if (error instanceof Error) {
+        return new ApiError(error.message);
+    }
+    return new ApiError(String(error));
+};
+
+const isPlainObject = (value) => Object.prototype.toString.call(value) === "[object Object]";
+const visit = (value, cb) => {
+    if (Array.isArray(value)) {
+        value.forEach(item => visit(item, cb));
+        return;
+    }
+    if (!isPlainObject(value)) {
+        return;
+    }
+    cb(value);
+    Object.values(value).forEach(item => visit(item, cb));
+};
+const validateGoodsReceiptChecks = (data) => {
+    let invalidPath = null;
+    const isCheckStatus = (v) => v === undefined || v === null || v === "pass" || v === "fail";
+    const isCompareStatus = (v) => v === undefined || v === null || v === "match" || v === "mismatch";
+    visit(data, node => {
+        if (invalidPath)
+            return;
+        if ("quantity_check" in node && !isCheckStatus(node.quantity_check)) {
+            invalidPath = "quantity_check";
+            return;
+        }
+        if ("quality_check" in node && !isCheckStatus(node.quality_check)) {
+            invalidPath = "quality_check";
+            return;
+        }
+        if ("compare_with_reference" in node &&
+            !isCompareStatus(node.compare_with_reference)) {
+            invalidPath = "compare_with_reference";
+        }
+    });
+    if (invalidPath) {
+        return {
+            valid: false,
+            message: "รูปแบบข้อมูลไม่ถูกต้อง: ฟิลด์ตรวจรับต้องเป็น enum string (quantity/quality: pass|fail, compare: match|mismatch)",
+        };
+    }
+    return { valid: true };
+};
+const runGlobalRequestPrecheck = (config) => {
+    const method = (config.method || "get").toLowerCase();
+    const isWriteMethod = ["post", "put", "patch"].includes(method);
+    if (!isWriteMethod || config.data === undefined || config.data === null) {
+        return { valid: true };
+    }
+    if (typeof FormData !== "undefined" && config.data instanceof FormData) {
+        return { valid: true };
+    }
+    return validateGoodsReceiptChecks(config.data);
+};
+
+const isBrowser = () => typeof window !== "undefined";
+const isAuthEndpoint = (url) => !!url && url.includes("/api/auth/");
+const isAuthPage = () => isBrowser() && window.location.pathname.startsWith("/auth/");
+const getOrgFromCookie = () => {
+    if (!isBrowser())
+        return null;
+    const cookies = document.cookie.split(";").map(cookie => cookie.trim());
+    const orgCookie = cookies.find(cookie => cookie.startsWith("erp.organizationId="));
+    if (!orgCookie)
+        return null;
+    const raw = orgCookie.substring("erp.organizationId=".length);
+    return raw ? decodeURIComponent(raw) : null;
+};
+const redirectToLogout = async () => {
+    if (!isBrowser() || isAuthPage())
+        return;
+    localStorage.clear();
+    sessionStorage.clear();
+    setOrganizationId(null);
+    clearAccessTokenCache();
+    await react.signOut({ callbackUrl: "/auth/signin" });
+};
+const instance = axios.create({
+    baseURL: process.env.NEXT_PUBLIC_API_URL,
+    headers: { "Content-Type": "application/json" },
+    paramsSerializer: params => {
+        const searchParams = new URLSearchParams();
+        Object.entries(params || {}).forEach(([key, value]) => {
+            if (Array.isArray(value)) {
+                value.forEach(v => searchParams.append(key, String(v)));
+            }
+            else if (value !== undefined && value !== null) {
+                searchParams.append(key, String(value));
+            }
+        });
+        return searchParams.toString();
+    },
+});
+instance.interceptors.request.use(async (config) => {
+    if (!config.headers) {
+        config.headers = new axios.AxiosHeaders();
+    }
+    if (config.data instanceof FormData && config.headers) {
+        delete config.headers["Content-Type"];
+    }
+    if (!isBrowser())
+        return config;
+    const token = await getAccessToken(false);
+    if (token) {
+        config.headers.Authorization = `Bearer ${token}`;
+    }
+    // localStorage first, cookie second.
+    //
+    // Both are written by the same state machine, but not at the same moment:
+    // setOrganizationId writes localStorage synchronously and then awaits a
+    // server action for the cookie. Preferring the cookie meant every request
+    // fired during that round trip carried the previous organisation — while
+    // the query params, built from React state, already carried the new one.
+    //
+    // The backend scopes by this header and ignores organization_id in the
+    // query, so those requests asked for organisation A and were handed B, and
+    // the answer landed in the cache under A's key. No amount of cache clearing
+    // reaches that: the entry is wrong, not stale.
+    const organizationId = getOrganizationId() || getOrgFromCookie();
+    if (organizationId) {
+        config.headers["X-Organization-ID"] = organizationId;
+    }
+    const precheck = runGlobalRequestPrecheck(config);
+    if (!precheck.valid) {
+        throw new ApiError(precheck.message || "Invalid request payload");
+    }
+    return config;
+});
+let refreshPromise = null;
+const refreshTokenSingleFlight = async () => {
+    if (!refreshPromise) {
+        refreshPromise = getAccessToken(true).finally(() => {
+            refreshPromise = null;
+        });
+    }
+    return refreshPromise;
+};
+instance.interceptors.response.use(response => {
+    // Any successful call means the session can act in this organisation
+    // after all. Without this the gate, once raised, stayed up through a
+    // whole working session — including the seconds between an administrator
+    // adding somebody and the employee record existing.
+    if (typeof window !== "undefined") {
+        window.dispatchEvent(new CustomEvent("erp:employee-record-ok"));
+    }
+    return response;
+}, async (error) => {
+    const originalRequest = error.config;
+    const requestUrl = originalRequest?.url || error.config?.url;
+    if (error.response?.status === 401 &&
+        originalRequest &&
+        !originalRequest._retry &&
+        !isAuthEndpoint(requestUrl) &&
+        !isAuthPage()) {
+        originalRequest._retry = true;
+        const newToken = await refreshTokenSingleFlight();
+        if (newToken && originalRequest.headers) {
+            originalRequest.headers.Authorization = `Bearer ${newToken}`;
+            return instance(originalRequest);
+        }
+        await redirectToLogout();
+        return Promise.reject(toApiError(error));
+    }
+    // The server refuses every organisation-scoped call when the account has
+    // no employee record. Announce it once so a gate can explain it, instead
+    // of letting each failed query raise its own toast.
+    if (error.response?.status === 403) {
+        const body = error.response.data;
+        if (body?.code === "EMPLOYEE_RECORD_REQUIRED" && typeof window !== "undefined") {
+            window.dispatchEvent(new CustomEvent("erp:employee-record-required"));
+        }
+    }
+    return Promise.reject(toApiError(error));
+});
+
+/**
+ * Where platform-api is, for the calls the shell itself makes to it (the
+ * help channel, the user card's roles). Every app already calls it with the
+ * user's token and the organisation header, and its CORS admits every app.
+ */
+const DEFAULT_PLATFORM_API_URL = "https://platform-api.antniti.com/api/v1";
+function platformApiBase(app) {
+    const explicit = process.env.NEXT_PUBLIC_PLATFORM_API_URL?.trim();
+    if (explicit)
+        return explicit.replace(/\/$/, "");
+    // Platform's own API is platform-api.
+    if (app === "platform") {
+        const own = process.env.NEXT_PUBLIC_API_URL?.trim();
+        if (own)
+            return own.replace(/\/$/, "");
+    }
+    return DEFAULT_PLATFORM_API_URL;
+}
+
+/**
+ * This package's version, attached to help messages so the back office can
+ * tell which shell a report came from. Keep in step with package.json.
+ */
+const SHELL_VERSION = "0.1.53";
+
+const HELP_APP_LABEL = {
+    platform: "แพลตฟอร์ม",
+    accounx: "Accounx",
+    peoplx: "Peoplx",
+    plannex: "Plannex",
+    invenx: "Invenx",
+    other: "อื่น ๆ",
+};
+function originOf(value) {
+    if (!value)
+        return null;
+    try {
+        return new URL(value).origin;
+    }
+    catch {
+        return null;
+    }
+}
+/**
+ * Which app this page is: what the host said, what the app declared to the
+ * app switcher, then the production sub-domain, then the app URLs the build
+ * was given (local development). "other" when none of them tells.
+ */
+function detectHelpApp(explicit) {
+    if (explicit)
+        return explicit;
+    const declared = declaredHelpApp();
+    if (declared)
+        return declared;
+    if (typeof window === "undefined")
+        return "other";
+    const host = window.location.hostname.toLowerCase();
+    if (/^(accounx|erp|www\.erp)\./.test(host))
+        return "accounx";
+    if (/^(peoplx|hr)\./.test(host))
+        return "peoplx";
+    if (host.startsWith("plannex."))
+        return "plannex";
+    if (host.startsWith("invenx."))
+        return "invenx";
+    if (host.startsWith("platform.") || host === "antniti.com" || host === "www.antniti.com") {
+        return "platform";
+    }
+    const here = window.location.origin;
+    const configured = [
+        ["platform", process.env.NEXT_PUBLIC_PLATFORM_URL],
+        ["accounx", process.env.NEXT_PUBLIC_ACCOUNTING_URL],
+        ["invenx", process.env.NEXT_PUBLIC_INVENX_URL],
+        ["plannex", process.env.NEXT_PUBLIC_PLANNEX_URL],
+        ["peoplx", process.env.NEXT_PUBLIC_HR_URL],
+    ];
+    for (const [id, url] of configured) {
+        if (originOf(url) === here)
+            return id;
+    }
+    return "other";
+}
+/** "Chrome 141" and "macOS" from a user agent — enough to reproduce. */
+function describeBrowser(ua) {
+    const pick = (re) => ua.match(re)?.[1] ?? "";
+    let browser = "";
+    if (/\bLine\//i.test(ua))
+        browser = `LINE ${pick(/\bLine\/([\d.]+)/i)}`;
+    else if (/\bEdg(A|iOS)?\//.test(ua))
+        browser = `Edge ${pick(/\bEdg(?:A|iOS)?\/(\d+)/)}`;
+    else if (/\bOPR\//.test(ua))
+        browser = `Opera ${pick(/\bOPR\/(\d+)/)}`;
+    else if (/SamsungBrowser\//.test(ua))
+        browser = `Samsung Internet ${pick(/SamsungBrowser\/(\d+)/)}`;
+    else if (/\b(Firefox|FxiOS)\//.test(ua))
+        browser = `Firefox ${pick(/\b(?:Firefox|FxiOS)\/(\d+)/)}`;
+    else if (/\bCriOS\//.test(ua))
+        browser = `Chrome ${pick(/\bCriOS\/(\d+)/)}`;
+    else if (/(\b|Headless)Chrome\//.test(ua))
+        browser = `Chrome ${pick(/(?:\b|Headless)Chrome\/(\d+)/)}`;
+    else if (/\bSafari\//.test(ua))
+        browser = `Safari ${pick(/\bVersion\/([\d.]+)/)}`;
+    let platform = "";
+    if (/\b(iPhone|iPad|iPod)\b/.test(ua)) {
+        platform = `iOS ${pick(/\bOS (\d+[_\d]*)/).replace(/_/g, ".")}`;
+    }
+    else if (/\bAndroid\b/.test(ua)) {
+        platform = `Android ${pick(/\bAndroid ([\d.]+)/)}`;
+    }
+    else if (/\bWindows\b/.test(ua)) {
+        platform = "Windows";
+    }
+    else if (/\bMac OS X\b/.test(ua)) {
+        platform = "macOS";
+    }
+    else if (/\bCrOS\b/.test(ua)) {
+        platform = "ChromeOS";
+    }
+    else if (/\bLinux\b/.test(ua)) {
+        platform = "Linux";
+    }
+    return { browser: browser.trim(), platform: platform.trim() };
+}
+/**
+ * The deployed build: NEXT_PUBLIC_APP_VERSION when the app sets one, else
+ * the Next build id in the page's own script paths (the build time, as every
+ * app's generateBuildId writes it).
+ */
+function readAppVersion() {
+    const declared = process.env.NEXT_PUBLIC_APP_VERSION?.trim();
+    if (declared)
+        return declared;
+    if (typeof document === "undefined")
+        return "";
+    const ignore = new Set(["chunks", "css", "media", "development", "webpack"]);
+    for (const s of Array.from(document.querySelectorAll("script[src]"))) {
+        const m = s.src.match(/\/_next\/static\/([^/]+)\//);
+        if (m && !ignore.has(m[1]))
+            return m[1];
+    }
+    return "";
+}
+function pageUrl() {
+    if (typeof window === "undefined")
+        return "";
+    const { origin, pathname, search } = window.location;
+    return `${origin}${pathname}${search}`;
+}
+/** Everything attached to a message, read at the moment it is sent. */
+function collectHelpContext(orgCode) {
+    if (typeof window === "undefined")
+        return { shell_version: SHELL_VERSION };
+    const { browser, platform } = describeBrowser(window.navigator.userAgent || "");
+    let timeZone = "";
+    try {
+        timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone || "";
+    }
+    catch {
+        timeZone = "";
+    }
+    const ctx = {
+        page_url: pageUrl(),
+        page_title: document.title || undefined,
+        org_code: orgCode || undefined,
+        app_version: readAppVersion() || undefined,
+        shell_version: SHELL_VERSION,
+        browser: browser || undefined,
+        platform: platform || undefined,
+        screen: `${window.screen.width}x${window.screen.height}`,
+        viewport: `${window.innerWidth}x${window.innerHeight}`,
+        language: window.navigator.language || undefined,
+        time_zone: timeZone || undefined,
+    };
+    return ctx;
+}
+/** The short line under the form, "ข้อมูลที่แนบ: …". */
+function describeAttached(app, ctx, email) {
+    let path = "";
+    if (ctx.page_url) {
+        try {
+            path = new URL(ctx.page_url).pathname;
+        }
+        catch {
+            path = ctx.page_url;
+        }
+    }
+    // The organisation code is shown on its own; the path after it says where.
+    if (ctx.org_code && path.startsWith(`/${ctx.org_code}`)) {
+        path = path.slice(ctx.org_code.length + 1);
+    }
+    if (path === "/")
+        path = "";
+    const browser = [ctx.browser, ctx.platform && `(${ctx.platform})`].filter(Boolean).join(" ");
+    return [
+        HELP_APP_LABEL[app],
+        ctx.org_code,
+        path,
+        email || undefined,
+        browser || undefined,
+        ctx.app_version,
+    ]
+        .filter(Boolean)
+        .join(" · ");
+}
+
+const myRolesQueryKey = (organizationId) => ["erp-shell", "my-roles", organizationId];
+// Only for a host that renders NavUser outside a QueryClientProvider: the
+// card still works there instead of throwing.
+let fallbackClient = null;
+function useShellQueryClient() {
+    const provided = React.useContext(reactQuery.QueryClientContext);
+    if (provided)
+        return provided;
+    fallbackClient ?? (fallbackClient = new reactQuery.QueryClient());
+    return fallbackClient;
+}
+function subscribeStorage(onChange) {
+    window.addEventListener("storage", onChange);
+    return () => window.removeEventListener("storage", onChange);
+}
+/**
+ * The organisation the API client sends (X-Organization-ID). Null while
+ * server-rendering and hydrating, so the first client render matches the
+ * server's.
+ */
+function useStoredOrganizationId() {
+    return React.useSyncExternalStore(subscribeStorage, getOrganizationId, () => null);
+}
+/**
+ * The signed-in person's roles in an organisation, from platform-api
+ * (GET /organizations/:id/my-roles). Cached per organisation; a different
+ * organisation is a different query. A failure, or an API too old to have
+ * the route, leaves `data` empty — the caller shows nothing.
+ */
+function useMyRoles(organizationId, enabled = true) {
+    const orgId = organizationId !== null &&
+        organizationId !== undefined &&
+        String(organizationId).trim() !== ""
+        ? String(organizationId).trim()
+        : null;
+    const client = useShellQueryClient();
+    return reactQuery.useQuery({
+        queryKey: myRolesQueryKey(orgId),
+        queryFn: async ({ signal }) => {
+            const base = platformApiBase(detectHelpApp());
+            const res = await instance.get(`${base}/organizations/${encodeURIComponent(orgId)}/my-roles`, { signal });
+            return parseMyRoles(res.data, orgId);
+        },
+        enabled: enabled && orgId !== null,
+        staleTime: 60000,
+        gcTime: 30 * 60000,
+        // A refusal or a missing route will not be different a second later;
+        // the next focus or organisation change asks again.
+        retry: false,
+        refetchOnWindowFocus: true,
+    }, client);
+}
+
+/** The owner's chip: the app's accent, tinted. */
+function OwnerChip({ size = "card" }) {
+    return (jsxRuntime.jsx("span", { className: size === "menu"
+            ? "inline-flex shrink-0 items-center rounded-md bg-primary/10 px-2 py-0.5 text-xs font-semibold text-primary"
+            : "inline-flex shrink-0 items-center rounded-full bg-primary/10 px-1.5 text-[11px] font-semibold leading-[17px] text-primary", children: OWNER_CHIP }));
+}
+/**
+ * The card's role line: the owner's chip, then two role names and a count of
+ * the rest. Wraps between names rather than inside one, and truncates a name
+ * that is wider than the card on its own; the tooltip has everything.
+ */
+function CardRoles({ my, className }) {
+    const { shown, more } = cardRoleLine(my.roles);
+    return (jsxRuntime.jsxs("span", { className: `flex min-w-0 flex-wrap items-center gap-x-1 gap-y-0.5 ${className}`, title: roleSummary(my), children: [my.isOwner ? jsxRuntime.jsx(OwnerChip, {}) : null, shown.map((name, i) => {
+                const last = i === shown.length - 1;
+                return (jsxRuntime.jsxs("span", { className: "flex min-w-0 max-w-full items-baseline", children: [jsxRuntime.jsx("span", { className: "truncate", children: name }), !last ? (jsxRuntime.jsx("span", { "aria-hidden": "true", className: "shrink-0 pl-1 opacity-60", children: "\u00B7" })) : null, last && more > 0 ? (jsxRuntime.jsxs("span", { className: "shrink-0 pl-1 opacity-70", children: ["+", more] })) : null] }, name));
+            })] }));
+}
+/** Every role in full, for the menu. */
+function MenuRoles({ my }) {
+    return (jsxRuntime.jsxs("div", { className: "flex flex-wrap gap-1.5", children: [my.isOwner ? jsxRuntime.jsx(OwnerChip, { size: "menu" }) : null, my.roles.map(r => (jsxRuntime.jsx("span", { className: "rounded-md border border-sidebar-border px-2 py-0.5 text-xs text-sidebar-foreground", children: r.name_th }, r.key || r.name_th)))] }));
+}
+function isExternalHref(href) {
+    return /^https?:\/\//i.test(href) || href.startsWith("//");
+}
+function NavUser({ organization, avatarSrc, profileHref, selectOrganizationHref = "/select-organization", signInRedirectHref = "/auth/signin", systemLinks, showSelectOrganization = true, showLanguageSwitch = true, variant = "brand", showRoles, organizationId, } = {}) {
+    const { data: session, status } = react.useSession();
+    const storedOrganizationId = useStoredOrganizationId();
+    const rolesOrganizationId = organizationId !== null &&
+        organizationId !== undefined &&
+        String(organizationId).trim() !== ""
+        ? organizationId
+        : storedOrganizationId;
+    const rolesOn = (showRoles ?? showSelectOrganization) && status === "authenticated";
+    const { data: rolesData, fetchStatus: rolesFetchStatus } = useMyRoles(rolesOrganizationId, rolesOn);
+    const myRoles = rolesOn && hasRoleLine(rolesData) ? rolesData : null;
+    // First load only: hold the line's place so the card does not jump when
+    // the roles arrive. A failure drops it.
+    const rolesLoading = rolesOn && !!rolesOrganizationId && rolesData === undefined && rolesFetchStatus === "fetching";
+    // With a role line the card is three lines or more: the chevron moves up
+    // to the name so the lines under it get the card's full width.
+    const cardTall = !!myRoles || rolesLoading;
+    const router = navigation.useRouter();
+    const { theme, setTheme } = nextThemes.useTheme();
+    const [isSigningOut, setIsSigningOut] = React.useState(false);
+    const [isOpen, setIsOpen] = React.useState(false);
+    const [showThemeMenu, setShowThemeMenu] = React.useState(false);
+    const [showLanguageMenu, setShowLanguageMenu] = React.useState(false);
+    const [showAppsMenu, setShowAppsMenu] = React.useState(false);
+    const buttonRef = React.useRef(null);
+    const [position, setPosition] = React.useState({ top: 0, left: 0 });
+    // Shown where a layout has mounted the help dialog (AppLayoutShell).
+    const helpAvailable = useHelpAvailable();
+    const user = session?.user
+        ? {
+            name: session.user.name || "ผู้ใช้",
+            email: session.user.email || "",
+            // avatarSrc first: the NextAuth session carries no picture unless the
+            // host app deliberately puts one in the JWT, so relying on
+            // session.user.image alone left every user on their initials forever.
+            avatar: avatarSrc || session.user.image || undefined,
+        }
+        : null;
+    const getInitials = (name) => {
+        if (!name)
+            return "U";
+        return name
+            .split(" ")
+            .map(n => n[0])
+            .join("")
+            .toUpperCase()
+            .slice(0, 2);
+    };
+    const handleSignOut = async () => {
+        setIsSigningOut(true);
+        try {
+            await react.signOut({ callbackUrl: signInRedirectHref, redirect: true });
+        }
+        catch (error) {
+            console.error("Sign out error:", error);
+            window.location.href = signInRedirectHref;
+        }
+        finally {
+            setIsSigningOut(false);
+        }
+    };
+    const handleSelectOrganization = () => {
+        setIsOpen(false);
+        router.push(selectOrganizationHref);
+    };
+    const handleProfile = () => {
+        setIsOpen(false);
+        if (profileHref)
+            router.push(profileHref);
+    };
+    const handleSystemLink = (href) => {
+        setIsOpen(false);
+        if (isExternalHref(href)) {
+            window.location.assign(href);
+            return;
+        }
+        router.push(href);
+    };
+    const handleThemeChange = (newTheme) => {
+        setTheme(newTheme);
+        setShowThemeMenu(false);
+    };
+    const handleLanguageChange = (language) => {
+        console.log("Change language to:", language);
+        setShowLanguageMenu(false);
+    };
+    React.useEffect(() => {
+        if (isOpen && buttonRef.current) {
+            const rect = buttonRef.current.getBoundingClientRect();
+            setPosition({ top: rect.bottom, left: rect.right + 8 });
+        }
+    }, [isOpen]);
+    React.useEffect(() => {
+        if (!isOpen)
+            return;
+        const handleClickOutside = (event) => {
+            if (buttonRef.current &&
+                !buttonRef.current.contains(event.target) &&
+                !event.target.closest('[data-dropdown="nav-user"]')) {
+                setIsOpen(false);
+            }
+        };
+        document.addEventListener("mousedown", handleClickOutside);
+        return () => document.removeEventListener("mousedown", handleClickOutside);
+    }, [isOpen]);
+    if (status === "loading") {
+        return (jsxRuntime.jsx("div", { className: "p-2", children: jsxRuntime.jsxs("div", { className: "flex items-center gap-2 p-2 rounded-md", children: [jsxRuntime.jsx("div", { className: "h-8 w-8 rounded-lg bg-sidebar-accent animate-pulse" }), jsxRuntime.jsxs("div", { className: "flex-1 space-y-1", children: [jsxRuntime.jsx("div", { className: "h-4 w-24 bg-sidebar-accent rounded animate-pulse" }), jsxRuntime.jsx("div", { className: "h-3 w-32 bg-sidebar-accent rounded animate-pulse" })] })] }) }));
+    }
+    if (!user)
+        return null;
+    const visibleSystemLinks = (systemLinks ?? []).filter(link => link.href && link.label);
+    const dropdownContent = isOpen ? (jsxRuntime.jsxs("div", { "data-dropdown": "nav-user", className: "fixed w-52 sm:w-60 md:w-80 rounded-lg bg-sidebar border border-sidebar-border shadow-xl z-50 overflow-hidden\n                 -translate-x-[65%] -translate-y-[110%] sm:translate-x-0 sm:-translate-y-full", style: { top: `${position.top}px`, left: `${position.left}px` }, children: [organization && (jsxRuntime.jsx("div", { className: "p-4 border-b border-sidebar-border bg-sidebar-accent/30", children: jsxRuntime.jsxs("div", { className: `flex gap-3 ${myRoles ? "items-start" : "items-center"}`, children: [organization.logoUrl ? (
+                        // eslint-disable-next-line @next/next/no-img-element
+                        jsxRuntime.jsx("img", { src: organization.logoUrl, alt: organization.name ?? "โลโก้บริษัท", className: "h-8 w-8 flex-shrink-0 rounded object-contain bg-white", 
+                            // A dead logo URL must not leave a broken-image glyph in the
+                            // sidebar; drop back to the generic icon's empty slot.
+                            onError: e => {
+                                e.currentTarget.style.display = "none";
+                            } })) : (jsxRuntime.jsx(lucideReact.Building2, { className: "h-5 w-5 text-sidebar-foreground/70 flex-shrink-0" })), jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [jsxRuntime.jsx("div", { className: "font-medium text-sm sm:truncate", children: organization.name }), organization.description && (jsxRuntime.jsx("div", { className: "text-xs text-sidebar-foreground/70 truncate mt-0.5", children: organization.description })), myRoles ? (jsxRuntime.jsx("div", { className: "mt-2.5", children: jsxRuntime.jsx(MenuRoles, { my: myRoles }) })) : null] })] }) })), !organization && myRoles ? (jsxRuntime.jsx("div", { className: "p-4 border-b border-sidebar-border bg-sidebar-accent/30", children: jsxRuntime.jsx(MenuRoles, { my: myRoles }) })) : null, jsxRuntime.jsxs("div", { className: "p-2", children: [jsxRuntime.jsxs("div", { className: "relative", children: [jsxRuntime.jsxs("button", { onClick: () => {
+                                    setShowThemeMenu(!showThemeMenu);
+                                    setShowLanguageMenu(false);
+                                    setShowAppsMenu(false);
+                                }, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.Palette, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E40\u0E1B\u0E25\u0E35\u0E48\u0E22\u0E19\u0E18\u0E35\u0E21" }), jsxRuntime.jsx(lucideReact.ChevronUp, { className: `h-4 w-4 transition-transform ${showThemeMenu ? "rotate-180" : ""}` })] }), showThemeMenu && (jsxRuntime.jsx("div", { className: "mt-1 ml-4 space-y-1", children: [
+                                    { key: "light", label: "สว่าง", Icon: lucideReact.Sun },
+                                    { key: "dark", label: "มืด", Icon: lucideReact.Moon },
+                                    { key: "system", label: "ตามระบบ", Icon: lucideReact.Monitor },
+                                ].map(({ key, label, Icon }) => (jsxRuntime.jsxs("button", { onClick: () => handleThemeChange(key), className: "flex w-full items-center gap-3 px-3 py-2 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(Icon, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: label }), theme === key && (jsxRuntime.jsx("div", { className: "h-2 w-2 rounded-full bg-primary" }))] }, key))) }))] }), showLanguageSwitch && (jsxRuntime.jsxs("div", { className: "relative", children: [jsxRuntime.jsxs("button", { onClick: () => {
+                                    setShowLanguageMenu(!showLanguageMenu);
+                                    setShowThemeMenu(false);
+                                    setShowAppsMenu(false);
+                                }, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.Globe, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E40\u0E1B\u0E25\u0E35\u0E48\u0E22\u0E19\u0E20\u0E32\u0E29\u0E32" }), jsxRuntime.jsx(lucideReact.ChevronUp, { className: `h-4 w-4 transition-transform ${showLanguageMenu ? "rotate-180" : ""}` })] }), showLanguageMenu && (jsxRuntime.jsx("div", { className: "mt-1 ml-4 space-y-1", children: [
+                                    { code: "th", label: "ไทย" },
+                                    { code: "en", label: "English" },
+                                    { code: "zh", label: "中文" },
+                                    { code: "ja", label: "日本語" },
+                                ].map(({ code, label }) => (jsxRuntime.jsxs("button", { onClick: () => handleLanguageChange(code), className: "flex w-full items-center gap-3 px-3 py-2 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx("span", { className: "flex-1 text-left", children: label }), organization?.language === code && (jsxRuntime.jsx("div", { className: "h-2 w-2 rounded-full bg-primary" }))] }, code))) }))] })), profileHref && (jsxRuntime.jsxs("button", { onClick: handleProfile, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.User, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E2A\u0E48\u0E27\u0E19\u0E15\u0E31\u0E27" })] })), showSelectOrganization && (jsxRuntime.jsxs("button", { onClick: handleSelectOrganization, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.Building2, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E18\u0E38\u0E23\u0E01\u0E34\u0E08" })] })), visibleSystemLinks.length > 0 && (jsxRuntime.jsxs("div", { className: "relative", children: [jsxRuntime.jsxs("button", { onClick: () => {
+                                    setShowAppsMenu(!showAppsMenu);
+                                    setShowThemeMenu(false);
+                                    setShowLanguageMenu(false);
+                                }, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.LayoutGrid, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E41\u0E2D\u0E1B\u0E1E\u0E25\u0E34\u0E40\u0E04\u0E0A\u0E31\u0E19" }), jsxRuntime.jsx(lucideReact.ChevronUp, { className: `h-4 w-4 transition-transform ${showAppsMenu ? "rotate-180" : ""}` })] }), showAppsMenu && (jsxRuntime.jsx("div", { className: "mt-1 ml-4 space-y-1", children: visibleSystemLinks.map(link => (jsxRuntime.jsxs("button", { type: "button", onClick: () => handleSystemLink(link.href), className: "flex w-full items-center gap-3 px-3 py-2 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [link.icon ?? jsxRuntime.jsx(lucideReact.ExternalLink, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: link.label }), link.active && (jsxRuntime.jsx("div", { className: "h-2 w-2 rounded-full bg-primary" }))] }, `${link.label}:${link.href}`))) }))] })), helpAvailable && (jsxRuntime.jsxs("button", { type: "button", onClick: () => {
+                            setIsOpen(false);
+                            openHelp();
+                        }, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors", children: [jsxRuntime.jsx(lucideReact.CircleHelp, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D" })] })), jsxRuntime.jsx("button", { onClick: handleSignOut, disabled: isSigningOut, className: "flex w-full items-center gap-3 px-3 py-2.5 text-sm text-sidebar-foreground hover:bg-sidebar-accent rounded-md transition-colors disabled:opacity-50 disabled:cursor-not-allowed mt-1", children: isSigningOut ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 animate-spin" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E2D\u0E2D\u0E01\u0E08\u0E32\u0E01\u0E23\u0E30\u0E1A\u0E1A..." })] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(lucideReact.LogOut, { className: "h-4 w-4" }), jsxRuntime.jsx("span", { className: "flex-1 text-left", children: "\u0E2D\u0E2D\u0E01\u0E08\u0E32\u0E01\u0E23\u0E30\u0E1A\u0E1A" })] })) })] })] })) : null;
+    if (variant === "workspace") {
+        return (jsxRuntime.jsx("div", { className: "mt-3.5 border-t border-sidebar-border pt-3", children: jsxRuntime.jsxs("div", { className: "relative", children: [jsxRuntime.jsxs("button", { ref: buttonRef, onClick: () => setIsOpen(!isOpen), "aria-expanded": isOpen, className: `relative flex w-full gap-[11px] rounded-lg px-3 py-1.5 text-left transition-colors hover:bg-sidebar-accent/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sidebar-ring ${cardTall ? "items-start" : "items-center"}`, children: [jsxRuntime.jsxs(erpTheme.Avatar, { className: "size-[34px] shrink-0 rounded-full border-[3px] border-sidebar-accent", children: [user.avatar ? (jsxRuntime.jsx(erpTheme.AvatarImage, { src: user.avatar, alt: user.name })) : null, jsxRuntime.jsx(erpTheme.AvatarFallback, { className: "rounded-full bg-sidebar-accent text-sm font-medium text-sidebar-accent-foreground", children: getInitials(user.name) })] }), jsxRuntime.jsxs("span", { className: `grid min-w-0 flex-1 leading-tight ${cardTall ? "gap-0.5" : ""}`, children: [jsxRuntime.jsx("strong", { className: `truncate text-[13px] font-semibold ${cardTall ? "pr-5" : ""}`, title: user.name, children: user.name }), myRoles ? (jsxRuntime.jsx(CardRoles, { my: myRoles, className: "text-[12px] font-medium leading-[17px] text-sidebar-foreground/80" })) : rolesLoading ? (jsxRuntime.jsx("span", { className: "my-[3px] block h-[11px] w-20 animate-pulse rounded bg-sidebar-accent" })) : null, jsxRuntime.jsx("small", { className: "truncate text-[11px] text-muted-foreground", title: user.email, children: user.email })] }), jsxRuntime.jsx(lucideReact.ChevronsUpDown, { className: cardTall
+                                    ? "absolute right-3 top-[9px] size-3.5 text-muted-foreground"
+                                    : "size-3.5 shrink-0 text-muted-foreground" })] }), typeof window !== "undefined" &&
+                        reactDom.createPortal(dropdownContent, document.body)] }) }));
+    }
+    return (jsxRuntime.jsx("div", { className: "p-2", children: jsxRuntime.jsxs("div", { className: "relative", children: [jsxRuntime.jsxs("button", { ref: buttonRef, onClick: () => setIsOpen(!isOpen), className: `relative flex w-full gap-2 p-2 rounded-md transition-colors ${cardTall ? "items-start" : "items-center"}`, children: [jsxRuntime.jsxs(erpTheme.Avatar, { className: "h-8 w-8 shrink-0 rounded-lg", children: [user.avatar ? (jsxRuntime.jsx(erpTheme.AvatarImage, { src: user.avatar, alt: user.name })) : null, jsxRuntime.jsx(erpTheme.AvatarFallback, { className: "rounded-lg bg-primary text-primary-foreground w-8 h-8", children: getInitials(user.name) })] }), jsxRuntime.jsxs("div", { className: `grid min-w-0 flex-1 text-left text-sm leading-tight ${cardTall ? "gap-0.5" : ""}`, children: [jsxRuntime.jsx("span", { className: `truncate font-medium ${cardTall ? "pr-6" : ""}`, title: user.name, children: user.name }), myRoles ? (jsxRuntime.jsx(CardRoles, { my: myRoles, className: "text-xs font-medium text-sidebar-foreground/85" })) : rolesLoading ? (jsxRuntime.jsx("span", { className: "my-0.5 block h-3 w-24 animate-pulse rounded bg-sidebar-accent" })) : null, jsxRuntime.jsx("span", { className: "truncate text-xs text-sidebar-foreground/70", title: user.email, children: user.email })] }), jsxRuntime.jsx(lucideReact.ChevronUp, { className: `size-4 transition-transform ${isOpen ? "rotate-180" : ""} ${cardTall ? "absolute right-2 top-2.5" : "ml-auto shrink-0"}` })] }), typeof window !== "undefined" &&
+                    reactDom.createPortal(dropdownContent, document.body)] }) }));
+}
+
+/**
+ * Plan feature keys (billable entitlements). Mirror of platform-apis plan.go.
+ *
+ * This lives in the shell because every app gates on the same keys, and five
+ * private copies of the same list drift: the app-switcher list did exactly
+ * that before it moved here.
+ */
+const PLAN_FEATURES = {
+    ORG_CHART: "org_chart",
+    APPROVAL_WORKFLOW: "approval_workflow",
+    API_ACCESS: "api_access",
+    SSO: "sso",
+    BASIC_ACCOUNTING_HR: "basic_accounting_hr",
+    MODULE_PLATFORM: "module.platform",
+    MODULE_HR: "module.hr",
+    MODULE_ACCOUNTING: "module.accounting",
+    MODULE_SALES: "module.sales",
+    MODULE_PURCHASING: "module.purchasing",
+    MODULE_INVENTORY: "module.inventory",
+    MODULE_PROJECT: "module.project",
+    MODULE_SECRETARIAT: "module.secretariat",
+    /** AI pack (paid or trial): AI calls on AntNiti's key while credits remain. */
+    AI: "ai",
+};
+/** Keys the Accounx add-on carries with it (same alias as org_effective_features). */
+const ACCOUNTING_SUB_KEYS = [
+    PLAN_FEATURES.MODULE_SALES,
+    PLAN_FEATURES.MODULE_PURCHASING,
+    PLAN_FEATURES.MODULE_SECRETARIAT,
+];
+/**
+ * True when plan features include key. Aliases, mirroring the backend:
+ * legacy basic_accounting_hr → module.hr + module.accounting (+ its sub-keys);
+ * module.accounting → module.sales, module.purchasing, module.secretariat.
+ */
+function hasPlanFeature(features, feature) {
+    if (!features?.length)
+        return false;
+    if (features.includes(feature))
+        return true;
+    if ((feature === PLAN_FEATURES.MODULE_HR ||
+        feature === PLAN_FEATURES.MODULE_ACCOUNTING ||
+        ACCOUNTING_SUB_KEYS.includes(feature)) &&
+        features.includes(PLAN_FEATURES.BASIC_ACCOUNTING_HR)) {
+        return true;
+    }
+    if (ACCOUNTING_SUB_KEYS.includes(feature) &&
+        features.includes(PLAN_FEATURES.MODULE_ACCOUNTING)) {
+        return true;
+    }
+    if (feature === PLAN_FEATURES.BASIC_ACCOUNTING_HR &&
+        features.includes(PLAN_FEATURES.MODULE_HR) &&
+        features.includes(PLAN_FEATURES.MODULE_ACCOUNTING)) {
+        return true;
+    }
+    return false;
+}
+
+function normaliseBase(value, fallback) {
+    return (value ?? fallback).replace(/\/$/, "");
+}
+/**
+ * One list, in display order, for the whole suite.
+ *
+ * It used to be copied into every app's own nav-user.tsx, which is how Invenx
+ * shipped without a link to Plannex: five copies, one of them edited by hand.
+ * Adding the sixth app is now a change here plus a version bump.
+ */
+const APPS = [
+    {
+        id: "platform",
+        label: "แพลตฟอร์ม",
+        icon: jsxRuntime.jsx(lucideReact.Building2, { className: "h-4 w-4 shrink-0" }),
+        features: null,
+        baseUrl: () => normaliseBase(process.env.NEXT_PUBLIC_PLATFORM_URL, "https://platform.antniti.com"),
+    },
+    {
+        id: "accounx",
+        label: "Accounx",
+        icon: jsxRuntime.jsx(lucideReact.Calculator, { className: "h-4 w-4 shrink-0" }),
+        features: [PLAN_FEATURES.MODULE_ACCOUNTING],
+        baseUrl: () => normaliseBase(process.env.NEXT_PUBLIC_ACCOUNTING_URL, "https://accounx.antniti.com"),
+    },
+    {
+        id: "invenx",
+        label: "Invenx",
+        icon: jsxRuntime.jsx(lucideReact.Warehouse, { className: "h-4 w-4 shrink-0" }),
+        features: [PLAN_FEATURES.MODULE_INVENTORY],
+        baseUrl: () => normaliseBase(process.env.NEXT_PUBLIC_INVENX_URL, "https://invenx.antniti.com"),
+    },
+    {
+        id: "plannex",
+        label: "Plannex",
+        icon: jsxRuntime.jsx(lucideReact.FolderKanban, { className: "h-4 w-4 shrink-0" }),
+        // Tasks, day-logs and work records are free with HR; projects need the add-on.
+        features: [PLAN_FEATURES.MODULE_HR, PLAN_FEATURES.MODULE_PROJECT],
+        baseUrl: () => normaliseBase(process.env.NEXT_PUBLIC_PLANNEX_URL, "https://plannex.antniti.com"),
+    },
+    {
+        id: "peoplx",
+        label: "Peoplx",
+        icon: jsxRuntime.jsx(lucideReact.Users, { className: "h-4 w-4 shrink-0" }),
+        features: [PLAN_FEATURES.MODULE_HR],
+        baseUrl: () => normaliseBase(process.env.NEXT_PUBLIC_HR_URL, "https://peoplx.antniti.com"),
+    },
+];
+/**
+ * Builds the cross-app link list for <NavUser systemLinks>.
+ *
+ * The current app is always present even when the org's plan no longer covers
+ * it — the user is looking at it, so hiding the link would only make the menu
+ * disagree with the screen.
+ */
+function buildSystemLinks({ orgCode, activeApp, features, }) {
+    // The app names itself here; the help dialog says which app a message
+    // came from by it.
+    declareHelpApp(activeApp);
+    if (!orgCode)
+        return [];
+    return APPS.filter(app => app.id === activeApp ||
+        app.features === null ||
+        app.features.some(key => hasPlanFeature(features, key))).map(app => ({
+        label: app.label,
+        icon: app.icon,
+        // Same-app link stays relative so it never leaves the current origin.
+        href: app.id === activeApp ? `/${orgCode}` : `${app.baseUrl()}/${orgCode}`,
+        ...(app.id === activeApp ? { active: true } : {}),
+    }));
+}
+
+// Helper function to check if pathname matches a URL pattern
+// This prevents false matches like /reports/sales matching /sales
+// Handles paths with or without [code] prefix
 function isPathActive(pathname, url) {
     // Exact match
     if (pathname === url) {
@@ -1341,993 +2053,1556 @@ const WORKSPACE_LIGHT_HEADER_VARS = {
 };
 
 /**
- * Top-level app chrome: sticky header, sidebar slot, content gutter and the
- * session/org-context plumbing that both Accounting and HR need. Apps wrap
- * it inside their `SidebarProvider` (server-rendered with the cookie-backed
- * `defaultOpen`) and their `ERPProvider`, then pass app-specific bits as
- * props.
+ * The ช่วยเหลือ button in the top bar. Drawn in the header's ink (the
+ * --header-* variables of the workspace chrome, white on the brand chrome).
+ */
+function HelpButton({ className }) {
+    return (jsxRuntime.jsx("button", { type: "button", onClick: openHelp, "aria-label": "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D", title: "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D", className: "grid size-[34px] shrink-0 place-items-center rounded-lg text-[var(--header-fg-muted,#ffffffc7)] transition-colors hover:bg-[var(--header-hover,#ffffff1f)] hover:text-[var(--header-fg,#ffffff)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--header-fg-muted,#ffffffc7)]" +
+            (className ? ` ${className}` : ""), children: jsxRuntime.jsx(lucideReact.CircleHelp, { className: "size-5", strokeWidth: 1.65 }) }));
+}
+
+const hasPaginationShape = (payload) => {
+    return ("total" in payload ||
+        "page" in payload ||
+        "per_page" in payload ||
+        "total_pages" in payload ||
+        "has_next" in payload ||
+        "has_prev" in payload ||
+        "pagination" in payload);
+};
+const isEnvelope = (payload) => {
+    return ("success" in payload || "message" in payload) && !hasPaginationShape(payload);
+};
+const unwrapApiResponse = (payload) => {
+    if (!payload || typeof payload !== "object") {
+        return payload;
+    }
+    const record = payload;
+    if ("data" in record &&
+        record.data !== undefined &&
+        isEnvelope(record)) {
+        return record.data;
+    }
+    return payload;
+};
+
+/**
+ * The images on a help message (and on a follow-up): what was added, what is
+ * uploading, what is ready to send, and what was refused and why.
  *
- * The padding contract is deliberately owned here so future style tweaks
- * (e.g. the recent left/right/bottom gutter pass) propagate to both apps via
- * an erp-shell bump — domain components must NOT add their own root padding
- * or content gets indented twice.
+ * Plain state with no React and no network of its own — the uploader is
+ * handed in — so the rules are tested on their own (help-attach.test.ts):
+ * PNG, JPEG, WebP or GIF; at most 5 MB each; at most three; a paste or a drop
+ * adds the same way the file picker does; ส่ง waits for what is uploading.
+ *
+ * Kept free of imports: the tests load it straight from source.
  */
-function AppLayoutShell({ children, sidebar, loadingComponent, breadcrumb, permissionProvider, organizationId, setOrganizationId, organizations, signInUrl, selectOrganizationUrl, chrome = "brand", workspaceHeader = "brand", headerEnd, mobileBrand, }) {
-    const { data: session, status } = react.useSession();
-    const { open, setOpen } = useSidebar();
-    const router = navigation.useRouter();
-    const params = navigation.useParams();
-    const code = params?.code;
-    const extendedSession = session;
-    // Track once-authenticated so a transient accessToken drop during the
-    // periodic session refresh (SessionRefreshTrigger every 4 min) doesn't
-    // blank the whole page. The initial-load gate below still handles cold
-    // start; once we've seen a real token we render children optimistically
-    // and let the API layer surface a real 401 if the token actually died.
-    const hasSeenAccessTokenRef = React.useRef(false);
-    React.useEffect(() => {
-        if (extendedSession?.accessToken)
-            hasSeenAccessTokenRef.current = true;
-    }, [extendedSession?.accessToken]);
-    // Find the org from the URL `[code]` so we can detect a context mismatch
-    // (the user bookmarked a different org than the cookie remembers).
-    const orgFromCode = React__namespace.useMemo(() => {
-        if (!code || !organizations.length)
-            return null;
-        return (organizations.find(org => org.code === code || String(org.id) === code) ?? null);
-    }, [code, organizations]);
-    // Sync state: when the URL code points at a different org than the cookie,
-    // trust the URL and update the cookie. Otherwise do nothing — the user
-    // wins ties via the in-app org switcher.
-    React.useEffect(() => {
-        if (!code)
-            return;
-        if (!organizations.length)
-            return;
-        if (!orgFromCode)
-            return;
-        if (String(organizationId) !== String(orgFromCode.id)) {
-            void setOrganizationId(orgFromCode.id);
+const HELP_IMAGE_TYPES = ["image/png", "image/jpeg", "image/webp", "image/gif"];
+const HELP_IMAGE_ACCEPT = HELP_IMAGE_TYPES.join(",");
+const HELP_IMAGE_MAX_BYTES = 5 * 1024 * 1024;
+const HELP_IMAGE_MAX_COUNT = 3;
+/** The words for each refusal, per file. */
+const HELP_IMAGE_ERRORS = {
+    tooLarge: "ใหญ่เกิน 5 MB",
+    notImage: "ไม่ใช่ไฟล์รูปภาพ (PNG, JPEG, WebP หรือ GIF)",
+    tooMany: "แนบได้ไม่เกิน 3 รูป",
+    failed: "อัปโหลดไม่สำเร็จ",
+};
+/** The declared type, as one of the four, or "". */
+function helpImageType(type) {
+    const t = (type || "").toLowerCase().split(";")[0].trim();
+    if (t === "image/jpg" || t === "image/pjpeg")
+        return "image/jpeg";
+    return HELP_IMAGE_TYPES.includes(t) ? t : "";
+}
+/** Why a file cannot be attached, or null when it can. */
+function checkHelpImage(file) {
+    if (!helpImageType(file.type) || file.size <= 0)
+        return HELP_IMAGE_ERRORS.notImage;
+    if (file.size > HELP_IMAGE_MAX_BYTES)
+        return HELP_IMAGE_ERRORS.tooLarge;
+    return null;
+}
+/**
+ * The files a paste carries, when it is a paste of a picture: a screenshot
+ * or a copied image. A paste that carries text is text — copying a cell from
+ * a spreadsheet also puts a picture of it on the clipboard, and that is not
+ * an attachment.
+ */
+function filesFromPaste(data) {
+    if (!data)
+        return [];
+    const text = data.getData?.("text/plain") ?? "";
+    if (text.trim() !== "")
+        return [];
+    const out = [];
+    if (data.files && data.files.length > 0) {
+        for (let i = 0; i < data.files.length; i++)
+            out.push(data.files[i]);
+        return out;
+    }
+    if (data.items) {
+        for (let i = 0; i < data.items.length; i++) {
+            const it = data.items[i];
+            if (it.kind !== "file")
+                continue;
+            const f = it.getAsFile();
+            if (f)
+                out.push(f);
         }
-    }, [
-        orgFromCode,
-        organizationId,
-        setOrganizationId,
-        code,
-        organizations.length,
-    ]);
-    // Key for the content subtree. It exists so switching organizations throws
-    // away the previous org's component state — but it must react ONLY to a real
-    // switch. organizationId legitimately passes through null while the context
-    // re-settles (session resolving, cookie write in flight), and keying on that
-    // unmounted and remounted the entire page: forms lost their loaded values,
-    // in-flight edits vanished, and settings pickers snapped back to defaults.
-    //
-    // Holding the last known id makes a transient null a no-op while a genuine
-    // org-to-org switch still changes the key.
-    const lastOrgKeyRef = React__namespace.useRef("no-org");
-    const currentOrgKey = organizationId === null ||
-        organizationId === undefined ||
-        String(organizationId).trim() === ""
-        ? null
-        : String(organizationId);
-    if (currentOrgKey !== null) {
-        lastOrgKeyRef.current = currentOrgKey;
-    }
-    const contentOrgKey = lastOrgKeyRef.current;
-    // Hold the page back until the active organisation is the one the URL names.
-    //
-    // The sync effect above writes the cookie through a server action, which is
-    // a round trip. Until it lands, getOrgFromCookie() still answers with the
-    // previous organisation and every request the page fires on mount carries
-    // it — so /O26000021/work-record asked about O26000033 and was correctly
-    // told there was nothing there. An empty table is the mild version: the
-    // create form posts to the same header, so a record could be filed against
-    // a company the user was not looking at.
-    //
-    // Only while the two genuinely disagree. A code naming no organisation of
-    // the caller's is left to the app to refuse, and a page with no code in its
-    // path is unaffected.
-    const orgContextIsStale = !!orgFromCode &&
-        organizationId !== null &&
-        organizationId !== undefined &&
-        String(organizationId) !== String(orgFromCode.id);
-    // ≤1024px: sidebar renders as a modal overlay (backdrop dims content). >1024px:
-    // sidebar is docked and the content gets a left margin to clear it.
-    const [isSidebarModalLayout, setIsSidebarModalLayout] = React__namespace.useState(false);
-    React.useEffect(() => {
-        const mq = window.matchMedia("(max-width: 1024px)");
-        const sync = () => setIsSidebarModalLayout(mq.matches);
-        sync();
-        mq.addEventListener("change", sync);
-        return () => mq.removeEventListener("change", sync);
-    }, []);
-    // Wait for session to load (initial load only). When refetching/updating we
-    // already have a session — don't flash the full-screen loader.
-    if (status === "loading" && !session) {
-        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent });
     }
-    // Session loaded but no accessToken AND we've never seen one → real auth
-    // failure (token refresh gave nothing back on cold start), bounce through
-    // signin. If we HAVE seen one before, the drop is almost certainly the
-    // in-flight periodic refresh (SessionRefreshTrigger). Don't redirect on
-    // that transient — the JWT callback will settle in a moment and API
-    // calls will keep working with the still-valid cookie.
-    if (status === "authenticated" &&
-        !extendedSession?.accessToken &&
-        !hasSeenAccessTokenRef.current) {
-        if (typeof window !== "undefined") {
-            const url = new URL(signInUrl, window.location.origin);
-            url.searchParams.set("error", "NoAccessToken");
-            url.searchParams.set("callbackUrl", window.location.pathname);
-            window.location.href = url.toString();
+    return out;
+}
+/** True while what is dragged over the dialog includes files. */
+function dragHasFiles(dt) {
+    if (!dt?.types)
+        return false;
+    for (let i = 0; i < dt.types.length; i++)
+        if (dt.types[i] === "Files")
+            return true;
+    return false;
+}
+/** The files a drop carries. */
+function filesFromDrop(dt) {
+    const out = [];
+    if (!dt?.files)
+        return out;
+    for (let i = 0; i < dt.files.length; i++)
+        out.push(dt.files[i]);
+    return out;
+}
+let seq = 0;
+/**
+ * The images being attached to one message. Subscribe to redraw; every
+ * change replaces items and rejections with new arrays.
+ */
+class HelpAttachments {
+    constructor(uploader, opts = {}) {
+        Object.defineProperty(this, "list", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: []
+        });
+        Object.defineProperty(this, "refused", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: []
+        });
+        Object.defineProperty(this, "listeners", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Set()
+        });
+        Object.defineProperty(this, "running", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Map()
+        });
+        Object.defineProperty(this, "uploader", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "opts", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        this.uploader = uploader;
+        this.opts = opts;
+    }
+    get items() {
+        return this.list;
+    }
+    /** The files the last add, paste or drop refused, each with its reason. */
+    get rejections() {
+        return this.refused;
+    }
+    get max() {
+        return this.opts.max ?? HELP_IMAGE_MAX_COUNT;
+    }
+    /** True while any image is still uploading. */
+    get uploading() {
+        return this.list.some(i => i.status === "uploading");
+    }
+    /** How many more can be added. */
+    get room() {
+        return Math.max(0, this.max - this.list.length);
+    }
+    subscribe(fn) {
+        this.listeners.add(fn);
+        return () => {
+            this.listeners.delete(fn);
+        };
+    }
+    emit() {
+        this.listeners.forEach(l => l());
+    }
+    patch(key, change) {
+        let changed = false;
+        this.list = this.list.map(i => {
+            if (i.key !== key)
+                return i;
+            changed = true;
+            return { ...i, ...change };
+        });
+        if (changed)
+            this.emit();
+    }
+    /**
+     * Adds files: each is checked, the first ones that fit are uploaded at
+     * once, and every one refused is named with its reason.
+     */
+    add(files) {
+        const refused = [];
+        const added = [];
+        let room = this.room;
+        for (const file of files) {
+            const why = checkHelpImage(file);
+            if (why) {
+                refused.push({ name: file.name || "image", message: why });
+                continue;
+            }
+            if (room <= 0) {
+                refused.push({ name: file.name || "image", message: HELP_IMAGE_ERRORS.tooMany });
+                continue;
+            }
+            room--;
+            seq += 1;
+            const item = {
+                key: `img-${Date.now().toString(36)}-${seq}`,
+                name: file.name || "image",
+                size: file.size,
+                preview: this.opts.preview ? this.opts.preview(file) : "",
+                status: "uploading",
+                progress: 0,
+                id: null,
+                error: null,
+            };
+            added.push({ item, file });
         }
-        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent });
+        this.refused = refused;
+        this.list = [...this.list, ...added.map(a => a.item)];
+        this.emit();
+        for (const { item, file } of added)
+            this.start(item.key, file);
+    }
+    start(key, file) {
+        const abort = new AbortController();
+        const done = this.uploader
+            .upload(file, {
+            signal: abort.signal,
+            onProgress: p => {
+                if (!abort.signal.aborted)
+                    this.patch(key, { progress: Math.max(0, Math.min(1, p)) });
+            },
+            onId: id => {
+                if (abort.signal.aborted) {
+                    this.uploader.discard?.(id);
+                    return;
+                }
+                this.patch(key, { id });
+            },
+        })
+            .then(res => {
+            if (abort.signal.aborted) {
+                this.uploader.discard?.(res.id);
+                return;
+            }
+            this.patch(key, { status: "ready", progress: 1, id: res.id, error: null });
+        }, (err) => {
+            if (abort.signal.aborted)
+                return;
+            const message = err instanceof Error && err.message ? err.message : HELP_IMAGE_ERRORS.failed;
+            this.patch(key, { status: "failed", error: message });
+        })
+            .finally(() => {
+            this.running.delete(key);
+        });
+        this.running.set(key, { abort, done });
     }
-    // Only blank the page when we've never seen a token — otherwise the
-    // periodic session refresh would visibly flash the loader every 4 min.
-    if (!extendedSession?.accessToken && !hasSeenAccessTokenRef.current) {
-        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent });
+    /** Takes an image off: stops its upload and forgets it on the server. */
+    remove(key) {
+        const item = this.list.find(i => i.key === key);
+        if (!item)
+            return;
+        const run = this.running.get(key);
+        if (run)
+            run.abort.abort();
+        if (item.id)
+            this.uploader.discard?.(item.id);
+        if (item.preview)
+            this.opts.revoke?.(item.preview);
+        this.list = this.list.filter(i => i.key !== key);
+        this.emit();
+    }
+    /** Marks the image platform-api refused on sending (it names it by id). */
+    refuse(id, message) {
+        const item = this.list.find(i => i.id === id);
+        if (item)
+            this.patch(item.key, { status: "failed", error: message });
+    }
+    dismissRejections() {
+        if (this.refused.length === 0)
+            return;
+        this.refused = [];
+        this.emit();
+    }
+    /**
+     * Waits until nothing is uploading, then says what can be sent: the ids
+     * of the ready images in the order they are shown, and the ones that
+     * failed. ส่ง calls this, so a send never leaves without its images.
+     */
+    async settled() {
+        while (this.running.size > 0) {
+            await Promise.all(Array.from(this.running.values(), r => r.done));
+        }
+        return {
+            ids: this.list.filter(i => i.status === "ready" && i.id).map(i => i.id),
+            failed: this.list.filter(i => i.status === "failed"),
+        };
     }
-    if (!code) {
-        router.push(selectOrganizationUrl);
-        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent });
+    /**
+     * Empties the list. sent: the images went with a message — nothing to
+     * forget on the server. Otherwise every upload made is discarded.
+     */
+    clear(sent = false) {
+        for (const [, run] of this.running)
+            run.abort.abort();
+        for (const item of this.list) {
+            if (!sent && item.id)
+                this.uploader.discard?.(item.id);
+            if (item.preview)
+                this.opts.revoke?.(item.preview);
+        }
+        this.list = [];
+        this.refused = [];
+        this.emit();
     }
-    // When the sidebar is docked-open it consumes 21.5rem on the left; otherwise
-    // the content takes the full width and we add a left gutter inside.
-    const workspace = chrome === "workspace";
-    const contentMargin = open && !isSidebarModalLayout
-        ? workspace
-            ? "ml-[244px]"
-            : "ml-[21.5rem]"
-        : "";
-    const needsLeftGutter = workspace || !(open && !isSidebarModalLayout);
-    const wrap = permissionProvider ?? ((c) => c);
-    return (jsxRuntime.jsxs("div", { className: "flex min-h-screen w-full bg-background", children: [open && (jsxRuntime.jsx("div", { className: "fixed left-0 top-0 z-50 h-screen", children: sidebar })), open && isSidebarModalLayout && (jsxRuntime.jsx("button", { type: "button", "aria-label": "\u0E1B\u0E34\u0E14\u0E40\u0E21\u0E19\u0E39", className: "fixed inset-0 z-40 bg-black/50", onClick: () => setOpen(false) })), jsxRuntime.jsx("div", { className: cx("relative flex min-w-0 flex-1 flex-col transition-all", contentMargin), children: jsxRuntime.jsxs("main", { className: cx("flex flex-1 flex-col min-h-screen", workspace ? "gap-0" : "gap-4"), children: [workspace ? (jsxRuntime.jsxs("div", { className: cx("sticky top-0 z-30 shrink-0 w-full", workspaceHeader === "light" &&
-                                "border-b border-border bg-card/85 backdrop-blur-sm"), style: workspaceHeader === "light"
-                                ? WORKSPACE_LIGHT_HEADER_VARS
-                                : WORKSPACE_HEADER_VARS, children: [workspaceHeader === "light" ? null : (jsxRuntime.jsx(HeaderBackground, { className: "rounded-none" })), jsxRuntime.jsxs("header", { className: cx("relative z-10 flex w-full items-center gap-3 text-[var(--header-fg)]", workspaceHeader === "light"
-                                        ? "min-h-[66px] px-3 py-2 sm:min-h-[72px] sm:px-[22px] lg:min-h-[82px] lg:px-8"
-                                        : "min-h-[72px] px-[18px] py-3 sm:px-6 lg:min-h-[88px] lg:px-10"), children: [isSidebarModalLayout ? (
-                                        // As in the design: the mark, then a menu button, and the
-                                        // organisation on the right — no trail, no title, so the
-                                        // organisation's name has the room it needs on a phone.
-                                        jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [mobileBrand ? (jsxRuntime.jsx("div", { className: "shrink-0", children: mobileBrand })) : null, jsxRuntime.jsx("button", { type: "button", onClick: () => setOpen(!open), "aria-label": open ? "ปิดเมนู" : "เปิดเมนู", className: "grid size-[34px] shrink-0 place-items-center rounded-lg text-[var(--header-fg-muted)] transition-colors hover:bg-[var(--header-hover)] hover:text-[var(--header-fg)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--header-fg-muted)]", children: jsxRuntime.jsx(lucideReact.LayoutGrid, { className: "size-5", strokeWidth: 1.65 }) })] })) : (jsxRuntime.jsx(SidebarTrigger, { className: "shrink-0 text-[var(--header-fg-muted)] hover:bg-[var(--header-hover)] hover:text-[var(--header-fg)] [&_svg]:!text-current" })), jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-1 flex-col justify-center gap-0.5", children: [jsxRuntime.jsx("div", { className: "hidden min-w-0 sm:block", children: breadcrumb }), jsxRuntime.jsx("div", { id: "header-title", className: "min-w-0 max-sm:hidden" })] }), headerEnd ? (jsxRuntime.jsx("div", { className: "flex shrink-0 items-center gap-3 sm:gap-5", children: headerEnd })) : null] })] })) : (jsxRuntime.jsxs("div", { className: "sticky top-0 z-30 shrink-0 w-full", children: [jsxRuntime.jsx(HeaderBackground, {}), jsxRuntime.jsxs("header", { className: "relative shrink-0 gap-2 py-4 h-auto min-h-[123.5px] w-full z-10", children: [jsxRuntime.jsxs("div", { className: "flex w-full items-center gap-2 px-3 sm:px-4 lg:px-6", children: [jsxRuntime.jsx(SidebarTrigger, { className: "shrink-0 text-white hover:bg-white/10" }), jsxRuntime.jsx("div", { className: "flex-1 min-w-0", children: breadcrumb }), headerEnd ? (jsxRuntime.jsx("div", { className: "flex shrink-0 items-center gap-3", children: headerEnd })) : null] }), jsxRuntime.jsx("div", { id: "header-title" })] })] })), jsxRuntime.jsx(React.Suspense, { fallback: jsxRuntime.jsx("div", { className: "relative z-10 min-h-[calc(100vh-8rem)]", children: jsxRuntime.jsx("div", { className: "flex h-full items-center justify-center", children: jsxRuntime.jsxs("div", { className: "space-y-4 text-center", children: [jsxRuntime.jsx("div", { className: "mx-auto h-8 w-8 animate-spin rounded-full border-b-2 border-primary" }), jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E42\u0E2B\u0E25\u0E14..." })] }) }) }), children: jsxRuntime.jsx("div", { className: workspace
-                                    ? "relative z-10 px-[18px] pt-[26px] pb-4 sm:px-6 lg:px-10 lg:pt-[38px]"
-                                    : cx("relative z-10 pr-6", needsLeftGutter && "pl-6"), children: orgContextIsStale ? loadingComponent : wrap(children) }, `org-${contentOrgKey}`) })] }) })] }));
-}
-/** Local tiny classnames helper — avoids pulling clsx/tailwind-merge into
- *  the shell just for the layout file. Falsy values are skipped. */
-function cx(...parts) {
-    return parts.filter(Boolean).join(" ");
 }
 
 /**
- * The product mark at the top of the workspace sidebar: the app icon, the
- * name, and a spaced caption beneath it.
+ * The help channel lives on platform-api (POST /support/messages). The shared
+ * axios instance carries the user's token and the organisation header, and
+ * refreshes a stale token.
  */
-function WorkspaceBrand({ name, caption, mark, href, compact = false, className, }) {
-    const body = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { className: erpTheme.cn("grid shrink-0 place-items-center overflow-hidden rounded-[14px] [&>img]:size-full [&>img]:object-cover", compact ? "size-9 rounded-[11px]" : "size-11"), children: mark }), compact ? (jsxRuntime.jsx("span", { className: "sr-only", children: name })) : (jsxRuntime.jsxs("span", { className: "min-w-0", children: [jsxRuntime.jsx("span", { className: "block truncate text-[25px] leading-tight font-extrabold tracking-[-0.05em]", children: name }), caption ? (jsxRuntime.jsx("small", { className: "-mt-0.5 block truncate text-[9px] font-semibold tracking-[0.29em] text-muted-foreground", children: caption })) : null] }))] }));
-    const cls = erpTheme.cn("flex items-center gap-[11px] rounded-lg focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", !compact && "px-4", className);
-    return href ? (jsxRuntime.jsx(Link, { href: href, className: cls, "aria-label": compact ? name : undefined, children: body })) : (jsxRuntime.jsx("div", { className: cls, children: body }));
+function helpApiBase(app) {
+    return platformApiBase(app);
+}
+/** The thread of m, oldest first, from whichever shape platform-api sent. */
+function helpThread(m) {
+    if (m.thread)
+        return m.thread;
+    return m.replies.map((r, i) => ({ id: `${m.id}-${i}`, author: "staff", body: r.body, created_at: r.created_at, images: [] }));
+}
+/** A failure the dialog shows as is; attachmentId names the image it is about. */
+class HelpSendError extends Error {
+    constructor(message, status, attachmentId) {
+        super(message);
+        Object.defineProperty(this, "status", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "attachmentId", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        this.name = "HelpSendError";
+        this.status = status;
+        this.attachmentId = attachmentId;
+    }
 }
-
-function isExternal(href) {
-    return /^https?:\/\//i.test(href);
+function attachmentIdOf(err) {
+    const data = err?.response?.data?.data;
+    return typeof data?.attachment_id === "string" ? data.attachment_id : undefined;
 }
-/**
- * The card at the foot of the workspace sidebar that points someone who
- * does not know where to start at the place that will tell them.
- */
-function SidebarHelpCard({ title, description, actionLabel, href, icon, className, }) {
-    const external = isExternal(href);
-    const action = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [actionLabel, jsxRuntime.jsx(lucideReact.ArrowRight, { className: "size-[15px]" })] }));
-    const actionClass = "mt-3 flex w-full items-center justify-between text-xs font-semibold text-primary hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded";
-    return (jsxRuntime.jsxs("div", { className: erpTheme.cn("mx-1.5 mb-5 rounded-[13px] border border-primary/10 bg-gradient-to-br from-primary/[0.06] to-primary/[0.02] px-3.5 py-4", className), children: [jsxRuntime.jsx("span", { className: "mb-[7px] block text-primary/70", children: icon ?? jsxRuntime.jsx(lucideReact.Compass, { className: "size-6", strokeWidth: 1.6 }) }), jsxRuntime.jsx("strong", { className: "block text-xs font-semibold", children: title }), description ? (jsxRuntime.jsx("p", { className: "mt-[7px] text-xs leading-[1.7] text-muted-foreground", children: description })) : null, external ? (jsxRuntime.jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", className: actionClass, children: action })) : (jsxRuntime.jsx(Link, { href: href, className: actionClass, children: action }))] }));
+function friendly(err, fallback) {
+    const e = toApiError(err);
+    const attachmentId = attachmentIdOf(err);
+    if (e.status === 429) {
+        return new HelpSendError(e.message && e.message !== "Request failed with status code 429" ? e.message : "ส่งบ่อยเกินไป กรุณาลองใหม่ภายหลัง", 429);
+    }
+    if (e.status && e.status >= 400 && e.status < 500 && e.message && e.status !== 401 && (e.status !== 404 || attachmentId)) {
+        return new HelpSendError(e.message, e.status, attachmentId);
+    }
+    if (e.status === 503 && e.message) {
+        return new HelpSendError(e.message, e.status);
+    }
+    return new HelpSendError(fallback, e.status, attachmentId);
 }
-/** A quiet row under the help card — the manual, the support chat. */
-function SidebarHelpLink({ label, href, icon, className }) {
-    const external = isExternal(href);
-    const cls = erpTheme.cn("flex w-full items-center gap-3 rounded-[10px] px-3.5 py-[11px] text-xs font-medium text-sidebar-foreground/70 transition-colors hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", className);
-    const body = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [icon ? jsxRuntime.jsx("span", { className: "shrink-0 [&>svg]:size-[18px]", children: icon }) : null, jsxRuntime.jsx("span", { className: "flex-1 truncate", children: label }), external ? jsxRuntime.jsx(lucideReact.ArrowUpRight, { className: "size-4 shrink-0" }) : null] }));
-    return external ? (jsxRuntime.jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", className: cls, children: body })) : (jsxRuntime.jsx(Link, { href: href, className: cls, children: body }));
+async function sendHelpMessage(input) {
+    try {
+        const res = await instance.post(`${helpApiBase(input.app)}/support/messages`, {
+            kind: input.kind,
+            message: input.message,
+            app: input.app === "other" ? "" : input.app,
+            context: input.context,
+            attachment_ids: input.attachmentIds ?? [],
+        });
+        return unwrapApiResponse(res.data);
+    }
+    catch (err) {
+        throw friendly(err, "ส่งไม่สำเร็จ");
+    }
 }
-
-/**
- * Central "no access" screen shared by every policy check (route-level
- * PermissionProvider and page-level PermissionGateShell). One look everywhere:
- * an illustration, a 403 headline, the page-specific reason, and recovery
- * actions.
- */
-function AccessDenied({ title = "ขออภัย, คุณไม่มีสิทธิ์เข้าถึงหน้านี้ (403)", message = "คุณไม่มีสิทธิ์เข้าถึงหน้านี้ ขออภัยในความไม่สะดวก", homeHref, homeLabel = "กลับไปหน้าหลัก", supportHref, supportLabel = "ติดต่อฝ่ายสนับสนุน", fullScreen = true, className, }) {
-    // "/" is not the home page inside an app — it bounces to organization
-    // selection, so the button read "กลับไปหน้าหลัก" and dropped the user into a
-    // picker for the org they were already in. Send them to that org's home.
-    const params = navigation.useParams();
-    const code = typeof params?.code === "string" ? params.code : "";
-    const homeTarget = homeHref ?? (code ? `/${code}` : "/");
-    const go = (href) => {
-        if (typeof window !== "undefined")
-            window.location.href = href;
-    };
-    const wrapperClass = [
-        "flex min-w-0 flex-1 items-center justify-center p-4",
-        fullScreen ? "min-h-[70vh]" : "",
-        className ?? "",
-    ]
-        .filter(Boolean)
-        .join(" ");
-    return (jsxRuntime.jsx("div", { className: wrapperClass, children: jsxRuntime.jsx("div", { className: "relative w-full max-w-3xl overflow-hidden rounded-2xl border border-border/60 bg-card/60 p-8 shadow-sm backdrop-blur sm:p-10", children: jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-8 text-center sm:flex-row sm:text-left", children: [jsxRuntime.jsxs("div", { className: "relative shrink-0", children: [jsxRuntime.jsx("div", { className: "absolute inset-0 rounded-full bg-destructive/20 blur-2xl" }), jsxRuntime.jsx("div", { className: "relative flex h-28 w-28 items-center justify-center rounded-3xl border border-border/60 bg-gradient-to-br from-muted/40 to-background shadow-inner", children: jsxRuntime.jsx("div", { className: "flex h-16 w-16 items-center justify-center rounded-full border border-destructive/40 bg-destructive/10", children: jsxRuntime.jsx(lucideReact.Ban, { className: "h-8 w-8 text-destructive", strokeWidth: 2.5 }) }) })] }), jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [jsxRuntime.jsx("h1", { className: "text-xl font-bold text-foreground sm:text-2xl", children: title }), message ? (jsxRuntime.jsx("p", { className: "mt-3 whitespace-pre-line text-sm leading-relaxed text-muted-foreground sm:text-base", children: message })) : null, jsxRuntime.jsxs("div", { className: "mt-6 flex flex-col gap-3 sm:flex-row", children: [jsxRuntime.jsxs(erpTheme.Button, { type: "button", onClick: () => go(homeTarget), className: "w-full sm:w-auto", children: [jsxRuntime.jsx(lucideReact.Home, { className: "mr-2 h-4 w-4" }), homeLabel] }), supportHref ? (jsxRuntime.jsxs(erpTheme.Button, { type: "button", variant: "outline", onClick: () => go(supportHref), className: "w-full sm:w-auto", children: [jsxRuntime.jsx(lucideReact.Headset, { className: "mr-2 h-4 w-4" }), supportLabel] })) : null] })] })] }) }) }));
+/** One of the caller's messages by id or reference number ("H1004"). */
+async function getMyHelpMessage(app, key) {
+    try {
+        const res = await instance.get(`${helpApiBase(app)}/support/messages/${encodeURIComponent(key)}`);
+        return unwrapApiResponse(res.data);
+    }
+    catch (err) {
+        if (toApiError(err).status === 404)
+            throw new HelpSendError("ไม่พบข้อความ", 404);
+        throw friendly(err, "โหลดข้อมูลไม่สำเร็จ");
+    }
 }
-
-const EMPLOYEE_RECORD_REQUIRED = "EMPLOYEE_RECORD_REQUIRED";
-const EMPLOYEE_RECORD_REQUIRED_EVENT = "erp:employee-record-required";
-const EMPLOYEE_RECORD_OK_EVENT = "erp:employee-record-ok";
-/**
- * Shown when the API refuses every request because the signed-in account has
- * no employee record in this organisation.
- *
- * A gate rather than a banner. Leave, attendance, approvals and payslips all
- * identify a person by that record, so once the server started enforcing it
- * every call fails — and without something that says so, the app becomes a
- * screen of error toasts with no explanation and no way forward.
- */
-function EmployeeRequiredGate({ platformBaseUrl, }) {
-    const [blocked, setBlocked] = React.useState(false);
-    const params = navigation.useParams();
-    const code = params?.code ?? "";
-    React.useEffect(() => {
-        const onBlocked = () => setBlocked(true);
-        const onOk = () => setBlocked(false);
-        window.addEventListener(EMPLOYEE_RECORD_REQUIRED_EVENT, onBlocked);
-        window.addEventListener(EMPLOYEE_RECORD_OK_EVENT, onOk);
-        return () => {
-            window.removeEventListener(EMPLOYEE_RECORD_REQUIRED_EVENT, onBlocked);
-            window.removeEventListener(EMPLOYEE_RECORD_OK_EVENT, onOk);
+/** The author writes again on their own message. */
+async function sendHelpFollowUp(input) {
+    try {
+        const res = await instance.post(`${helpApiBase(input.app)}/support/messages/${encodeURIComponent(input.key)}/replies`, { message: input.message, attachment_ids: input.attachmentIds ?? [] });
+        return unwrapApiResponse(res.data);
+    }
+    catch (err) {
+        throw friendly(err, "ส่งไม่สำเร็จ");
+    }
+}
+/** PUTs the file to the presigned URL, reporting progress. No credentials go with it. */
+function putFile(ticket, file, onProgress, signal) {
+    return new Promise((resolve, reject) => {
+        const xhr = new XMLHttpRequest();
+        xhr.open(ticket.method || "PUT", ticket.upload_url);
+        for (const [k, v] of Object.entries(ticket.headers ?? {}))
+            xhr.setRequestHeader(k, v);
+        xhr.upload.onprogress = e => {
+            if (e.lengthComputable && e.total > 0)
+                onProgress(e.loaded / e.total);
         };
-    }, []);
-    if (!blocked)
-        return null;
-    const base = platformBaseUrl?.replace(/\/$/, "") ?? "";
-    const createHref = code ? `${base}/${code}/employee/create` : `${base}/`;
-    return (jsxRuntime.jsx("div", { className: "fixed inset-0 z-[100] flex items-center justify-center bg-background/95 p-6 backdrop-blur-sm", children: jsxRuntime.jsxs("div", { className: "w-full max-w-md space-y-5 text-center", children: [jsxRuntime.jsx(lucideReact.ContactRound, { className: "mx-auto h-12 w-12 text-muted-foreground" }), jsxRuntime.jsxs("div", { className: "space-y-2", children: [jsxRuntime.jsx("h1", { className: "text-lg font-semibold tracking-tight", children: "\u0E1A\u0E31\u0E0D\u0E0A\u0E35\u0E19\u0E35\u0E49\u0E22\u0E31\u0E07\u0E44\u0E21\u0E48\u0E44\u0E14\u0E49\u0E1C\u0E39\u0E01\u0E01\u0E31\u0E1A\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19" }), jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "\u0E25\u0E32 \u0E25\u0E07\u0E40\u0E27\u0E25\u0E32 \u0E40\u0E1A\u0E34\u0E01\u0E40\u0E07\u0E34\u0E19 \u0E41\u0E25\u0E30\u0E01\u0E32\u0E23\u0E2D\u0E19\u0E38\u0E21\u0E31\u0E15\u0E34 \u0E23\u0E30\u0E1A\u0E38\u0E15\u0E31\u0E27\u0E04\u0E19\u0E08\u0E32\u0E01\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19 \u0E08\u0E36\u0E07\u0E22\u0E31\u0E07\u0E43\u0E0A\u0E49\u0E07\u0E32\u0E19\u0E43\u0E19\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23\u0E19\u0E35\u0E49\u0E44\u0E21\u0E48\u0E44\u0E14\u0E49" })] }), jsxRuntime.jsxs("div", { className: "flex flex-wrap justify-center gap-2", children: [jsxRuntime.jsx(erpTheme.Button, { onClick: () => window.location.reload(), children: "\u0E25\u0E2D\u0E07\u0E43\u0E2B\u0E21\u0E48" }), jsxRuntime.jsx(erpTheme.Button, { variant: "outline", asChild: true, children: jsxRuntime.jsxs("a", { href: createHref, children: [jsxRuntime.jsx(lucideReact.UserPlus, { className: "mr-1 h-4 w-4" }), "\u0E2A\u0E23\u0E49\u0E32\u0E07\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19"] }) })] }), jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: "\u0E16\u0E49\u0E32\u0E04\u0E38\u0E13\u0E44\u0E21\u0E48\u0E21\u0E35\u0E2A\u0E34\u0E17\u0E18\u0E34\u0E4C\u0E41\u0E01\u0E49\u0E44\u0E02 \u0E43\u0E2B\u0E49\u0E41\u0E08\u0E49\u0E07\u0E1C\u0E39\u0E49\u0E14\u0E39\u0E41\u0E25\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" })] }) }));
+        xhr.onload = () => (xhr.status >= 200 && xhr.status < 300 ? resolve() : reject(new HelpSendError("อัปโหลดไม่สำเร็จ", xhr.status)));
+        xhr.onerror = () => reject(new HelpSendError("อัปโหลดไม่สำเร็จ"));
+        xhr.onabort = () => reject(new HelpSendError("ยกเลิกแล้ว"));
+        if (signal.aborted) {
+            reject(new HelpSendError("ยกเลิกแล้ว"));
+            return;
+        }
+        signal.addEventListener("abort", () => xhr.abort(), { once: true });
+        xhr.send(file);
+    });
 }
-
-const shellClassName = "flex min-w-0 flex-1 flex-col gap-6 overflow-x-hidden";
 /**
- * Shared layout for “กำลังตรวจสอบสิทธิ์” (skeleton) and “ไม่มีสิทธิ์” (message).
- * Renders `children` only when policy is loaded and access is granted.
+ * The uploader the dialog uses: an upload URL from platform-api, the bytes
+ * straight to the bucket, then platform-api reads them to say whether they
+ * are an image it will take.
  */
-function PermissionGateShell({ policyLoading, hasPolicyAccess, deniedMessage, children, skeletonCount = 6, skeletonGridClassName = "grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3", skeletonVariant = "kpi", }) {
-    if (policyLoading) {
-        return (jsxRuntime.jsx("div", { className: shellClassName, children: jsxRuntime.jsx("div", { className: skeletonGridClassName, children: Array.from({ length: skeletonCount }).map((_, i) => (jsxRuntime.jsx(erpTheme.Card, { children: skeletonVariant === "kpi" ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(erpTheme.CardHeader, { className: "flex flex-row items-center justify-between pb-2", children: [jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-4 w-24" }), jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-4 w-4 rounded" })] }), jsxRuntime.jsxs(erpTheme.CardContent, { children: [jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-8 w-32 mb-2" }), jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-3 w-20" })] })] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(erpTheme.CardHeader, { className: "pb-2", children: jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-4 w-24" }) }), jsxRuntime.jsx(erpTheme.CardContent, { children: jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-8 w-16" }) })] })) }, i))) }) }));
+function helpUploader(app) {
+    const base = () => helpApiBase(app);
+    return {
+        async upload(file, hooks) {
+            let ticket;
+            try {
+                const res = await instance.post(`${base()}/support/attachments`, { file_name: file.name, content_type: helpImageType(file.type), size: file.size }, { signal: hooks.signal });
+                ticket = unwrapApiResponse(res.data);
+            }
+            catch (err) {
+                throw friendly(err, "อัปโหลดไม่สำเร็จ");
+            }
+            hooks.onId(ticket.id);
+            hooks.onProgress(0.02);
+            await putFile(ticket, file, p => hooks.onProgress(0.02 + p * 0.93), hooks.signal);
+            try {
+                await instance.post(`${base()}/support/attachments/${ticket.id}/check`, null, { signal: hooks.signal });
+            }
+            catch (err) {
+                throw friendly(err, "อัปโหลดไม่สำเร็จ");
+            }
+            return { id: ticket.id };
+        },
+        discard(id) {
+            void instance.delete(`${base()}/support/attachments/${encodeURIComponent(id)}`).catch(() => undefined);
+        },
+    };
+}
+async function listMyHelpMessages(app) {
+    try {
+        const res = await instance.get(`${helpApiBase(app)}/support/messages`, {
+            params: { limit: 20 },
+        });
+        const data = unwrapApiResponse(res.data);
+        return data?.messages ?? [];
     }
-    if (!hasPolicyAccess) {
-        return (jsxRuntime.jsx("div", { className: shellClassName, children: jsxRuntime.jsx(AccessDenied, { message: deniedMessage }) }));
+    catch (err) {
+        throw friendly(err, "โหลดข้อมูลไม่สำเร็จ");
     }
-    return jsxRuntime.jsx(jsxRuntime.Fragment, { children: children });
 }
 
-const PermissionRulesContext = React.createContext(undefined);
+/** One message's images, uploading as they are added. */
+function useHelpAttachments(app) {
+    const attach = React__namespace.useMemo(() => new HelpAttachments(helpUploader(app), {
+        preview: f => typeof URL !== "undefined" && typeof URL.createObjectURL === "function" && f instanceof Blob
+            ? URL.createObjectURL(f)
+            : "",
+        revoke: u => {
+            if (u.startsWith("blob:"))
+                URL.revokeObjectURL(u);
+        },
+    }), [app]);
+    const snap = React__namespace.useRef({
+        items: attach.items,
+        rejections: attach.rejections,
+    });
+    const read = React__namespace.useCallback(() => {
+        if (snap.current.items !== attach.items || snap.current.rejections !== attach.rejections) {
+            snap.current = { items: attach.items, rejections: attach.rejections };
+        }
+        return snap.current;
+    }, [attach]);
+    const state = React__namespace.useSyncExternalStore(React__namespace.useCallback(l => attach.subscribe(l), [attach]), read, read);
+    // Leaving the page: what was uploaded and not sent is forgotten.
+    React__namespace.useEffect(() => () => attach.clear(), [attach]);
+    return { attach, items: state.items, rejections: state.rejections };
+}
 /**
- * Generic provider — the consumer app passes in `data` (live fetch) and
- * `fallbackPolicies` (static JSON). All apps share the same mapping logic
- * (build a flat map of route_key/policy_key → required child groups).
+ * Paste and drop for a form that takes images: spread onto the form. A
+ * pasted screenshot or a dropped file is added like a picked one.
  */
-function PermissionRulesProvider({ children, data, isLoading = false, isError = false, fallbackPolicies = [], }) {
-    const rulesMap = React.useMemo(() => {
-        const m = {};
-        if (!data?.routes)
-            return m;
-        for (const row of data.routes) {
-            m[row.route_key] = row.required_child_groups ?? [];
-        }
-        return m;
-    }, [data]);
-    const policiesMap = React.useMemo(() => {
-        const m = {};
-        for (const row of fallbackPolicies) {
-            m[row.policy_key] = row.required_child_groups ?? [];
-        }
-        if (data?.policies?.length) {
-            for (const row of data.policies) {
-                m[row.policy_key] = row.required_child_groups ?? [];
-            }
-        }
-        return m;
-    }, [data, fallbackPolicies]);
-    const value = React.useMemo(() => ({
-        rulesMap,
-        policiesMap,
-        isLoading,
-        isError,
-        updatedAt: data?.updated_at ?? null,
-    }), [rulesMap, policiesMap, isLoading, isError, data?.updated_at]);
-    return (jsxRuntime.jsx(PermissionRulesContext.Provider, { value: value, children: children }));
+function useHelpImageDrop(attach, enabled) {
+    const [over, setOver] = React__namespace.useState(false);
+    const depth = React__namespace.useRef(0);
+    const props = {
+        onPaste: (e) => {
+            if (!enabled)
+                return;
+            const files = filesFromPaste(e.clipboardData);
+            if (files.length === 0)
+                return;
+            e.preventDefault();
+            attach.add(files);
+        },
+        onDragEnter: (e) => {
+            if (!enabled || !dragHasFiles(e.dataTransfer))
+                return;
+            e.preventDefault();
+            depth.current += 1;
+            setOver(true);
+        },
+        onDragOver: (e) => {
+            if (!enabled || !dragHasFiles(e.dataTransfer))
+                return;
+            e.preventDefault();
+            e.dataTransfer.dropEffect = "copy";
+        },
+        onDragLeave: (e) => {
+            if (!enabled || !dragHasFiles(e.dataTransfer))
+                return;
+            depth.current = Math.max(0, depth.current - 1);
+            if (depth.current === 0)
+                setOver(false);
+        },
+        onDrop: (e) => {
+            if (!enabled)
+                return;
+            depth.current = 0;
+            setOver(false);
+            const files = filesFromDrop(e.dataTransfer);
+            if (files.length === 0)
+                return;
+            e.preventDefault();
+            attach.add(files);
+        },
+    };
+    return { over, props };
+}
+function kb(size) {
+    if (size >= 1024 * 1024)
+        return `${(size / (1024 * 1024)).toFixed(1)} MB`;
+    return `${Math.max(1, Math.round(size / 1024))} KB`;
 }
 /**
- * Read the permission rules. Outside the provider, report loading so
- * fail-closed consumers (nav / gates) do not treat empty maps as "allow all".
+ * แนบรูป: the button that opens the file picker (on a phone, the photo
+ * library or the camera), the thumbnails with their progress and a remove
+ * button each, and a line per file that was refused.
  */
-function usePermissionRules() {
-    const ctx = React.useContext(PermissionRulesContext);
-    if (!ctx) {
-        return {
-            rulesMap: {},
-            policiesMap: {},
-            isLoading: true,
-            isError: false,
-            updatedAt: null,
-        };
+function HelpAttachField({ state, disabled, id }) {
+    const { attach, items, rejections } = state;
+    const input = React__namespace.useRef(null);
+    const full = items.length >= attach.max;
+    const problems = [
+        ...items.filter(i => i.status === "failed").map(i => ({ key: i.key, name: i.name, message: i.error ?? "" })),
+        ...rejections.map((r, n) => ({ key: `refused-${n}`, name: r.name, message: r.message })),
+    ];
+    return (jsxRuntime.jsxs("div", { className: "grid gap-2", children: [jsxRuntime.jsxs("div", { className: "flex flex-wrap items-start gap-2", children: [items.map(it => (jsxRuntime.jsx(AttachThumb, { item: it, onRemove: () => attach.remove(it.key), disabled: disabled }, it.key))), jsxRuntime.jsxs(erpTheme.Button, { type: "button", variant: "outline", size: "sm", disabled: disabled || full, onClick: () => {
+                            attach.dismissRejections();
+                            input.current?.click();
+                        }, "aria-controls": id, className: items.length > 0 ? "h-16 w-16 flex-col gap-1 p-1 text-[11px]" : "gap-1.5", children: [jsxRuntime.jsx(lucideReact.ImagePlus, { className: "h-4 w-4" }), "\u0E41\u0E19\u0E1A\u0E23\u0E39\u0E1B"] }), jsxRuntime.jsx("input", { ref: input, id: id, type: "file", accept: HELP_IMAGE_ACCEPT, multiple: true, tabIndex: -1, "aria-hidden": "true", className: "sr-only", onChange: e => {
+                            const files = e.currentTarget.files;
+                            if (files && files.length > 0)
+                                attach.add(Array.from(files));
+                            e.currentTarget.value = "";
+                        } })] }), problems.length > 0 ? (jsxRuntime.jsx("ul", { role: "alert", className: "grid gap-0.5 text-xs text-destructive", children: problems.map(p => (jsxRuntime.jsxs("li", { className: "break-words", children: [p.name, ": ", p.message] }, p.key))) })) : null] }));
+}
+function AttachThumb({ item, onRemove, disabled }) {
+    const failed = item.status === "failed";
+    return (jsxRuntime.jsxs("figure", { className: "relative m-0 w-16", children: [jsxRuntime.jsxs("div", { className: "relative h-16 w-16 overflow-hidden rounded-md border bg-muted " +
+                    (failed ? "border-destructive" : "border-border"), children: [item.preview ? (
+                    // eslint-disable-next-line @next/next/no-img-element
+                    jsxRuntime.jsx("img", { src: item.preview, alt: item.name, className: "h-full w-full object-cover" })) : null, item.status === "uploading" ? (jsxRuntime.jsx("div", { role: "progressbar", "aria-label": `กำลังอัปโหลด ${item.name}`, "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": Math.round(item.progress * 100), className: "absolute inset-x-1 bottom-1 h-1.5 overflow-hidden rounded-full bg-background/80", children: jsxRuntime.jsx("div", { className: "h-full bg-primary transition-[width]", style: { width: `${Math.round(item.progress * 100)}%` } }) })) : null] }), jsxRuntime.jsx("button", { type: "button", onClick: onRemove, disabled: disabled, "aria-label": `ลบรูป ${item.name}`, title: "\u0E25\u0E1A\u0E23\u0E39\u0E1B", className: "absolute -right-1.5 -top-1.5 grid size-5 place-items-center rounded-full border border-border bg-background text-muted-foreground shadow-sm hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:opacity-50", children: jsxRuntime.jsx(lucideReact.X, { className: "h-3 w-3" }) }), jsxRuntime.jsx("figcaption", { className: "mt-0.5 truncate text-[10px] leading-tight text-muted-foreground", title: item.name, children: failed ? jsxRuntime.jsx("span", { className: "text-destructive", children: "\u0E44\u0E21\u0E48\u0E2A\u0E33\u0E40\u0E23\u0E47\u0E08" }) : kb(item.size) })] }));
+}
+/** Images already sent: thumbnails that open the full image. */
+function HelpImageStrip({ images, size = "md" }) {
+    if (!images || images.length === 0)
+        return null;
+    const box = size === "sm" ? "h-12 w-12" : "h-20 w-20";
+    return (jsxRuntime.jsx("ul", { className: "mt-2 flex flex-wrap gap-2", children: images.map(img => (jsxRuntime.jsx("li", { children: img.url ? (jsxRuntime.jsx("a", { href: img.url, target: "_blank", rel: "noopener noreferrer", "aria-label": `เปิดรูป ${img.file_name || ""}`.trim(), className: `block ${box} overflow-hidden rounded-md border border-border bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring`, children: jsxRuntime.jsx("img", { src: img.url, alt: img.file_name || "รูปที่แนบ", loading: "lazy", className: "h-full w-full object-cover" }) })) : (jsxRuntime.jsx("span", { className: `block ${box} rounded-md border border-border bg-muted`, "aria-label": img.file_name })) }, img.id))) }));
+}
+
+/**
+ * The ตอบกลับ link in a staff answer e-mail opens the app with ?help=H1004:
+ * the shell's ช่วยเหลือ dialog then opens on that message. Any app page
+ * with the shell's layout works; the e-mail uses Platform.
+ *
+ * Kept free of imports: the tests load it straight from source.
+ */
+const HELP_LINK_PARAM = "help";
+const REF = /^H\d{1,12}$/;
+/** The message a page address asks the dialog to open, or null. */
+function helpRefFromSearch(search) {
+    if (!search)
+        return null;
+    let params;
+    try {
+        params = new URLSearchParams(search.startsWith("?") ? search.slice(1) : search);
     }
-    return ctx;
+    catch {
+        return null;
+    }
+    const raw = (params.get(HELP_LINK_PARAM) ?? "").trim().toUpperCase();
+    return REF.test(raw) ? raw : null;
 }
-
 /**
- * Strip the org `[code]` prefix from a pathname so we can look it up in the
- * permission rules map. `/O12345/setting/foo` → `/setting/foo`. Single-segment
- * paths (e.g. `/select-organization`) keep their leading slash.
- *
- * Also normalizes the user-role subtab aliases — both `purchase-doc` and
- * `sales-doc` are gated by the same `members` rule because the UI shows
- * the same management screen with different filters.
+ * The same address without ?help=, so a reload or a shared link does not
+ * open the dialog again. Everything else in it is kept.
  */
-function normalizePathnameForPermissionRules(pathname) {
-    const parts = pathname.split("/").filter(Boolean);
-    const path = parts.length <= 1 ? "/" : "/" + parts.slice(1).join("/");
-    return path.replace(/\/user-role\/(purchase-doc|sales-doc)$/, "/user-role/members");
+function withoutHelpParam(href) {
+    let u;
+    try {
+        u = new URL(href);
+    }
+    catch {
+        return href;
+    }
+    if (!u.searchParams.has(HELP_LINK_PARAM))
+        return href;
+    u.searchParams.delete(HELP_LINK_PARAM);
+    return u.toString();
 }
-function hasRule(rulesMap, routeKey) {
-    return Object.prototype.hasOwnProperty.call(rulesMap, routeKey);
+
+const KINDS = [
+    { value: "help", label: "ขอความช่วยเหลือ", placeholder: "ต้องการให้ช่วยเรื่องอะไร" },
+    { value: "problem", label: "แจ้งปัญหา", placeholder: "เกิดอะไรขึ้น และกำลังทำอะไรอยู่" },
+    { value: "feedback", label: "ข้อเสนอแนะ", placeholder: "อยากให้ปรับหรือเพิ่มอะไร" },
+];
+const KIND_LABEL = Object.fromEntries(KINDS.map(k => [k.value, k.label]));
+const STATUS_LABEL = {
+    new: "รอตอบ",
+    answered: "ตอบแล้ว",
+    closed: "ปิดแล้ว",
+};
+const STATUS_TONE = {
+    new: "bg-amber-100 text-amber-900 dark:bg-amber-950 dark:text-amber-200",
+    answered: "bg-emerald-100 text-emerald-900 dark:bg-emerald-950 dark:text-emerald-200",
+    closed: "bg-muted text-muted-foreground",
+};
+const MAX_MESSAGE = 4000;
+const LINK_BUTTON = "rounded text-sm text-primary hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring";
+function when(iso) {
+    const d = new Date(iso);
+    if (Number.isNaN(d.getTime()))
+        return "";
+    return d.toLocaleString("th-TH", {
+        day: "numeric",
+        month: "short",
+        year: "numeric",
+        hour: "2-digit",
+        minute: "2-digit",
+        hour12: false,
+    });
+}
+function errorText(e, fallback) {
+    return e instanceof Error && e.message ? e.message : fallback;
 }
 /**
- * Resolve UI route permissions for a pathname.
- *
- * - Exact / `[param]` pattern match → matched
- * - Parent-prefix inherit only when the parent rule has a **non-empty**
- *   role list (restrictive inherit). Explicitly public parents (`[]`) do
- *   not open all children.
- * - No match → `{ matched: false }` (fail closed — never treat as public)
+ * Sends a message with its images: waits for what is still uploading, then
+ * sends; an image platform-api refuses is marked on its thumbnail.
  */
-function resolveUiRoutePermission(pathname, rulesMap) {
-    const normalized = normalizePathnameForPermissionRules(pathname);
-    if (hasRule(rulesMap, normalized)) {
-        return { matched: true, roles: rulesMap[normalized] ?? [] };
-    }
-    const pathSegments = normalized.split("/").filter(Boolean);
-    for (const [pattern, roles] of Object.entries(rulesMap)) {
-        const patternSegments = pattern.split("/").filter(Boolean);
-        if (patternSegments.length !== pathSegments.length)
-            continue;
-        let matches = true;
-        for (let i = 0; i < patternSegments.length; i++) {
-            const patternSegment = patternSegments[i];
-            const pathSegment = pathSegments[i];
-            if (patternSegment.startsWith("[") && patternSegment.endsWith("]")) {
-                if (!pathSegment) {
-                    matches = false;
-                    break;
-                }
-            }
-            else if (patternSegment !== pathSegment) {
-                matches = false;
-                break;
-            }
-        }
-        if (matches) {
-            return { matched: true, roles: roles ?? [] };
-        }
+async function sendWithImages(state, send) {
+    const { ids, failed } = await state.attach.settled();
+    if (failed.length > 0)
+        throw new HelpSendError("มีรูปที่อัปโหลดไม่สำเร็จ");
+    try {
+        const res = await send(ids);
+        state.attach.clear(true);
+        return res;
     }
-    // Parent-prefix: /leave/types/abc → /leave/types (non-empty roles only)
-    for (let len = pathSegments.length - 1; len >= 1; len--) {
-        const parent = "/" + pathSegments.slice(0, len).join("/");
-        if (hasRule(rulesMap, parent) && (rulesMap[parent]?.length ?? 0) > 0) {
-            return { matched: true, roles: rulesMap[parent] ?? [] };
-        }
+    catch (err) {
+        if (err instanceof HelpSendError && err.attachmentId)
+            state.attach.refuse(err.attachmentId, err.message);
+        throw err;
     }
-    return { matched: false, roles: [] };
 }
 /**
- * Returns the required child-group segments for a page pathname.
- *
- * Prefer {@link resolveUiRoutePermission} when you need to distinguish
- * "explicitly public (`[]`)" from "no rule (deny)". This helper returns
- * `[]` for both cases and is kept for backward compatibility.
+ * The ช่วยเหลือ dialog. AppLayoutShell mounts one; the top-bar button and
+ * the user menu open it with openHelp(), and a page address with
+ * ?help=H1004 (the ตอบกลับ button in a staff answer) opens it on that
+ * message. It sends to platform-api, which puts the message in the back
+ * office's queue on admin.antniti.com.
  */
-function getRequiredChildGroups(pathname, rulesMap) {
-    return resolveUiRoutePermission(pathname, rulesMap).roles;
+function HelpDialogHost({ app, orgCode }) {
+    const open = useHelpOpen();
+    const { data: session } = react.useSession();
+    const [view, setView] = React__namespace.useState("form");
+    const [kind, setKind] = React__namespace.useState("help");
+    const [message, setMessage] = React__namespace.useState("");
+    const [sending, setSending] = React__namespace.useState(false);
+    const [error, setError] = React__namespace.useState(null);
+    const [sent, setSent] = React__namespace.useState(null);
+    const [mine, setMine] = React__namespace.useState(null);
+    const [mineError, setMineError] = React__namespace.useState(null);
+    const [threadKey, setThreadKey] = React__namespace.useState(null);
+    const [thread, setThread] = React__namespace.useState(null);
+    const [threadError, setThreadError] = React__namespace.useState(null);
+    const [followDraft, setFollowDraft] = React__namespace.useState("");
+    const [following, setFollowing] = React__namespace.useState(false);
+    const [followError, setFollowError] = React__namespace.useState(null);
+    React__namespace.useEffect(() => registerHelpHost(), []);
+    // The ตอบกลับ link: ?help=H1004 opens the dialog on that message. The
+    // parameter comes off the address so a reload does not open it again.
+    React__namespace.useEffect(() => {
+        if (typeof window === "undefined")
+            return;
+        const ref = helpRefFromSearch(window.location.search);
+        if (!ref)
+            return;
+        window.history.replaceState(null, "", withoutHelpParam(window.location.href));
+        openHelpOn(ref);
+    }, []);
+    // Read when the dialog opens: the page and the window as they are now.
+    // open is a dependency on purpose: the app is read again each time.
+    const appId = React__namespace.useMemo(() => detectHelpApp(app), [app, open]);
+    const context = React__namespace.useMemo(() => (open ? collectHelpContext(orgCode) : null), [open, orgCode]);
+    const images = useHelpAttachments(appId);
+    const followImages = useHelpAttachments(appId);
+    const formDrop = useHelpImageDrop(images.attach, view === "form" && !sending);
+    const followDrop = useHelpImageDrop(followImages.attach, view === "thread" && !following && !!thread);
+    const openThread = React__namespace.useCallback((key) => {
+        setView("thread");
+        setThreadKey(key);
+        setThread(null);
+        setThreadError(null);
+        setFollowError(null);
+        getMyHelpMessage(appId, key)
+            .then(setThread)
+            .catch((e) => setThreadError(errorText(e, "โหลดข้อมูลไม่สำเร็จ")));
+    }, [appId]);
+    React__namespace.useEffect(() => {
+        if (!open)
+            return;
+        setError(null);
+        const key = pendingHelpRef();
+        if (key)
+            openThread(key);
+        else
+            setView("form");
+    }, [open, openThread]);
+    const loadMine = React__namespace.useCallback(() => {
+        clearPendingHelpRef();
+        setView("mine");
+        setMine(null);
+        setMineError(null);
+        listMyHelpMessages(appId)
+            .then(setMine)
+            .catch((e) => setMineError(errorText(e, "โหลดข้อมูลไม่สำเร็จ")));
+    }, [appId]);
+    const trimmed = message.trim();
+    const canSend = trimmed.length > 0 && !sending;
+    const send = async (e) => {
+        e?.preventDefault();
+        if (!canSend || !context)
+            return;
+        setSending(true);
+        setError(null);
+        try {
+            const res = await sendWithImages(images, ids => sendHelpMessage({ app: appId, kind, message: trimmed, context, attachmentIds: ids }));
+            setSent(res);
+            setMessage("");
+            setKind("help");
+            setView("sent");
+        }
+        catch (err) {
+            setError(errorText(err, "ส่งไม่สำเร็จ"));
+        }
+        finally {
+            setSending(false);
+        }
+    };
+    const followTrimmed = followDraft.trim();
+    const sendFollowUp = async (e) => {
+        e?.preventDefault();
+        if (!thread || !followTrimmed || following)
+            return;
+        setFollowing(true);
+        setFollowError(null);
+        try {
+            await sendWithImages(followImages, ids => sendHelpFollowUp({ app: appId, key: thread.id, message: followTrimmed, attachmentIds: ids }));
+            setFollowDraft("");
+            setMine(null);
+            setThread(await getMyHelpMessage(appId, thread.id));
+        }
+        catch (err) {
+            setFollowError(errorText(err, "ส่งไม่สำเร็จ"));
+        }
+        finally {
+            setFollowing(false);
+        }
+    };
+    const email = session?.user?.email ?? null;
+    const placeholder = KINDS.find(k => k.value === kind)?.placeholder;
+    const dropRing = (over) => (over ? " rounded-lg ring-2 ring-primary ring-offset-4 ring-offset-background" : "");
+    return (jsxRuntime.jsx(erpTheme.Dialog, { open: open, onOpenChange: o => (o ? openHelp() : closeHelp()), children: jsxRuntime.jsxs(erpTheme.DialogContent, { className: "max-h-[calc(100dvh-2rem)] overflow-y-auto sm:max-w-lg", children: [view === "form" ? (jsxRuntime.jsxs("form", { onSubmit: send, className: "grid gap-4" + dropRing(formDrop.over), ...formDrop.props, children: [jsxRuntime.jsx(erpTheme.DialogHeader, { children: jsxRuntime.jsx(erpTheme.DialogTitle, { children: "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D" }) }), jsxRuntime.jsxs("div", { className: "grid gap-2", children: [jsxRuntime.jsx(erpTheme.Label, { id: "erp-help-kind", children: "\u0E1B\u0E23\u0E30\u0E40\u0E20\u0E17" }), jsxRuntime.jsx("div", { role: "radiogroup", "aria-labelledby": "erp-help-kind", className: "flex gap-1 rounded-lg bg-muted p-1", children: KINDS.map(k => (jsxRuntime.jsx("button", { type: "button", role: "radio", "aria-checked": kind === k.value, onClick: () => setKind(k.value), className: "flex-auto whitespace-nowrap rounded-md px-2 py-2 text-xs font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring sm:text-sm " +
+                                            (kind === k.value
+                                                ? "bg-background text-foreground shadow-sm"
+                                                : "text-muted-foreground hover:text-foreground"), children: k.label }, k.value))) })] }), jsxRuntime.jsxs("div", { className: "grid gap-2", children: [jsxRuntime.jsx(erpTheme.Label, { htmlFor: "erp-help-message", children: "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21" }), jsxRuntime.jsx(erpTheme.Textarea, { id: "erp-help-message", rows: 6, maxLength: MAX_MESSAGE, required: true, value: message, placeholder: placeholder, onChange: e => setMessage(e.target.value), className: "min-h-[140px] resize-y" })] }), jsxRuntime.jsx(HelpAttachField, { state: images, disabled: sending, id: "erp-help-images" }), context ? (jsxRuntime.jsxs("p", { className: "break-words text-xs leading-relaxed text-muted-foreground", children: ["\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E17\u0E35\u0E48\u0E41\u0E19\u0E1A: ", describeAttached(appId, context, email)] })) : null, error ? (jsxRuntime.jsx("p", { role: "alert", className: "text-sm text-destructive", children: error })) : null, jsxRuntime.jsxs(erpTheme.DialogFooter, { className: "flex-row items-center gap-2 sm:justify-between", children: [jsxRuntime.jsx("button", { type: "button", onClick: loadMine, className: "mr-auto " + LINK_BUTTON, children: "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21\u0E17\u0E35\u0E48\u0E2A\u0E48\u0E07\u0E41\u0E25\u0E49\u0E27" }), jsxRuntime.jsxs("div", { className: "flex gap-2", children: [jsxRuntime.jsx(erpTheme.Button, { type: "button", variant: "outline", onClick: closeHelp, children: "\u0E22\u0E01\u0E40\u0E25\u0E34\u0E01" }), jsxRuntime.jsxs(erpTheme.Button, { type: "submit", disabled: !canSend, children: [sending ? jsxRuntime.jsx(lucideReact.Loader2, { className: "mr-1 h-4 w-4 animate-spin" }) : null, "\u0E2A\u0E48\u0E07"] })] })] })] })) : null, view === "sent" && sent ? (jsxRuntime.jsxs("div", { className: "grid gap-4", children: [jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-2 py-4 text-center", children: [jsxRuntime.jsx(lucideReact.CircleCheck, { className: "h-12 w-12 text-primary", strokeWidth: 1.6 }), jsxRuntime.jsx(erpTheme.DialogTitle, { className: "text-lg font-semibold", children: "\u0E2A\u0E48\u0E07\u0E41\u0E25\u0E49\u0E27" }), jsxRuntime.jsxs("p", { className: "text-sm text-muted-foreground", children: ["\u0E40\u0E25\u0E02\u0E17\u0E35\u0E48\u0E2D\u0E49\u0E32\u0E07\u0E2D\u0E34\u0E07", " ", jsxRuntime.jsx("span", { className: "font-mono text-base font-semibold text-foreground", children: sent.ref })] })] }), jsxRuntime.jsxs(erpTheme.DialogFooter, { className: "flex-row items-center gap-2 sm:justify-between", children: [jsxRuntime.jsx("button", { type: "button", onClick: loadMine, className: "mr-auto " + LINK_BUTTON, children: "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21\u0E17\u0E35\u0E48\u0E2A\u0E48\u0E07\u0E41\u0E25\u0E49\u0E27" }), jsxRuntime.jsx(erpTheme.Button, { type: "button", onClick: closeHelp, children: "\u0E1B\u0E34\u0E14" })] })] })) : null, view === "mine" ? (jsxRuntime.jsxs("div", { className: "grid gap-4", children: [jsxRuntime.jsx(erpTheme.DialogHeader, { children: jsxRuntime.jsxs(erpTheme.DialogTitle, { className: "flex items-center gap-2", children: [jsxRuntime.jsx(BackButton, { onClick: () => setView("form") }), "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21\u0E17\u0E35\u0E48\u0E2A\u0E48\u0E07\u0E41\u0E25\u0E49\u0E27"] }) }), mine === null && !mineError ? jsxRuntime.jsx(Loading, {}) : null, mineError ? (jsxRuntime.jsx("p", { role: "alert", className: "text-sm text-destructive", children: mineError })) : null, mine && mine.length === 0 ? (jsxRuntime.jsx("p", { className: "py-6 text-sm text-muted-foreground", children: "\u0E22\u0E31\u0E07\u0E44\u0E21\u0E48\u0E21\u0E35\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21" })) : null, mine && mine.length > 0 ? (jsxRuntime.jsx("ul", { className: "grid gap-3", children: mine.map(m => {
+                                const entries = helpThread(m);
+                                const last = entries[entries.length - 1];
+                                return (jsxRuntime.jsxs("li", { className: "rounded-lg border border-border", children: [jsxRuntime.jsxs("button", { type: "button", onClick: () => openThread(m.id), "aria-label": `เปิด ${m.ref}`, className: "block w-full rounded-lg p-3 text-left hover:bg-accent/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: [jsxRuntime.jsxs("span", { className: "flex flex-wrap items-center gap-x-2 gap-y-1 text-xs text-muted-foreground", children: [jsxRuntime.jsx("span", { className: "font-mono font-semibold text-foreground", children: m.ref }), jsxRuntime.jsx("span", { children: KIND_LABEL[m.kind] ?? m.kind }), jsxRuntime.jsx("span", { children: when(m.created_at) }), jsxRuntime.jsx("span", { className: `ml-auto rounded-full px-2 py-0.5 font-medium ${STATUS_TONE[m.status] ?? ""}`, children: STATUS_LABEL[m.status] ?? m.status }), jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-4 w-4", "aria-hidden": "true" })] }), jsxRuntime.jsx("span", { className: "mt-2 line-clamp-3 block whitespace-pre-wrap break-words text-sm", children: m.message }), last ? (jsxRuntime.jsxs("span", { className: "mt-2 line-clamp-2 block rounded-md bg-muted px-3 py-2 text-xs", children: [jsxRuntime.jsxs("span", { className: "text-muted-foreground", children: [last.author === "staff" ? "ทีม AntNiti" : "คุณ", " \u00B7 ", when(last.created_at)] }), jsxRuntime.jsx("span", { className: "mt-0.5 block whitespace-pre-wrap break-words text-sm", children: last.body })] })) : null] }), m.images && m.images.length > 0 ? (jsxRuntime.jsx("div", { className: "px-3 pb-3", children: jsxRuntime.jsx(HelpImageStrip, { images: m.images, size: "sm" }) })) : null] }, m.id));
+                            }) })) : null] })) : null, view === "thread" ? (jsxRuntime.jsxs("div", { className: "grid gap-4", children: [jsxRuntime.jsx(erpTheme.DialogHeader, { children: jsxRuntime.jsxs(erpTheme.DialogTitle, { className: "flex items-center gap-2", children: [jsxRuntime.jsx(BackButton, { onClick: loadMine }), jsxRuntime.jsx("span", { className: "font-mono", children: thread?.ref ?? threadKey }), thread ? (jsxRuntime.jsx("span", { className: `ml-auto mr-7 rounded-full px-2 py-0.5 text-xs font-medium ${STATUS_TONE[thread.status] ?? ""}`, children: STATUS_LABEL[thread.status] ?? thread.status })) : null] }) }), thread === null && !threadError ? jsxRuntime.jsx(Loading, {}) : null, threadError ? (jsxRuntime.jsx("p", { role: "alert", className: "text-sm text-destructive", children: threadError })) : null, thread ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("ol", { className: "grid gap-3", "aria-label": "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21", children: [jsxRuntime.jsx(ThreadBubble, { mine: true, label: `คุณ · ${KIND_LABEL[thread.kind] ?? thread.kind}`, at: thread.created_at, body: thread.message, images: thread.images }), helpThread(thread).map(e => (jsxRuntime.jsx(ThreadBubble, { mine: e.author === "customer", label: e.author === "staff" ? "ทีม AntNiti" : "คุณ", at: e.created_at, body: e.body, images: e.images }, e.id)))] }), jsxRuntime.jsxs("form", { onSubmit: sendFollowUp, className: "grid gap-3 border-t border-border pt-4" + dropRing(followDrop.over), ...followDrop.props, children: [jsxRuntime.jsxs("div", { className: "grid gap-2", children: [jsxRuntime.jsx(erpTheme.Label, { htmlFor: "erp-help-followup", children: "\u0E15\u0E2D\u0E1A\u0E01\u0E25\u0E31\u0E1A" }), jsxRuntime.jsx(erpTheme.Textarea, { id: "erp-help-followup", rows: 3, maxLength: MAX_MESSAGE, required: true, value: followDraft, onChange: e => setFollowDraft(e.target.value), className: "min-h-[88px] resize-y" })] }), jsxRuntime.jsx(HelpAttachField, { state: followImages, disabled: following, id: "erp-help-followup-images" }), followError ? (jsxRuntime.jsx("p", { role: "alert", className: "text-sm text-destructive", children: followError })) : null, jsxRuntime.jsx(erpTheme.DialogFooter, { className: "flex-row items-center justify-end gap-2", children: jsxRuntime.jsxs(erpTheme.Button, { type: "submit", disabled: !followTrimmed || following, children: [following ? jsxRuntime.jsx(lucideReact.Loader2, { className: "mr-1 h-4 w-4 animate-spin" }) : null, "\u0E2A\u0E48\u0E07"] }) })] })] })) : null] })) : null] }) }));
+}
+function BackButton({ onClick }) {
+    return (jsxRuntime.jsx("button", { type: "button", "aria-label": "\u0E01\u0E25\u0E31\u0E1A", onClick: onClick, className: "-ml-1 grid size-8 shrink-0 place-items-center rounded-md text-muted-foreground hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: jsxRuntime.jsx(lucideReact.ArrowLeft, { className: "h-4 w-4" }) }));
+}
+function Loading() {
+    return (jsxRuntime.jsxs("div", { className: "flex items-center gap-2 py-6 text-sm text-muted-foreground", children: [jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 animate-spin" }), "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E42\u0E2B\u0E25\u0E14"] }));
+}
+/** One message in the thread: the author's own on the right, AntNiti's on the left. */
+function ThreadBubble({ mine, label, at, body, images, }) {
+    return (jsxRuntime.jsx("li", { className: "flex " + (mine ? "justify-end pl-6" : "justify-start pr-6"), children: jsxRuntime.jsxs("div", { className: "min-w-0 max-w-full rounded-lg px-3 py-2 " +
+                (mine ? "border border-primary/30 bg-primary/5" : "bg-muted"), children: [jsxRuntime.jsxs("p", { className: "text-xs text-muted-foreground", children: [label, " \u00B7 ", when(at)] }), jsxRuntime.jsx("p", { className: "mt-1 whitespace-pre-wrap break-words text-sm", children: body }), jsxRuntime.jsx(HelpImageStrip, { images: images })] }) }));
 }
 
-function DeniedCard() {
-    return (jsxRuntime.jsx(AccessDenied, { message: "\u0E04\u0E38\u0E13\u0E44\u0E21\u0E48\u0E21\u0E35\u0E2A\u0E34\u0E17\u0E18\u0E34\u0E4C\u0E40\u0E02\u0E49\u0E32\u0E16\u0E36\u0E07\u0E2B\u0E19\u0E49\u0E32\u0E19\u0E35\u0E49 \u0E2B\u0E32\u0E01\u0E04\u0E34\u0E14\u0E27\u0E48\u0E32\u0E04\u0E27\u0E23\u0E40\u0E02\u0E49\u0E32\u0E16\u0E36\u0E07\u0E44\u0E14\u0E49 \u0E01\u0E23\u0E38\u0E13\u0E32\u0E15\u0E34\u0E14\u0E15\u0E48\u0E2D\u0E1C\u0E39\u0E49\u0E14\u0E39\u0E41\u0E25\u0E23\u0E30\u0E1A\u0E1A\u0E02\u0E2D\u0E07\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" }));
-}
 /**
- * Permission gate for a page subtree. Looks up the current pathname in the
- * permission rules map (live rules from `PermissionRulesProvider`, layered
- * over the optional `fallbackRulesMap`), passes the resolved required roles
- * into the host's `usePermission` probe, and renders one of:
+ * Top-level app chrome: sticky header, sidebar slot, content gutter and the
+ * session/org-context plumbing that both Accounting and HR need. Apps wrap
+ * it inside their `SidebarProvider` (server-rendered with the cookie-backed
+ * `defaultOpen`) and their `ERPProvider`, then pass app-specific bits as
+ * props.
  *
- * 1. rules / probe still loading → `null` on FIRST load only (let Suspense /
- *    loading.tsx show); once this subtree has been granted access, a later
- *    loading state keeps the children mounted — see the note below
- * 2. no rule covers this path → deny (fail closed)
- * 3. rule is explicit public (`[]`) → children
- * 4. probe says no access → deny card
- * 5. otherwise → children
+ * The padding contract is deliberately owned here so future style tweaks
+ * (e.g. the recent left/right/bottom gutter pass) propagate to both apps via
+ * an erp-shell bump — domain components must NOT add their own root padding
+ * or content gets indented twice.
  */
-function PermissionProvider({ children, usePermission, fallbackRulesMap, }) {
-    const pathname = navigation.usePathname();
-    const { rulesMap, isLoading: rulesLoading } = usePermissionRules();
-    const mergedMap = React.useMemo(() => {
-        if (!fallbackRulesMap)
-            return rulesMap;
-        // live rules win over fallback when both define the same key
-        return { ...fallbackRulesMap, ...rulesMap };
-    }, [rulesMap, fallbackRulesMap]);
-    const lookup = React.useMemo(() => resolveUiRoutePermission(pathname, mergedMap), [pathname, mergedMap]);
-    // Hook must run unconditionally (rules of hooks).
-    const { hasPermission, isLoading } = usePermission({
-        requiredRoles: lookup.roles,
-    });
-    // Returning null unmounts the page. That is fine before anything has been
-    // shown, and destructive afterwards: next-auth flips its status back to
-    // "loading" on every session update() — one runs every 4 minutes — and a
-    // rules hook that reports loading on that transient took the page down with
-    // it. Users filling a long form watched everything they had typed vanish,
-    // which reads as a spontaneous page refresh.
-    //
-    // So a loading state only blanks the subtree until access has been granted
-    // once. After that the children stay mounted while the check re-settles; the
-    // API still enforces access on every request, and a genuine loss of
-    // permission surfaces as a denied response rather than a wiped form.
+function AppLayoutShell({ children, sidebar, loadingComponent, breadcrumb, permissionProvider, organizationId, setOrganizationId, organizations, signInUrl, selectOrganizationUrl, chrome = "brand", workspaceHeader = "brand", headerEnd, mobileBrand, showHelp = true, helpApp, }) {
+    const { data: session, status } = react.useSession();
+    const { open, setOpen } = useSidebar();
+    const router = navigation.useRouter();
+    const params = navigation.useParams();
+    const code = params?.code;
+    const extendedSession = session;
+    // Track once-authenticated so a transient accessToken drop during the
+    // periodic session refresh (SessionRefreshTrigger every 4 min) doesn't
+    // blank the whole page. The initial-load gate below still handles cold
+    // start; once we've seen a real token we render children optimistically
+    // and let the API layer surface a real 401 if the token actually died.
+    const hasSeenAccessTokenRef = React.useRef(false);
+    React.useEffect(() => {
+        if (extendedSession?.accessToken)
+            hasSeenAccessTokenRef.current = true;
+    }, [extendedSession?.accessToken]);
+    // Find the org from the URL `[code]` so we can detect a context mismatch
+    // (the user bookmarked a different org than the cookie remembers).
+    const orgFromCode = React__namespace.useMemo(() => {
+        if (!code || !organizations.length)
+            return null;
+        return (organizations.find(org => org.code === code || String(org.id) === code) ?? null);
+    }, [code, organizations]);
+    // Sync state: when the URL code points at a different org than the cookie,
+    // trust the URL and update the cookie. Otherwise do nothing — the user
+    // wins ties via the in-app org switcher.
+    React.useEffect(() => {
+        if (!code)
+            return;
+        if (!organizations.length)
+            return;
+        if (!orgFromCode)
+            return;
+        if (String(organizationId) !== String(orgFromCode.id)) {
+            void setOrganizationId(orgFromCode.id);
+        }
+    }, [
+        orgFromCode,
+        organizationId,
+        setOrganizationId,
+        code,
+        organizations.length,
+    ]);
+    // Key for the content subtree. It exists so switching organizations throws
+    // away the previous org's component state — but it must react ONLY to a real
+    // switch. organizationId legitimately passes through null while the context
+    // re-settles (session resolving, cookie write in flight), and keying on that
+    // unmounted and remounted the entire page: forms lost their loaded values,
+    // in-flight edits vanished, and settings pickers snapped back to defaults.
     //
-    // The grant is remembered per pathname, not per mount. This provider lives in
-    // the layout, so it survives every in-app navigation — a bare boolean would
-    // carry one page's grant onto the next route and flash a page the user may
-    // not be allowed to see while its own check is still running.
-    const grantedForPathRef = React.useRef(null);
-    const grantedHere = grantedForPathRef.current === pathname;
-    if (rulesLoading && !grantedHere) {
-        return null;
-    }
-    // Unknown route → deny. Only explicit `required_child_groups: []` is public.
-    if (!lookup.matched) {
-        return jsxRuntime.jsx(DeniedCard, {});
+    // Holding the last known id makes a transient null a no-op while a genuine
+    // org-to-org switch still changes the key.
+    const lastOrgKeyRef = React__namespace.useRef("no-org");
+    const currentOrgKey = organizationId === null ||
+        organizationId === undefined ||
+        String(organizationId).trim() === ""
+        ? null
+        : String(organizationId);
+    if (currentOrgKey !== null) {
+        lastOrgKeyRef.current = currentOrgKey;
     }
-    if (lookup.roles.length === 0) {
-        grantedForPathRef.current = pathname;
-        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: children });
+    const contentOrgKey = lastOrgKeyRef.current;
+    // Hold the page back until the active organisation is the one the URL names.
+    //
+    // The sync effect above writes the cookie through a server action, which is
+    // a round trip. Until it lands, getOrgFromCookie() still answers with the
+    // previous organisation and every request the page fires on mount carries
+    // it — so /O26000021/work-record asked about O26000033 and was correctly
+    // told there was nothing there. An empty table is the mild version: the
+    // create form posts to the same header, so a record could be filed against
+    // a company the user was not looking at.
+    //
+    // Only while the two genuinely disagree. A code naming no organisation of
+    // the caller's is left to the app to refuse, and a page with no code in its
+    // path is unaffected.
+    const orgContextIsStale = !!orgFromCode &&
+        organizationId !== null &&
+        organizationId !== undefined &&
+        String(organizationId) !== String(orgFromCode.id);
+    // ≤1024px: sidebar renders as a modal overlay (backdrop dims content). >1024px:
+    // sidebar is docked and the content gets a left margin to clear it.
+    const [isSidebarModalLayout, setIsSidebarModalLayout] = React__namespace.useState(false);
+    React.useEffect(() => {
+        const mq = window.matchMedia("(max-width: 1024px)");
+        const sync = () => setIsSidebarModalLayout(mq.matches);
+        sync();
+        mq.addEventListener("change", sync);
+        return () => mq.removeEventListener("change", sync);
+    }, []);
+    // Help opened from the drawer's user menu: the drawer steps aside so the
+    // dialog is the only thing on a phone's screen.
+    const helpOpen = useHelpOpen();
+    React.useEffect(() => {
+        if (helpOpen && isSidebarModalLayout && open)
+            setOpen(false);
+    }, [helpOpen, isSidebarModalLayout, open, setOpen]);
+    // Wait for session to load (initial load only). When refetching/updating we
+    // already have a session — don't flash the full-screen loader.
+    if (status === "loading" && !session) {
+        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent });
     }
-    if (isLoading && !grantedHere) {
-        return null;
+    // Session loaded but no accessToken AND we've never seen one → real auth
+    // failure (token refresh gave nothing back on cold start), bounce through
+    // signin. If we HAVE seen one before, the drop is almost certainly the
+    // in-flight periodic refresh (SessionRefreshTrigger). Don't redirect on
+    // that transient — the JWT callback will settle in a moment and API
+    // calls will keep working with the still-valid cookie.
+    if (status === "authenticated" &&
+        !extendedSession?.accessToken &&
+        !hasSeenAccessTokenRef.current) {
+        if (typeof window !== "undefined") {
+            const url = new URL(signInUrl, window.location.origin);
+            url.searchParams.set("error", "NoAccessToken");
+            url.searchParams.set("callbackUrl", window.location.pathname);
+            window.location.href = url.toString();
+        }
+        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent });
     }
-    if (!hasPermission && !isLoading) {
-        return jsxRuntime.jsx(DeniedCard, {});
+    // Only blank the page when we've never seen a token — otherwise the
+    // periodic session refresh would visibly flash the loader every 4 min.
+    if (!extendedSession?.accessToken && !hasSeenAccessTokenRef.current) {
+        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent });
     }
-    grantedForPathRef.current = pathname;
-    return jsxRuntime.jsx(jsxRuntime.Fragment, { children: children });
-}
-
-/** Cookie name for the cross-subdomain theme choice. */
-const THEME_COOKIE = "erp-theme";
-/**
- * Parent domain to scope the cookie to, so every `*.antniti.com` app reads the
- * same value. Returns `null` on localhost / bare IPs (host-only cookie).
- */
-function sharedCookieDomain() {
-    if (typeof window === "undefined")
-        return null;
-    const host = window.location.hostname;
-    if (host === "localhost" || /^[0-9.]+$/.test(host))
-        return null;
-    const parts = host.split(".");
-    if (parts.length < 2)
-        return null;
-    return "." + parts.slice(-2).join(".");
-}
-function readThemeCookie() {
-    if (typeof document === "undefined")
-        return null;
-    const match = document.cookie.match(new RegExp("(?:^|; )" + THEME_COOKIE + "=([^;]*)"));
-    return match ? decodeURIComponent(match[1]) : null;
+    if (!code) {
+        router.push(selectOrganizationUrl);
+        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingComponent });
+    }
+    // When the sidebar is docked-open it consumes 21.5rem on the left; otherwise
+    // the content takes the full width and we add a left gutter inside.
+    const workspace = chrome === "workspace";
+    const contentMargin = open && !isSidebarModalLayout
+        ? workspace
+            ? "ml-[244px]"
+            : "ml-[21.5rem]"
+        : "";
+    const needsLeftGutter = workspace || !(open && !isSidebarModalLayout);
+    const wrap = permissionProvider ?? ((c) => c);
+    return (jsxRuntime.jsxs("div", { className: "flex min-h-screen w-full bg-background", children: [open && (jsxRuntime.jsx("div", { className: "fixed left-0 top-0 z-50 h-screen", children: sidebar })), open && isSidebarModalLayout && (jsxRuntime.jsx("button", { type: "button", "aria-label": "\u0E1B\u0E34\u0E14\u0E40\u0E21\u0E19\u0E39", className: "fixed inset-0 z-40 bg-black/50", onClick: () => setOpen(false) })), jsxRuntime.jsx("div", { className: cx("relative flex min-w-0 flex-1 flex-col transition-all", contentMargin), children: jsxRuntime.jsxs("main", { className: cx("flex flex-1 flex-col min-h-screen", workspace ? "gap-0" : "gap-4"), children: [workspace ? (jsxRuntime.jsxs("div", { className: cx("sticky top-0 z-30 shrink-0 w-full", workspaceHeader === "light" &&
+                                "border-b border-border bg-card/85 backdrop-blur-sm"), style: workspaceHeader === "light"
+                                ? WORKSPACE_LIGHT_HEADER_VARS
+                                : WORKSPACE_HEADER_VARS, children: [workspaceHeader === "light" ? null : (jsxRuntime.jsx(HeaderBackground, { className: "rounded-none" })), jsxRuntime.jsxs("header", { className: cx("relative z-10 flex w-full items-center gap-3 text-[var(--header-fg)]", workspaceHeader === "light"
+                                        ? "min-h-[66px] px-3 py-2 sm:min-h-[72px] sm:px-[22px] lg:min-h-[82px] lg:px-8"
+                                        : "min-h-[72px] px-[18px] py-3 sm:px-6 lg:min-h-[88px] lg:px-10"), children: [isSidebarModalLayout ? (
+                                        // As in the design: the mark, then a menu button, and the
+                                        // organisation on the right — no trail, no title, so the
+                                        // organisation's name has the room it needs on a phone.
+                                        jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [mobileBrand ? (jsxRuntime.jsx("div", { className: "shrink-0", children: mobileBrand })) : null, jsxRuntime.jsx("button", { type: "button", onClick: () => setOpen(!open), "aria-label": open ? "ปิดเมนู" : "เปิดเมนู", className: "grid size-[34px] shrink-0 place-items-center rounded-lg text-[var(--header-fg-muted)] transition-colors hover:bg-[var(--header-hover)] hover:text-[var(--header-fg)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--header-fg-muted)]", children: jsxRuntime.jsx(lucideReact.LayoutGrid, { className: "size-5", strokeWidth: 1.65 }) })] })) : (jsxRuntime.jsx(SidebarTrigger, { className: "shrink-0 text-[var(--header-fg-muted)] hover:bg-[var(--header-hover)] hover:text-[var(--header-fg)] [&_svg]:!text-current" })), jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-1 flex-col justify-center gap-0.5", children: [jsxRuntime.jsx("div", { className: "hidden min-w-0 sm:block", children: breadcrumb }), jsxRuntime.jsx("div", { id: "header-title", className: "min-w-0 max-sm:hidden" })] }), headerEnd || showHelp ? (jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center gap-3 sm:gap-5", children: [headerEnd, showHelp ? jsxRuntime.jsx(HelpButton, {}) : null] })) : null] })] })) : (jsxRuntime.jsxs("div", { className: "sticky top-0 z-30 shrink-0 w-full", children: [jsxRuntime.jsx(HeaderBackground, {}), jsxRuntime.jsxs("header", { className: "relative shrink-0 gap-2 py-4 h-auto min-h-[123.5px] w-full z-10", children: [jsxRuntime.jsxs("div", { className: "flex w-full items-center gap-2 px-3 sm:px-4 lg:px-6", children: [jsxRuntime.jsx(SidebarTrigger, { className: "shrink-0 text-white hover:bg-white/10" }), jsxRuntime.jsx("div", { className: "flex-1 min-w-0", children: breadcrumb }), headerEnd || showHelp ? (jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center gap-3", children: [headerEnd, showHelp ? jsxRuntime.jsx(HelpButton, {}) : null] })) : null] }), jsxRuntime.jsx("div", { id: "header-title" })] })] })), jsxRuntime.jsx(React.Suspense, { fallback: jsxRuntime.jsx("div", { className: "relative z-10 min-h-[calc(100vh-8rem)]", children: jsxRuntime.jsx("div", { className: "flex h-full items-center justify-center", children: jsxRuntime.jsxs("div", { className: "space-y-4 text-center", children: [jsxRuntime.jsx("div", { className: "mx-auto h-8 w-8 animate-spin rounded-full border-b-2 border-primary" }), jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E42\u0E2B\u0E25\u0E14..." })] }) }) }), children: jsxRuntime.jsx("div", { className: workspace
+                                    ? "relative z-10 px-[18px] pt-[26px] pb-4 sm:px-6 lg:px-10 lg:pt-[38px]"
+                                    : cx("relative z-10 pr-6", needsLeftGutter && "pl-6"), children: orgContextIsStale ? loadingComponent : wrap(children) }, `org-${contentOrgKey}`) })] }) }), showHelp ? jsxRuntime.jsx(HelpDialogHost, { app: helpApp, orgCode: code }) : null] }));
 }
-function writeThemeCookie(value) {
-    if (typeof document === "undefined")
-        return;
-    const domain = sharedCookieDomain();
-    const parts = [
-        `${THEME_COOKIE}=${encodeURIComponent(value)}`,
-        "path=/",
-        "max-age=31536000", // 1 year
-        "SameSite=Lax",
-    ];
-    if (domain)
-        parts.push(`domain=${domain}`);
-    document.cookie = parts.join("; ");
+/** Local tiny classnames helper — avoids pulling clsx/tailwind-merge into
+ *  the shell just for the layout file. Falsy values are skipped. */
+function cx(...parts) {
+    return parts.filter(Boolean).join(" ");
 }
+
 /**
- * Bridges next-themes (per-origin localStorage) with a cookie scoped to the
- * parent domain, so the light/dark/system choice is shared across the
- * accounting / HR / platform subdomains.
- *
- * Local storage wins when it already has a value (H57): adopting the shared
- * cookie first used to overwrite an explicit choice — including one set via
- * DevTools — and write `theme=light` back on every load whenever the cookie
- * still said light. Push the local value into the cookie instead so sibling
- * apps catch up.
+ * The product mark at the top of the workspace sidebar: the app icon, the
+ * name, and a spaced caption beneath it.
  */
-function ThemeCookieSync() {
-    const { theme, setTheme } = nextThemes.useTheme();
-    const skipFirstWrite = React__namespace.useRef(true);
-    React__namespace.useEffect(() => {
-        const local = typeof window !== "undefined"
-            ? window.localStorage.getItem("theme")
-            : null;
-        const cookie = readThemeCookie();
-        if (local) {
-            if (local !== theme)
-                setTheme(local);
-            writeThemeCookie(local);
-        }
-        else if (cookie) {
-            if (cookie !== theme)
-                setTheme(cookie);
-        }
-        else if (theme) {
-            writeThemeCookie(theme);
-        }
-        // Run once on mount — `theme` is intentionally not a dependency here.
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
-    React__namespace.useEffect(() => {
-        // Skip the initial render; only persist genuine changes (incl. the
-        // setTheme() triggered by adopting storage above — harmless re-write).
-        if (skipFirstWrite.current) {
-            skipFirstWrite.current = false;
-            return;
-        }
-        if (theme)
-            writeThemeCookie(theme);
-    }, [theme]);
-    return null;
-}
-function ThemeProvider({ children, ...props }) {
-    return (jsxRuntime.jsxs(nextThemes.ThemeProvider, { ...props, children: [jsxRuntime.jsx(ThemeCookieSync, {}), children] }));
+function WorkspaceBrand({ name, caption, mark, href, compact = false, className, }) {
+    const body = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { className: erpTheme.cn("grid shrink-0 place-items-center overflow-hidden rounded-[14px] [&>img]:size-full [&>img]:object-cover", compact ? "size-9 rounded-[11px]" : "size-11"), children: mark }), compact ? (jsxRuntime.jsx("span", { className: "sr-only", children: name })) : (jsxRuntime.jsxs("span", { className: "min-w-0", children: [jsxRuntime.jsx("span", { className: "block truncate text-[25px] leading-tight font-extrabold tracking-[-0.05em]", children: name }), caption ? (jsxRuntime.jsx("small", { className: "-mt-0.5 block truncate text-[9px] font-semibold tracking-[0.29em] text-muted-foreground", children: caption })) : null] }))] }));
+    const cls = erpTheme.cn("flex items-center gap-[11px] rounded-lg focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", !compact && "px-4", className);
+    return href ? (jsxRuntime.jsx(Link, { href: href, className: cls, "aria-label": compact ? name : undefined, children: body })) : (jsxRuntime.jsx("div", { className: cls, children: body }));
 }
 
-const defaultFlags = {
-    enableAdvancedReporting: true,
-    enableMultiCurrency: false,
-    enableThaiTaxCalculation: true,
-    enableProcurementWorkflow: true,
-    enableInventoryTracking: true,
-    enableAuditTrail: true,
-    enableAdvancedFilter: true,
-    filterFlag: false,
-    setFilterFlag: () => { },
-};
-const FeatureFlagsContext = React.createContext(defaultFlags);
-function FeatureFlagsProvider({ children, flags = {}, }) {
-    const [filterFlag, setFilterFlag] = React.useState(false);
-    const mergedFlags = {
-        ...defaultFlags,
-        ...flags,
-        filterFlag: flags.filterFlag ?? filterFlag,
-        setFilterFlag: (flag) => {
-            setFilterFlag(flag);
-            if (typeof flags.setFilterFlag === "function") {
-                flags.setFilterFlag(flag);
-            }
-        },
-    };
-    return (jsxRuntime.jsx(FeatureFlagsContext.Provider, { value: mergedFlags, children: children }));
-}
-function useFeatureFlags() {
-    const context = React.useContext(FeatureFlagsContext);
-    if (!context) {
-        throw new Error("useFeatureFlags must be used within a FeatureFlagsProvider");
-    }
-    return context;
-}
-function useFeatureFlag(flag) {
-    const flags = useFeatureFlags();
-    return flags[flag];
+function isExternal(href) {
+    return /^https?:\/\//i.test(href);
 }
-
-const getAxiosErrorMessage$1 = (error) => {
-    if (error.response?.data?.message) {
-        return error.response.data.message;
-    }
-    if (error.message) {
-        return error.message;
-    }
-    return "An unknown error occurred";
-};
-const formatError = (handlerName, error) => {
-    const axiosError = error;
-    const message = getAxiosErrorMessage$1(axiosError);
-    const isOrgRequired = message.includes("Organization context is required") ||
-        message.includes("organization_id") ||
-        message.includes("X-Organization-ID");
-    if (isOrgRequired) {
-        // Expected when no org selected yet (e.g. select-organization page).
-        console.warn(`[React Query] ${handlerName} skipped (no organization context): ${message}`);
-        return;
-    }
-};
 /**
- * Default React Query config used across ERP apps:
- *   - 2 retries on queries / 1 on mutations, exponential backoff
- *   - 5 min staleTime, refetchOnWindowFocus
- *   - swallows "no org context" errors to silence noise on the
- *     select-organization page
- *
- * Apps can compose on top of this — pass the returned config to `new QueryClient(...)`
- * directly or spread + override default options.
+ * The card at the foot of the workspace sidebar that points someone who
+ * does not know where to start at the place that will tell them.
  */
-const getQueryClientConfig = () => ({
-    defaultOptions: {
-        queries: {
-            retry: 2,
-            retryDelay: attemptIndex => Math.min(1000 * 2 ** attemptIndex, 30000),
-            staleTime: 5 * 60 * 1000,
-            refetchOnWindowFocus: true,
-        },
-        mutations: {
-            // NEVER auto-retry a mutation. Unlike a query, a mutation is a side
-            // effect on a non-idempotent endpoint (submit, create, approve), and
-            // React Query cannot tell "the network dropped" from "the server
-            // rejected this on business grounds".
-            //
-            // With retry: 1 every failed mutation fired twice. Two visible
-            // consequences: a rejected submit showed up as two failed POSTs in the
-            // network tab, and — far worse — a create whose response was lost in
-            // flight would be re-sent and duplicate the record server-side.
-            //
-            // Retrying is the caller's decision, not a global default: the user
-            // sees the error and presses the button again.
-            retry: 0,
-        },
-    },
-    queryCache: new reactQuery.QueryCache({
-        onError: error => formatError("Query", error),
-    }),
-    mutationCache: new reactQuery.MutationCache({
-        onError: error => formatError("Mutation", error),
-    }),
-});
+function SidebarHelpCard({ title, description, actionLabel, href, icon, className, }) {
+    const external = isExternal(href);
+    const action = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [actionLabel, jsxRuntime.jsx(lucideReact.ArrowRight, { className: "size-[15px]" })] }));
+    const actionClass = "mt-3 flex w-full items-center justify-between text-xs font-semibold text-primary hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded";
+    return (jsxRuntime.jsxs("div", { className: erpTheme.cn("mx-1.5 mb-5 rounded-[13px] border border-primary/10 bg-gradient-to-br from-primary/[0.06] to-primary/[0.02] px-3.5 py-4", className), children: [jsxRuntime.jsx("span", { className: "mb-[7px] block text-primary/70", children: icon ?? jsxRuntime.jsx(lucideReact.Compass, { className: "size-6", strokeWidth: 1.6 }) }), jsxRuntime.jsx("strong", { className: "block text-xs font-semibold", children: title }), description ? (jsxRuntime.jsx("p", { className: "mt-[7px] text-xs leading-[1.7] text-muted-foreground", children: description })) : null, external ? (jsxRuntime.jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", className: actionClass, children: action })) : (jsxRuntime.jsx(Link, { href: href, className: actionClass, children: action }))] }));
+}
+/** A quiet row under the help card — the manual, the support chat. */
+function SidebarHelpLink({ label, href, icon, className }) {
+    const external = isExternal(href);
+    const cls = erpTheme.cn("flex w-full items-center gap-3 rounded-[10px] px-3.5 py-[11px] text-xs font-medium text-sidebar-foreground/70 transition-colors hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", className);
+    const body = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [icon ? jsxRuntime.jsx("span", { className: "shrink-0 [&>svg]:size-[18px]", children: icon }) : null, jsxRuntime.jsx("span", { className: "flex-1 truncate", children: label }), external ? jsxRuntime.jsx(lucideReact.ArrowUpRight, { className: "size-4 shrink-0" }) : null] }));
+    return external ? (jsxRuntime.jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", className: cls, children: body })) : (jsxRuntime.jsx(Link, { href: href, className: cls, children: body }));
+}
 
-function ReactQueryProvider({ children }) {
-    // Create a new QueryClient instance for each render to avoid SSR issues.
-    const [queryClient] = React.useState(() => new reactQuery.QueryClient(getQueryClientConfig()));
-    return (jsxRuntime.jsxs(reactQuery.QueryClientProvider, { client: queryClient, children: [children, jsxRuntime.jsx(reactQueryDevtools.ReactQueryDevtools, { client: queryClient, initialIsOpen: false })] }));
+/**
+ * Central "no access" screen shared by every policy check (route-level
+ * PermissionProvider and page-level PermissionGateShell). One look everywhere:
+ * an illustration, a 403 headline, the page-specific reason, and recovery
+ * actions.
+ */
+function AccessDenied({ title = "ขออภัย, คุณไม่มีสิทธิ์เข้าถึงหน้านี้ (403)", message = "คุณไม่มีสิทธิ์เข้าถึงหน้านี้ ขออภัยในความไม่สะดวก", homeHref, homeLabel = "กลับไปหน้าหลัก", supportHref, supportLabel = "ติดต่อฝ่ายสนับสนุน", fullScreen = true, className, }) {
+    // "/" is not the home page inside an app — it bounces to organization
+    // selection, so the button read "กลับไปหน้าหลัก" and dropped the user into a
+    // picker for the org they were already in. Send them to that org's home.
+    const params = navigation.useParams();
+    const code = typeof params?.code === "string" ? params.code : "";
+    const homeTarget = homeHref ?? (code ? `/${code}` : "/");
+    const go = (href) => {
+        if (typeof window !== "undefined")
+            window.location.href = href;
+    };
+    const wrapperClass = [
+        "flex min-w-0 flex-1 items-center justify-center p-4",
+        fullScreen ? "min-h-[70vh]" : "",
+        className ?? "",
+    ]
+        .filter(Boolean)
+        .join(" ");
+    return (jsxRuntime.jsx("div", { className: wrapperClass, children: jsxRuntime.jsx("div", { className: "relative w-full max-w-3xl overflow-hidden rounded-2xl border border-border/60 bg-card/60 p-8 shadow-sm backdrop-blur sm:p-10", children: jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-8 text-center sm:flex-row sm:text-left", children: [jsxRuntime.jsxs("div", { className: "relative shrink-0", children: [jsxRuntime.jsx("div", { className: "absolute inset-0 rounded-full bg-destructive/20 blur-2xl" }), jsxRuntime.jsx("div", { className: "relative flex h-28 w-28 items-center justify-center rounded-3xl border border-border/60 bg-gradient-to-br from-muted/40 to-background shadow-inner", children: jsxRuntime.jsx("div", { className: "flex h-16 w-16 items-center justify-center rounded-full border border-destructive/40 bg-destructive/10", children: jsxRuntime.jsx(lucideReact.Ban, { className: "h-8 w-8 text-destructive", strokeWidth: 2.5 }) }) })] }), jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [jsxRuntime.jsx("h1", { className: "text-xl font-bold text-foreground sm:text-2xl", children: title }), message ? (jsxRuntime.jsx("p", { className: "mt-3 whitespace-pre-line text-sm leading-relaxed text-muted-foreground sm:text-base", children: message })) : null, jsxRuntime.jsxs("div", { className: "mt-6 flex flex-col gap-3 sm:flex-row", children: [jsxRuntime.jsxs(erpTheme.Button, { type: "button", onClick: () => go(homeTarget), className: "w-full sm:w-auto", children: [jsxRuntime.jsx(lucideReact.Home, { className: "mr-2 h-4 w-4" }), homeLabel] }), supportHref ? (jsxRuntime.jsxs(erpTheme.Button, { type: "button", variant: "outline", onClick: () => go(supportHref), className: "w-full sm:w-auto", children: [jsxRuntime.jsx(lucideReact.Headset, { className: "mr-2 h-4 w-4" }), supportLabel] })) : null] })] })] }) }) }));
 }
 
+const EMPLOYEE_RECORD_REQUIRED = "EMPLOYEE_RECORD_REQUIRED";
+const EMPLOYEE_RECORD_REQUIRED_EVENT = "erp:employee-record-required";
+const EMPLOYEE_RECORD_OK_EVENT = "erp:employee-record-ok";
 /**
- * Renders nothing. Runs during render (after SessionProvider, inside
- * QueryClientProvider) to seed the cached profile slot from the JWT-backed
- * session — so `useMyProfile` doesn't fire a redundant GET on initial load.
+ * Shown when the API refuses every request because the signed-in account has
+ * no employee record in this organisation.
  *
- * Generic over the profile shape; each app passes its own queryKey + mapper.
+ * A gate rather than a banner. Leave, attendance, approvals and payslips all
+ * identify a person by that record, so once the server started enforcing it
+ * every call fails — and without something that says so, the app becomes a
+ * screen of error toasts with no explanation and no way forward.
  */
-function SessionBackedProfileCacheSeeder({ queryKey, mapper, }) {
-    const { data: session, status } = react.useSession();
-    const queryClient = reactQuery.useQueryClient();
-    if (status === "authenticated" && session) {
-        const mapped = mapper(session);
-        if (mapped) {
-            const existing = queryClient.getQueryData(queryKey);
-            if (!existing) {
-                // updatedAt: 0 → immediately stale so observers still GET /myprofile
-                // for fields the JWT seed omits (avatar/signature paths).
-                queryClient.setQueryData(queryKey, mapped, { updatedAt: 0 });
-            }
-            else {
-                // Only overwrite when the mapped id changed — we don't know T's shape
-                // so we rely on a shallow id check via JSON tag if present.
-                const existingId = existing?.id;
-                const mappedId = mapped?.id;
-                if (existingId !== mappedId) {
-                    queryClient.setQueryData(queryKey, mapped, { updatedAt: 0 });
-                }
-            }
-        }
-    }
-    if (status === "unauthenticated") {
-        queryClient.removeQueries({ queryKey });
-    }
-    return null;
+function EmployeeRequiredGate({ platformBaseUrl, }) {
+    const [blocked, setBlocked] = React.useState(false);
+    const params = navigation.useParams();
+    const code = params?.code ?? "";
+    React.useEffect(() => {
+        const onBlocked = () => setBlocked(true);
+        const onOk = () => setBlocked(false);
+        window.addEventListener(EMPLOYEE_RECORD_REQUIRED_EVENT, onBlocked);
+        window.addEventListener(EMPLOYEE_RECORD_OK_EVENT, onOk);
+        return () => {
+            window.removeEventListener(EMPLOYEE_RECORD_REQUIRED_EVENT, onBlocked);
+            window.removeEventListener(EMPLOYEE_RECORD_OK_EVENT, onOk);
+        };
+    }, []);
+    if (!blocked)
+        return null;
+    const base = platformBaseUrl?.replace(/\/$/, "") ?? "";
+    const createHref = code ? `${base}/${code}/employee/create` : `${base}/`;
+    return (jsxRuntime.jsx("div", { className: "fixed inset-0 z-[100] flex items-center justify-center bg-background/95 p-6 backdrop-blur-sm", children: jsxRuntime.jsxs("div", { className: "w-full max-w-md space-y-5 text-center", children: [jsxRuntime.jsx(lucideReact.ContactRound, { className: "mx-auto h-12 w-12 text-muted-foreground" }), jsxRuntime.jsxs("div", { className: "space-y-2", children: [jsxRuntime.jsx("h1", { className: "text-lg font-semibold tracking-tight", children: "\u0E1A\u0E31\u0E0D\u0E0A\u0E35\u0E19\u0E35\u0E49\u0E22\u0E31\u0E07\u0E44\u0E21\u0E48\u0E44\u0E14\u0E49\u0E1C\u0E39\u0E01\u0E01\u0E31\u0E1A\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19" }), jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "\u0E25\u0E32 \u0E25\u0E07\u0E40\u0E27\u0E25\u0E32 \u0E40\u0E1A\u0E34\u0E01\u0E40\u0E07\u0E34\u0E19 \u0E41\u0E25\u0E30\u0E01\u0E32\u0E23\u0E2D\u0E19\u0E38\u0E21\u0E31\u0E15\u0E34 \u0E23\u0E30\u0E1A\u0E38\u0E15\u0E31\u0E27\u0E04\u0E19\u0E08\u0E32\u0E01\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19 \u0E08\u0E36\u0E07\u0E22\u0E31\u0E07\u0E43\u0E0A\u0E49\u0E07\u0E32\u0E19\u0E43\u0E19\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23\u0E19\u0E35\u0E49\u0E44\u0E21\u0E48\u0E44\u0E14\u0E49" })] }), jsxRuntime.jsxs("div", { className: "flex flex-wrap justify-center gap-2", children: [jsxRuntime.jsx(erpTheme.Button, { onClick: () => window.location.reload(), children: "\u0E25\u0E2D\u0E07\u0E43\u0E2B\u0E21\u0E48" }), jsxRuntime.jsx(erpTheme.Button, { variant: "outline", asChild: true, children: jsxRuntime.jsxs("a", { href: createHref, children: [jsxRuntime.jsx(lucideReact.UserPlus, { className: "mr-1 h-4 w-4" }), "\u0E2A\u0E23\u0E49\u0E32\u0E07\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E1E\u0E19\u0E31\u0E01\u0E07\u0E32\u0E19"] }) })] }), jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: "\u0E16\u0E49\u0E32\u0E04\u0E38\u0E13\u0E44\u0E21\u0E48\u0E21\u0E35\u0E2A\u0E34\u0E17\u0E18\u0E34\u0E4C\u0E41\u0E01\u0E49\u0E44\u0E02 \u0E43\u0E2B\u0E49\u0E41\u0E08\u0E49\u0E07\u0E1C\u0E39\u0E49\u0E14\u0E39\u0E41\u0E25\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" })] }) }));
 }
 
-const TOKEN_TTL_MS = 30000;
-let cachedToken = null;
-let cachedAt = 0;
-let inFlightTokenPromise = null;
-const readSessionToken = async () => {
-    const response = await fetch("/api/auth/session", {
-        credentials: "include",
-        cache: "no-store",
-    });
-    if (!response.ok)
-        return null;
-    const session = (await response.json());
-    return session.accessToken ?? null;
-};
-const getAccessToken = async (forceRefresh = false) => {
-    const now = Date.now();
-    if (!forceRefresh && cachedToken && now - cachedAt < TOKEN_TTL_MS) {
-        return cachedToken;
+const shellClassName = "flex min-w-0 flex-1 flex-col gap-6 overflow-x-hidden";
+/**
+ * Shared layout for “กำลังตรวจสอบสิทธิ์” (skeleton) and “ไม่มีสิทธิ์” (message).
+ * Renders `children` only when policy is loaded and access is granted.
+ */
+function PermissionGateShell({ policyLoading, hasPolicyAccess, deniedMessage, children, skeletonCount = 6, skeletonGridClassName = "grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3", skeletonVariant = "kpi", }) {
+    if (policyLoading) {
+        return (jsxRuntime.jsx("div", { className: shellClassName, children: jsxRuntime.jsx("div", { className: skeletonGridClassName, children: Array.from({ length: skeletonCount }).map((_, i) => (jsxRuntime.jsx(erpTheme.Card, { children: skeletonVariant === "kpi" ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(erpTheme.CardHeader, { className: "flex flex-row items-center justify-between pb-2", children: [jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-4 w-24" }), jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-4 w-4 rounded" })] }), jsxRuntime.jsxs(erpTheme.CardContent, { children: [jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-8 w-32 mb-2" }), jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-3 w-20" })] })] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(erpTheme.CardHeader, { className: "pb-2", children: jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-4 w-24" }) }), jsxRuntime.jsx(erpTheme.CardContent, { children: jsxRuntime.jsx(erpTheme.Skeleton, { className: "h-8 w-16" }) })] })) }, i))) }) }));
     }
-    if (!inFlightTokenPromise) {
-        inFlightTokenPromise = readSessionToken()
-            .then(token => {
-            cachedToken = token;
-            cachedAt = Date.now();
-            return token;
-        })
-            .finally(() => {
-            inFlightTokenPromise = null;
-        });
+    if (!hasPolicyAccess) {
+        return (jsxRuntime.jsx("div", { className: shellClassName, children: jsxRuntime.jsx(AccessDenied, { message: deniedMessage }) }));
     }
-    return inFlightTokenPromise;
-};
-const clearAccessTokenCache = () => {
-    cachedToken = null;
-    cachedAt = 0;
-};
+    return jsxRuntime.jsx(jsxRuntime.Fragment, { children: children });
+}
 
-class ApiError extends Error {
-    constructor(message, options) {
-        super(message);
-        Object.defineProperty(this, "status", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "code", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "field", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "details", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        this.name = "ApiError";
-        this.status = options?.status;
-        this.code = options?.code;
-        this.field = options?.field;
-        this.details = options?.details;
-    }
+const PermissionRulesContext = React.createContext(undefined);
+/**
+ * Generic provider — the consumer app passes in `data` (live fetch) and
+ * `fallbackPolicies` (static JSON). All apps share the same mapping logic
+ * (build a flat map of route_key/policy_key → required child groups).
+ */
+function PermissionRulesProvider({ children, data, isLoading = false, isError = false, fallbackPolicies = [], }) {
+    const rulesMap = React.useMemo(() => {
+        const m = {};
+        if (!data?.routes)
+            return m;
+        for (const row of data.routes) {
+            m[row.route_key] = row.required_child_groups ?? [];
+        }
+        return m;
+    }, [data]);
+    const policiesMap = React.useMemo(() => {
+        const m = {};
+        for (const row of fallbackPolicies) {
+            m[row.policy_key] = row.required_child_groups ?? [];
+        }
+        if (data?.policies?.length) {
+            for (const row of data.policies) {
+                m[row.policy_key] = row.required_child_groups ?? [];
+            }
+        }
+        return m;
+    }, [data, fallbackPolicies]);
+    const value = React.useMemo(() => ({
+        rulesMap,
+        policiesMap,
+        isLoading,
+        isError,
+        updatedAt: data?.updated_at ?? null,
+    }), [rulesMap, policiesMap, isLoading, isError, data?.updated_at]);
+    return (jsxRuntime.jsx(PermissionRulesContext.Provider, { value: value, children: children }));
 }
-const toApiError = (error) => {
-    if (error instanceof ApiError)
-        return error;
-    if (axios.isAxiosError(error)) {
-        const axiosErr = error;
-        const message = axiosErr.response?.data?.message ||
-            axiosErr.response?.data?.error ||
-            axiosErr.message ||
-            "Request failed";
-        return new ApiError(message, {
-            status: axiosErr.response?.status,
-            code: axiosErr.response?.data?.code,
-            field: axiosErr.response?.data?.field,
-            details: axiosErr.response?.data?.details,
-        });
-    }
-    if (error instanceof Error) {
-        return new ApiError(error.message);
+/**
+ * Read the permission rules. Outside the provider, report loading so
+ * fail-closed consumers (nav / gates) do not treat empty maps as "allow all".
+ */
+function usePermissionRules() {
+    const ctx = React.useContext(PermissionRulesContext);
+    if (!ctx) {
+        return {
+            rulesMap: {},
+            policiesMap: {},
+            isLoading: true,
+            isError: false,
+            updatedAt: null,
+        };
     }
-    return new ApiError(String(error));
-};
+    return ctx;
+}
 
-const isPlainObject = (value) => Object.prototype.toString.call(value) === "[object Object]";
-const visit = (value, cb) => {
-    if (Array.isArray(value)) {
-        value.forEach(item => visit(item, cb));
-        return;
-    }
-    if (!isPlainObject(value)) {
-        return;
+/**
+ * Strip the org `[code]` prefix from a pathname so we can look it up in the
+ * permission rules map. `/O12345/setting/foo` → `/setting/foo`. Single-segment
+ * paths (e.g. `/select-organization`) keep their leading slash.
+ *
+ * Also normalizes the user-role subtab aliases — both `purchase-doc` and
+ * `sales-doc` are gated by the same `members` rule because the UI shows
+ * the same management screen with different filters.
+ */
+function normalizePathnameForPermissionRules(pathname) {
+    const parts = pathname.split("/").filter(Boolean);
+    const path = parts.length <= 1 ? "/" : "/" + parts.slice(1).join("/");
+    return path.replace(/\/user-role\/(purchase-doc|sales-doc)$/, "/user-role/members");
+}
+function hasRule(rulesMap, routeKey) {
+    return Object.prototype.hasOwnProperty.call(rulesMap, routeKey);
+}
+/**
+ * Resolve UI route permissions for a pathname.
+ *
+ * - Exact / `[param]` pattern match → matched
+ * - Parent-prefix inherit only when the parent rule has a **non-empty**
+ *   role list (restrictive inherit). Explicitly public parents (`[]`) do
+ *   not open all children.
+ * - No match → `{ matched: false }` (fail closed — never treat as public)
+ */
+function resolveUiRoutePermission(pathname, rulesMap) {
+    const normalized = normalizePathnameForPermissionRules(pathname);
+    if (hasRule(rulesMap, normalized)) {
+        return { matched: true, roles: rulesMap[normalized] ?? [] };
     }
-    cb(value);
-    Object.values(value).forEach(item => visit(item, cb));
-};
-const validateGoodsReceiptChecks = (data) => {
-    let invalidPath = null;
-    const isCheckStatus = (v) => v === undefined || v === null || v === "pass" || v === "fail";
-    const isCompareStatus = (v) => v === undefined || v === null || v === "match" || v === "mismatch";
-    visit(data, node => {
-        if (invalidPath)
-            return;
-        if ("quantity_check" in node && !isCheckStatus(node.quantity_check)) {
-            invalidPath = "quantity_check";
-            return;
+    const pathSegments = normalized.split("/").filter(Boolean);
+    for (const [pattern, roles] of Object.entries(rulesMap)) {
+        const patternSegments = pattern.split("/").filter(Boolean);
+        if (patternSegments.length !== pathSegments.length)
+            continue;
+        let matches = true;
+        for (let i = 0; i < patternSegments.length; i++) {
+            const patternSegment = patternSegments[i];
+            const pathSegment = pathSegments[i];
+            if (patternSegment.startsWith("[") && patternSegment.endsWith("]")) {
+                if (!pathSegment) {
+                    matches = false;
+                    break;
+                }
+            }
+            else if (patternSegment !== pathSegment) {
+                matches = false;
+                break;
+            }
         }
-        if ("quality_check" in node && !isCheckStatus(node.quality_check)) {
-            invalidPath = "quality_check";
-            return;
+        if (matches) {
+            return { matched: true, roles: roles ?? [] };
         }
-        if ("compare_with_reference" in node &&
-            !isCompareStatus(node.compare_with_reference)) {
-            invalidPath = "compare_with_reference";
+    }
+    // Parent-prefix: /leave/types/abc → /leave/types (non-empty roles only)
+    for (let len = pathSegments.length - 1; len >= 1; len--) {
+        const parent = "/" + pathSegments.slice(0, len).join("/");
+        if (hasRule(rulesMap, parent) && (rulesMap[parent]?.length ?? 0) > 0) {
+            return { matched: true, roles: rulesMap[parent] ?? [] };
         }
+    }
+    return { matched: false, roles: [] };
+}
+/**
+ * Returns the required child-group segments for a page pathname.
+ *
+ * Prefer {@link resolveUiRoutePermission} when you need to distinguish
+ * "explicitly public (`[]`)" from "no rule (deny)". This helper returns
+ * `[]` for both cases and is kept for backward compatibility.
+ */
+function getRequiredChildGroups(pathname, rulesMap) {
+    return resolveUiRoutePermission(pathname, rulesMap).roles;
+}
+
+function DeniedCard() {
+    return (jsxRuntime.jsx(AccessDenied, { message: "\u0E04\u0E38\u0E13\u0E44\u0E21\u0E48\u0E21\u0E35\u0E2A\u0E34\u0E17\u0E18\u0E34\u0E4C\u0E40\u0E02\u0E49\u0E32\u0E16\u0E36\u0E07\u0E2B\u0E19\u0E49\u0E32\u0E19\u0E35\u0E49 \u0E2B\u0E32\u0E01\u0E04\u0E34\u0E14\u0E27\u0E48\u0E32\u0E04\u0E27\u0E23\u0E40\u0E02\u0E49\u0E32\u0E16\u0E36\u0E07\u0E44\u0E14\u0E49 \u0E01\u0E23\u0E38\u0E13\u0E32\u0E15\u0E34\u0E14\u0E15\u0E48\u0E2D\u0E1C\u0E39\u0E49\u0E14\u0E39\u0E41\u0E25\u0E23\u0E30\u0E1A\u0E1A\u0E02\u0E2D\u0E07\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" }));
+}
+/**
+ * Permission gate for a page subtree. Looks up the current pathname in the
+ * permission rules map (live rules from `PermissionRulesProvider`, layered
+ * over the optional `fallbackRulesMap`), passes the resolved required roles
+ * into the host's `usePermission` probe, and renders one of:
+ *
+ * 1. rules / probe still loading → `null` on FIRST load only (let Suspense /
+ *    loading.tsx show); once this subtree has been granted access, a later
+ *    loading state keeps the children mounted — see the note below
+ * 2. no rule covers this path → deny (fail closed)
+ * 3. rule is explicit public (`[]`) → children
+ * 4. probe says no access → deny card
+ * 5. otherwise → children
+ */
+function PermissionProvider({ children, usePermission, fallbackRulesMap, }) {
+    const pathname = navigation.usePathname();
+    const { rulesMap, isLoading: rulesLoading } = usePermissionRules();
+    const mergedMap = React.useMemo(() => {
+        if (!fallbackRulesMap)
+            return rulesMap;
+        // live rules win over fallback when both define the same key
+        return { ...fallbackRulesMap, ...rulesMap };
+    }, [rulesMap, fallbackRulesMap]);
+    const lookup = React.useMemo(() => resolveUiRoutePermission(pathname, mergedMap), [pathname, mergedMap]);
+    // Hook must run unconditionally (rules of hooks).
+    const { hasPermission, isLoading } = usePermission({
+        requiredRoles: lookup.roles,
     });
-    if (invalidPath) {
-        return {
-            valid: false,
-            message: "รูปแบบข้อมูลไม่ถูกต้อง: ฟิลด์ตรวจรับต้องเป็น enum string (quantity/quality: pass|fail, compare: match|mismatch)",
-        };
+    // Returning null unmounts the page. That is fine before anything has been
+    // shown, and destructive afterwards: next-auth flips its status back to
+    // "loading" on every session update() — one runs every 4 minutes — and a
+    // rules hook that reports loading on that transient took the page down with
+    // it. Users filling a long form watched everything they had typed vanish,
+    // which reads as a spontaneous page refresh.
+    //
+    // So a loading state only blanks the subtree until access has been granted
+    // once. After that the children stay mounted while the check re-settles; the
+    // API still enforces access on every request, and a genuine loss of
+    // permission surfaces as a denied response rather than a wiped form.
+    //
+    // The grant is remembered per pathname, not per mount. This provider lives in
+    // the layout, so it survives every in-app navigation — a bare boolean would
+    // carry one page's grant onto the next route and flash a page the user may
+    // not be allowed to see while its own check is still running.
+    const grantedForPathRef = React.useRef(null);
+    const grantedHere = grantedForPathRef.current === pathname;
+    if (rulesLoading && !grantedHere) {
+        return null;
     }
-    return { valid: true };
-};
-const runGlobalRequestPrecheck = (config) => {
-    const method = (config.method || "get").toLowerCase();
-    const isWriteMethod = ["post", "put", "patch"].includes(method);
-    if (!isWriteMethod || config.data === undefined || config.data === null) {
-        return { valid: true };
+    // Unknown route → deny. Only explicit `required_child_groups: []` is public.
+    if (!lookup.matched) {
+        return jsxRuntime.jsx(DeniedCard, {});
     }
-    if (typeof FormData !== "undefined" && config.data instanceof FormData) {
-        return { valid: true };
+    if (lookup.roles.length === 0) {
+        grantedForPathRef.current = pathname;
+        return jsxRuntime.jsx(jsxRuntime.Fragment, { children: children });
     }
-    return validateGoodsReceiptChecks(config.data);
-};
+    if (isLoading && !grantedHere) {
+        return null;
+    }
+    if (!hasPermission && !isLoading) {
+        return jsxRuntime.jsx(DeniedCard, {});
+    }
+    grantedForPathRef.current = pathname;
+    return jsxRuntime.jsx(jsxRuntime.Fragment, { children: children });
+}
 
-const isBrowser = () => typeof window !== "undefined";
-const isAuthEndpoint = (url) => !!url && url.includes("/api/auth/");
-const isAuthPage = () => isBrowser() && window.location.pathname.startsWith("/auth/");
-const getOrgFromCookie = () => {
-    if (!isBrowser())
+/** Cookie name for the cross-subdomain theme choice. */
+const THEME_COOKIE = "erp-theme";
+/**
+ * Parent domain to scope the cookie to, so every `*.antniti.com` app reads the
+ * same value. Returns `null` on localhost / bare IPs (host-only cookie).
+ */
+function sharedCookieDomain() {
+    if (typeof window === "undefined")
         return null;
-    const cookies = document.cookie.split(";").map(cookie => cookie.trim());
-    const orgCookie = cookies.find(cookie => cookie.startsWith("erp.organizationId="));
-    if (!orgCookie)
+    const host = window.location.hostname;
+    if (host === "localhost" || /^[0-9.]+$/.test(host))
         return null;
-    const raw = orgCookie.substring("erp.organizationId=".length);
-    return raw ? decodeURIComponent(raw) : null;
-};
-const redirectToLogout = async () => {
-    if (!isBrowser() || isAuthPage())
+    const parts = host.split(".");
+    if (parts.length < 2)
+        return null;
+    return "." + parts.slice(-2).join(".");
+}
+function readThemeCookie() {
+    if (typeof document === "undefined")
+        return null;
+    const match = document.cookie.match(new RegExp("(?:^|; )" + THEME_COOKIE + "=([^;]*)"));
+    return match ? decodeURIComponent(match[1]) : null;
+}
+function writeThemeCookie(value) {
+    if (typeof document === "undefined")
         return;
-    localStorage.clear();
-    sessionStorage.clear();
-    setOrganizationId(null);
-    clearAccessTokenCache();
-    await react.signOut({ callbackUrl: "/auth/signin" });
+    const domain = sharedCookieDomain();
+    const parts = [
+        `${THEME_COOKIE}=${encodeURIComponent(value)}`,
+        "path=/",
+        "max-age=31536000", // 1 year
+        "SameSite=Lax",
+    ];
+    if (domain)
+        parts.push(`domain=${domain}`);
+    document.cookie = parts.join("; ");
+}
+/**
+ * Bridges next-themes (per-origin localStorage) with a cookie scoped to the
+ * parent domain, so the light/dark/system choice is shared across the
+ * accounting / HR / platform subdomains.
+ *
+ * Local storage wins when it already has a value (H57): adopting the shared
+ * cookie first used to overwrite an explicit choice — including one set via
+ * DevTools — and write `theme=light` back on every load whenever the cookie
+ * still said light. Push the local value into the cookie instead so sibling
+ * apps catch up.
+ */
+function ThemeCookieSync() {
+    const { theme, setTheme } = nextThemes.useTheme();
+    const skipFirstWrite = React__namespace.useRef(true);
+    React__namespace.useEffect(() => {
+        const local = typeof window !== "undefined"
+            ? window.localStorage.getItem("theme")
+            : null;
+        const cookie = readThemeCookie();
+        if (local) {
+            if (local !== theme)
+                setTheme(local);
+            writeThemeCookie(local);
+        }
+        else if (cookie) {
+            if (cookie !== theme)
+                setTheme(cookie);
+        }
+        else if (theme) {
+            writeThemeCookie(theme);
+        }
+        // Run once on mount — `theme` is intentionally not a dependency here.
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    React__namespace.useEffect(() => {
+        // Skip the initial render; only persist genuine changes (incl. the
+        // setTheme() triggered by adopting storage above — harmless re-write).
+        if (skipFirstWrite.current) {
+            skipFirstWrite.current = false;
+            return;
+        }
+        if (theme)
+            writeThemeCookie(theme);
+    }, [theme]);
+    return null;
+}
+function ThemeProvider({ children, ...props }) {
+    return (jsxRuntime.jsxs(nextThemes.ThemeProvider, { ...props, children: [jsxRuntime.jsx(ThemeCookieSync, {}), children] }));
+}
+
+const defaultFlags = {
+    enableAdvancedReporting: true,
+    enableMultiCurrency: false,
+    enableThaiTaxCalculation: true,
+    enableProcurementWorkflow: true,
+    enableInventoryTracking: true,
+    enableAuditTrail: true,
+    enableAdvancedFilter: true,
+    filterFlag: false,
+    setFilterFlag: () => { },
 };
-const instance = axios.create({
-    baseURL: process.env.NEXT_PUBLIC_API_URL,
-    headers: { "Content-Type": "application/json" },
-    paramsSerializer: params => {
-        const searchParams = new URLSearchParams();
-        Object.entries(params || {}).forEach(([key, value]) => {
-            if (Array.isArray(value)) {
-                value.forEach(v => searchParams.append(key, String(v)));
-            }
-            else if (value !== undefined && value !== null) {
-                searchParams.append(key, String(value));
+const FeatureFlagsContext = React.createContext(defaultFlags);
+function FeatureFlagsProvider({ children, flags = {}, }) {
+    const [filterFlag, setFilterFlag] = React.useState(false);
+    const mergedFlags = {
+        ...defaultFlags,
+        ...flags,
+        filterFlag: flags.filterFlag ?? filterFlag,
+        setFilterFlag: (flag) => {
+            setFilterFlag(flag);
+            if (typeof flags.setFilterFlag === "function") {
+                flags.setFilterFlag(flag);
             }
-        });
-        return searchParams.toString();
-    },
-});
-instance.interceptors.request.use(async (config) => {
-    if (!config.headers) {
-        config.headers = new axios.AxiosHeaders();
-    }
-    if (config.data instanceof FormData && config.headers) {
-        delete config.headers["Content-Type"];
-    }
-    if (!isBrowser())
-        return config;
-    const token = await getAccessToken(false);
-    if (token) {
-        config.headers.Authorization = `Bearer ${token}`;
-    }
-    // localStorage first, cookie second.
-    //
-    // Both are written by the same state machine, but not at the same moment:
-    // setOrganizationId writes localStorage synchronously and then awaits a
-    // server action for the cookie. Preferring the cookie meant every request
-    // fired during that round trip carried the previous organisation — while
-    // the query params, built from React state, already carried the new one.
-    //
-    // The backend scopes by this header and ignores organization_id in the
-    // query, so those requests asked for organisation A and were handed B, and
-    // the answer landed in the cache under A's key. No amount of cache clearing
-    // reaches that: the entry is wrong, not stale.
-    const organizationId = getOrganizationId() || getOrgFromCookie();
-    if (organizationId) {
-        config.headers["X-Organization-ID"] = organizationId;
+        },
+    };
+    return (jsxRuntime.jsx(FeatureFlagsContext.Provider, { value: mergedFlags, children: children }));
+}
+function useFeatureFlags() {
+    const context = React.useContext(FeatureFlagsContext);
+    if (!context) {
+        throw new Error("useFeatureFlags must be used within a FeatureFlagsProvider");
     }
-    const precheck = runGlobalRequestPrecheck(config);
-    if (!precheck.valid) {
-        throw new ApiError(precheck.message || "Invalid request payload");
+    return context;
+}
+function useFeatureFlag(flag) {
+    const flags = useFeatureFlags();
+    return flags[flag];
+}
+
+const getAxiosErrorMessage$1 = (error) => {
+    if (error.response?.data?.message) {
+        return error.response.data.message;
     }
-    return config;
-});
-let refreshPromise = null;
-const refreshTokenSingleFlight = async () => {
-    if (!refreshPromise) {
-        refreshPromise = getAccessToken(true).finally(() => {
-            refreshPromise = null;
-        });
+    if (error.message) {
+        return error.message;
     }
-    return refreshPromise;
+    return "An unknown error occurred";
 };
-instance.interceptors.response.use(response => {
-    // Any successful call means the session can act in this organisation
-    // after all. Without this the gate, once raised, stayed up through a
-    // whole working session — including the seconds between an administrator
-    // adding somebody and the employee record existing.
-    if (typeof window !== "undefined") {
-        window.dispatchEvent(new CustomEvent("erp:employee-record-ok"));
-    }
-    return response;
-}, async (error) => {
-    const originalRequest = error.config;
-    const requestUrl = originalRequest?.url || error.config?.url;
-    if (error.response?.status === 401 &&
-        originalRequest &&
-        !originalRequest._retry &&
-        !isAuthEndpoint(requestUrl) &&
-        !isAuthPage()) {
-        originalRequest._retry = true;
-        const newToken = await refreshTokenSingleFlight();
-        if (newToken && originalRequest.headers) {
-            originalRequest.headers.Authorization = `Bearer ${newToken}`;
-            return instance(originalRequest);
-        }
-        await redirectToLogout();
-        return Promise.reject(toApiError(error));
-    }
-    // The server refuses every organisation-scoped call when the account has
-    // no employee record. Announce it once so a gate can explain it, instead
-    // of letting each failed query raise its own toast.
-    if (error.response?.status === 403) {
-        const body = error.response.data;
-        if (body?.code === "EMPLOYEE_RECORD_REQUIRED" && typeof window !== "undefined") {
-            window.dispatchEvent(new CustomEvent("erp:employee-record-required"));
-        }
+const formatError = (handlerName, error) => {
+    const axiosError = error;
+    const message = getAxiosErrorMessage$1(axiosError);
+    const isOrgRequired = message.includes("Organization context is required") ||
+        message.includes("organization_id") ||
+        message.includes("X-Organization-ID");
+    if (isOrgRequired) {
+        // Expected when no org selected yet (e.g. select-organization page).
+        console.warn(`[React Query] ${handlerName} skipped (no organization context): ${message}`);
+        return;
     }
-    return Promise.reject(toApiError(error));
+};
+/**
+ * Default React Query config used across ERP apps:
+ *   - 2 retries on queries / 1 on mutations, exponential backoff
+ *   - 5 min staleTime, refetchOnWindowFocus
+ *   - swallows "no org context" errors to silence noise on the
+ *     select-organization page
+ *
+ * Apps can compose on top of this — pass the returned config to `new QueryClient(...)`
+ * directly or spread + override default options.
+ */
+const getQueryClientConfig = () => ({
+    defaultOptions: {
+        queries: {
+            retry: 2,
+            retryDelay: attemptIndex => Math.min(1000 * 2 ** attemptIndex, 30000),
+            staleTime: 5 * 60 * 1000,
+            refetchOnWindowFocus: true,
+        },
+        mutations: {
+            // NEVER auto-retry a mutation. Unlike a query, a mutation is a side
+            // effect on a non-idempotent endpoint (submit, create, approve), and
+            // React Query cannot tell "the network dropped" from "the server
+            // rejected this on business grounds".
+            //
+            // With retry: 1 every failed mutation fired twice. Two visible
+            // consequences: a rejected submit showed up as two failed POSTs in the
+            // network tab, and — far worse — a create whose response was lost in
+            // flight would be re-sent and duplicate the record server-side.
+            //
+            // Retrying is the caller's decision, not a global default: the user
+            // sees the error and presses the button again.
+            retry: 0,
+        },
+    },
+    queryCache: new reactQuery.QueryCache({
+        onError: error => formatError("Query", error),
+    }),
+    mutationCache: new reactQuery.MutationCache({
+        onError: error => formatError("Mutation", error),
+    }),
 });
 
-const hasPaginationShape = (payload) => {
-    return ("total" in payload ||
-        "page" in payload ||
-        "per_page" in payload ||
-        "total_pages" in payload ||
-        "has_next" in payload ||
-        "has_prev" in payload ||
-        "pagination" in payload);
-};
-const isEnvelope = (payload) => {
-    return ("success" in payload || "message" in payload) && !hasPaginationShape(payload);
-};
-const unwrapApiResponse = (payload) => {
-    if (!payload || typeof payload !== "object") {
-        return payload;
+function ReactQueryProvider({ children }) {
+    // Create a new QueryClient instance for each render to avoid SSR issues.
+    const [queryClient] = React.useState(() => new reactQuery.QueryClient(getQueryClientConfig()));
+    return (jsxRuntime.jsxs(reactQuery.QueryClientProvider, { client: queryClient, children: [children, jsxRuntime.jsx(reactQueryDevtools.ReactQueryDevtools, { client: queryClient, initialIsOpen: false })] }));
+}
+
+/**
+ * Renders nothing. Runs during render (after SessionProvider, inside
+ * QueryClientProvider) to seed the cached profile slot from the JWT-backed
+ * session — so `useMyProfile` doesn't fire a redundant GET on initial load.
+ *
+ * Generic over the profile shape; each app passes its own queryKey + mapper.
+ */
+function SessionBackedProfileCacheSeeder({ queryKey, mapper, }) {
+    const { data: session, status } = react.useSession();
+    const queryClient = reactQuery.useQueryClient();
+    if (status === "authenticated" && session) {
+        const mapped = mapper(session);
+        if (mapped) {
+            const existing = queryClient.getQueryData(queryKey);
+            if (!existing) {
+                // updatedAt: 0 → immediately stale so observers still GET /myprofile
+                // for fields the JWT seed omits (avatar/signature paths).
+                queryClient.setQueryData(queryKey, mapped, { updatedAt: 0 });
+            }
+            else {
+                // Only overwrite when the mapped id changed — we don't know T's shape
+                // so we rely on a shallow id check via JSON tag if present.
+                const existingId = existing?.id;
+                const mappedId = mapped?.id;
+                if (existingId !== mappedId) {
+                    queryClient.setQueryData(queryKey, mapped, { updatedAt: 0 });
+                }
+            }
+        }
     }
-    const record = payload;
-    if ("data" in record &&
-        record.data !== undefined &&
-        isEnvelope(record)) {
-        return record.data;
+    if (status === "unauthenticated") {
+        queryClient.removeQueries({ queryKey });
     }
-    return payload;
-};
+    return null;
+}
 
 // Hooks
 const updateOrganizationId = (organizationId) => {
@@ -2358,15 +3633,19 @@ exports.EMPLOYEE_RECORD_REQUIRED_EVENT = EMPLOYEE_RECORD_REQUIRED_EVENT;
 exports.EmployeeRequiredGate = EmployeeRequiredGate;
 exports.FeatureFlagsProvider = FeatureFlagsProvider;
 exports.HeaderBackground = HeaderBackground;
+exports.HelpButton = HelpButton;
+exports.HelpDialogHost = HelpDialogHost;
 exports.NavMain = NavMain;
 exports.NavTools = NavTools;
 exports.NavUser = NavUser;
+exports.OWNER_CHIP = OWNER_CHIP;
 exports.OrganizationSwitcher = OrganizationSwitcher;
 exports.PLAN_FEATURES = PLAN_FEATURES;
 exports.PermissionGateShell = PermissionGateShell;
 exports.PermissionProvider = PermissionProvider;
 exports.PermissionRulesProvider = PermissionRulesProvider;
 exports.ReactQueryProvider = ReactQueryProvider;
+exports.SHELL_VERSION = SHELL_VERSION;
 exports.SessionBackedProfileCacheSeeder = SessionBackedProfileCacheSeeder;
 exports.SessionRefreshTrigger = SessionRefreshTrigger;
 exports.SidebarContent = SidebarContent;
@@ -2387,7 +3666,11 @@ exports.buildUrlWithCode = buildUrlWithCode;
 exports.canAccessNavPermissionRoute = canAccessNavPermissionRoute;
 exports.clearAccessTokenCache = clearAccessTokenCache;
 exports.clearOrganizationId = clearOrganizationId;
+exports.closeHelp = closeHelp;
 exports.decodeJWT = decodeJWT;
+exports.describeAttached = describeAttached;
+exports.describeBrowser = describeBrowser;
+exports.detectHelpApp = detectHelpApp;
 exports.filterNavigationModulesByPermission = filterNavigationModulesByPermission;
 exports.filterNavigationToolsByPermission = filterNavigationToolsByPermission;
 exports.getAccessToken = getAccessToken;
@@ -2400,8 +3683,12 @@ exports.getRequiredChildGroups = getRequiredChildGroups;
 exports.hasPlanFeature = hasPlanFeature;
 exports.isLikelyTransientNetworkError = isLikelyTransientNetworkError;
 exports.isPathActive = isPathActive;
+exports.myRolesQueryKey = myRolesQueryKey;
 exports.normalizePathnameForPermissionRules = normalizePathnameForPermissionRules;
+exports.openHelp = openHelp;
+exports.parseMyRoles = parseMyRoles;
 exports.resolveUiRoutePermission = resolveUiRoutePermission;
+exports.roleSummary = roleSummary;
 exports.runGlobalRequestPrecheck = runGlobalRequestPrecheck;
 exports.runWithTransientRetry = runWithTransientRetry;
 exports.setOrganizationId = setOrganizationId;
@@ -2413,6 +3700,7 @@ exports.useFeatureFlag = useFeatureFlag;
 exports.useFeatureFlags = useFeatureFlags;
 exports.useInvalidateQueriesOnOrgChange = useInvalidateQueriesOnOrgChange;
 exports.useKeycloakRoles = useKeycloakRoles;
+exports.useMyRoles = useMyRoles;
 exports.useOrganizationIdState = useOrganizationIdState;
 exports.usePermissionRules = usePermissionRules;
 exports.useSessionRefresh = useSessionRefresh;