@eintrek/erp-shell 0.1.52 → 0.1.53

package/dist/index.esm.js

@@ -2,10 +2,10 @@
 import * as React from 'react';
 import React__default, { useRef, useEffect, useMemo, useState, useCallback, createContext, useContext, Fragment, useSyncExternalStore, useTransition, Suspense } from 'react';
 import { useSession, signOut } from 'next-auth/react';
-import { useQueryClient, MutationCache, QueryCache, QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { useQueryClient, useQuery, QueryClientContext, QueryClient, MutationCache, QueryCache, QueryClientProvider } from '@tanstack/react-query';
 import { jsx, jsxs, Fragment as Fragment$1 } from 'react/jsx-runtime';
 import { cn, Button, Breadcrumb, BreadcrumbList, BreadcrumbItem, BreadcrumbLink, BreadcrumbSeparator, BreadcrumbPage, Avatar, AvatarImage, AvatarFallback, Collapsible, CollapsibleTrigger, CollapsibleContent, Badge, DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuLabel, DropdownMenuItem, DropdownMenuSeparator, Skeleton, Dialog, DialogContent, DialogHeader, DialogTitle, Label, Textarea, DialogFooter, Card, CardHeader, CardContent } from '@eintrek/erp-theme';
-import { PanelLeftClose, Menu, ChevronRight, Building2, Palette, ChevronUp, Sun, Moon, Monitor, Globe, User, LayoutGrid, ExternalLink, CircleHelp, Loader2, LogOut, ChevronsUpDown, Calculator, Warehouse, FolderKanban, Users, ChevronDown, Plus, CircleCheck, ArrowLeft, ArrowRight, Compass, ArrowUpRight, Ban, Home, Headset, ContactRound, UserPlus } from 'lucide-react';
+import { PanelLeftClose, Menu, ChevronRight, Building2, Palette, ChevronUp, Sun, Moon, Monitor, Globe, User, LayoutGrid, ExternalLink, CircleHelp, Loader2, LogOut, ChevronsUpDown, Calculator, Warehouse, FolderKanban, Users, ChevronDown, Plus, ImagePlus, X, CircleCheck, ArrowLeft, ArrowRight, Compass, ArrowUpRight, Ban, Home, Headset, ContactRound, UserPlus } from 'lucide-react';
 import { create } from 'zustand';
 import { persist, createJSONStorage } from 'zustand/middleware';
 import { useRouter, usePathname, useParams } from 'next/navigation';
@@ -806,6 +806,9 @@ function isRecordID(segment) {
 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());
@@ -824,14 +827,35 @@ function openHelp() {
     }
 }
 function closeHelp() {
+    pendingRef = null;
     if (open) {
         open = false;
         emit();
     }
 }
-/** Called by the dialog host on mount; returns its unmount. */
+/** 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;
+}
+/**
+ * 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.
+ */
 function registerHelpHost() {
     hosts += 1;
+    if (pendingRef)
+        open = true;
     emit();
     return () => {
         hosts -= 1;
@@ -861,562 +885,371 @@ function declaredHelpApp() {
     return declaredApp;
 }
 
-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 } = useSession();
-    const router = useRouter();
-    const { theme, setTheme } = useTheme();
-    const [isSigningOut, setIsSigningOut] = useState(false);
-    const [isOpen, setIsOpen] = useState(false);
-    const [showThemeMenu, setShowThemeMenu] = useState(false);
-    const [showLanguageMenu, setShowLanguageMenu] = useState(false);
-    const [showAppsMenu, setShowAppsMenu] = useState(false);
-    const buttonRef = useRef(null);
-    const [position, setPosition] = 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 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);
-    };
-    useEffect(() => {
-        if (isOpen && buttonRef.current) {
-            const rect = buttonRef.current.getBoundingClientRect();
-            setPosition({ top: rect.bottom, left: rect.right + 8 });
-        }
-    }, [isOpen]);
-    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 (jsx("div", { className: "p-2", children: jsxs("div", { className: "flex items-center gap-2 p-2 rounded-md", children: [jsx("div", { className: "h-8 w-8 rounded-lg bg-sidebar-accent animate-pulse" }), jsxs("div", { className: "flex-1 space-y-1", children: [jsx("div", { className: "h-4 w-24 bg-sidebar-accent rounded animate-pulse" }), 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 ? (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 && (jsx("div", { className: "p-4 border-b border-sidebar-border bg-sidebar-accent/30", children: jsxs("div", { className: "flex items-center gap-3", children: [organization.logoUrl ? (
-                        // eslint-disable-next-line @next/next/no-img-element
-                        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";
-                            } })) : (jsx(Building2, { className: "h-5 w-5 text-sidebar-foreground/70 flex-shrink-0" })), jsxs("div", { className: "flex-1 min-w-0", children: [jsx("div", { className: "font-medium text-sm sm:truncate", children: organization.name }), organization.description && (jsx("div", { className: "text-xs text-sidebar-foreground/70 truncate mt-0.5", children: organization.description }))] })] }) })), jsxs("div", { className: "p-2", children: [jsxs("div", { className: "relative", children: [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: [jsx(Palette, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: "\u0E40\u0E1B\u0E25\u0E35\u0E48\u0E22\u0E19\u0E18\u0E35\u0E21" }), jsx(ChevronUp, { className: `h-4 w-4 transition-transform ${showThemeMenu ? "rotate-180" : ""}` })] }), showThemeMenu && (jsx("div", { className: "mt-1 ml-4 space-y-1", children: [
-                                    { key: "light", label: "สว่าง", Icon: Sun },
-                                    { key: "dark", label: "มืด", Icon: Moon },
-                                    { key: "system", label: "ตามระบบ", Icon: Monitor },
-                                ].map(({ key, label, Icon }) => (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: [jsx(Icon, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: label }), theme === key && (jsx("div", { className: "h-2 w-2 rounded-full bg-primary" }))] }, key))) }))] }), showLanguageSwitch && (jsxs("div", { className: "relative", children: [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: [jsx(Globe, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: "\u0E40\u0E1B\u0E25\u0E35\u0E48\u0E22\u0E19\u0E20\u0E32\u0E29\u0E32" }), jsx(ChevronUp, { className: `h-4 w-4 transition-transform ${showLanguageMenu ? "rotate-180" : ""}` })] }), showLanguageMenu && (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 }) => (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: [jsx("span", { className: "flex-1 text-left", children: label }), organization?.language === code && (jsx("div", { className: "h-2 w-2 rounded-full bg-primary" }))] }, code))) }))] })), profileHref && (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: [jsx(User, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: "\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E2A\u0E48\u0E27\u0E19\u0E15\u0E31\u0E27" })] })), showSelectOrganization && (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: [jsx(Building2, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E18\u0E38\u0E23\u0E01\u0E34\u0E08" })] })), visibleSystemLinks.length > 0 && (jsxs("div", { className: "relative", children: [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: [jsx(LayoutGrid, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: "\u0E41\u0E2D\u0E1B\u0E1E\u0E25\u0E34\u0E40\u0E04\u0E0A\u0E31\u0E19" }), jsx(ChevronUp, { className: `h-4 w-4 transition-transform ${showAppsMenu ? "rotate-180" : ""}` })] }), showAppsMenu && (jsx("div", { className: "mt-1 ml-4 space-y-1", children: visibleSystemLinks.map(link => (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 ?? jsx(ExternalLink, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: link.label }), link.active && (jsx("div", { className: "h-2 w-2 rounded-full bg-primary" }))] }, `${link.label}:${link.href}`))) }))] })), helpAvailable && (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: [jsx(CircleHelp, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D" })] })), 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 ? (jsxs(Fragment$1, { children: [jsx(Loader2, { className: "h-4 w-4 animate-spin" }), jsx("span", { className: "flex-1 text-left", children: "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E2D\u0E2D\u0E01\u0E08\u0E32\u0E01\u0E23\u0E30\u0E1A\u0E1A..." })] })) : (jsxs(Fragment$1, { children: [jsx(LogOut, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: "\u0E2D\u0E2D\u0E01\u0E08\u0E32\u0E01\u0E23\u0E30\u0E1A\u0E1A" })] })) })] })] })) : null;
-    if (variant === "workspace") {
-        return (jsx("div", { className: "mt-3.5 border-t border-sidebar-border pt-3", children: jsxs("div", { className: "relative", children: [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: [jsxs(Avatar, { className: "size-[34px] shrink-0 rounded-full border-[3px] border-sidebar-accent", children: [user.avatar ? (jsx(AvatarImage, { src: user.avatar, alt: user.name })) : null, jsx(AvatarFallback, { className: "rounded-full bg-sidebar-accent text-sm font-medium text-sidebar-accent-foreground", children: getInitials(user.name) })] }), jsxs("span", { className: "grid min-w-0 flex-1 leading-tight", children: [jsx("strong", { className: "truncate text-[13px] font-semibold", title: user.name, children: user.name }), jsx("small", { className: "truncate text-[11px] text-muted-foreground", title: user.email, children: user.email })] }), jsx(ChevronsUpDown, { className: "size-3.5 shrink-0 text-muted-foreground" })] }), typeof window !== "undefined" &&
-                        createPortal(dropdownContent, document.body)] }) }));
-    }
-    return (jsx("div", { className: "p-2", children: jsxs("div", { className: "relative", children: [jsxs("button", { ref: buttonRef, onClick: () => setIsOpen(!isOpen), className: "flex w-full items-center gap-2 p-2 rounded-md transition-colors", children: [jsxs(Avatar, { className: "h-8 w-8 rounded-lg", children: [user.avatar ? (jsx(AvatarImage, { src: user.avatar, alt: user.name })) : null, jsx(AvatarFallback, { className: "rounded-lg bg-primary text-primary-foreground w-8 h-8", children: getInitials(user.name) })] }), jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [jsx("span", { className: "truncate font-medium", title: user.name, children: user.name }), jsx("span", { className: "truncate text-xs text-sidebar-foreground/70", title: user.email, children: user.email })] }), jsx(ChevronUp, { className: `ml-auto size-4 transition-transform ${isOpen ? "rotate-180" : ""}` })] }), typeof window !== "undefined" &&
-                    createPortal(dropdownContent, document.body)] }) }));
-}
-
 /**
- * Plan feature keys (billable entitlements). Mirror of platform-apis plan.go.
+ * The caller's roles in the current organisation, as platform-api answers
+ * GET /organizations/:id/my-roles, and how the user card words them.
  *
- * 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.
+ * No runtime imports: the tests run this file in Node as it is.
  */
-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,
-];
+/** 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);
 /**
- * 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.
+ * 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 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;
+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;
     }
-    if (feature === PLAN_FEATURES.BASIC_ACCOUNTING_HR &&
-        features.includes(PLAN_FEATURES.MODULE_HR) &&
-        features.includes(PLAN_FEATURES.MODULE_ACCOUNTING)) {
-        return true;
+    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 false;
+    return { organizationId, isOwner: data.is_owner === true, roles };
 }
-
-function normaliseBase(value, fallback) {
-    return (value ?? fallback).replace(/\/$/, "");
+/** 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) };
 }
-/**
- * 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: jsx(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: jsx(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: jsx(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: jsx(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: jsx(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 } : {}),
-    }));
+/** 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);
 }
 
-// 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) {
-        return true;
+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;
     }
-    // Check if pathname starts with url + "/" to ensure exact segment matching
-    // This prevents /reports/sales from matching /sales
-    // Example: /org123/reports/sales should NOT match /org123/sales
-    // But /org123/sales/overview SHOULD match /org123/sales
-    if (pathname.startsWith(url + "/")) {
-        return true;
+    if (!inFlightTokenPromise) {
+        inFlightTokenPromise = readSessionToken()
+            .then(token => {
+            cachedToken = token;
+            cachedAt = Date.now();
+            return token;
+        })
+            .finally(() => {
+            inFlightTokenPromise = null;
+        });
     }
-    return false;
-}
+    return inFlightTokenPromise;
+};
+const clearAccessTokenCache = () => {
+    cachedToken = null;
+    cachedAt = 0;
+};
 
-/** "/O1/" and "/O1" are the same page; a query string never is. */
-function samePage(pathname, url) {
-    if (url.includes("?"))
-        return false;
-    const strip = (p) => (p.length > 1 ? p.replace(/\/+$/, "") : p);
-    return strip(pathname) === strip(url);
-}
-function NavMain({ items, orgCode, closeOnNavigation = false, approvalCounts, chrome = "brand", highlightActiveModule = false, }) {
-    const workspace = chrome === "workspace";
-    const params = useParams();
-    const pathname = usePathname();
-    const { setOpen } = useSidebar();
-    const handleNavLinkClick = () => {
-        if (closeOnNavigation)
-            setOpen(false);
-    };
-    const code = orgCode ?? params?.code;
-    // Which module (and sub-item) the current page belongs to.
-    const states = items.map(item => {
-        const itemUrl = buildUrlWithCode(code, item.url);
-        // Most specific (longest) matching sub-item URL so only one link is active.
-        const activeSubItemUrl = item.subModules?.reduce((best, subItem) => {
-            const subItemUrl = buildUrlWithCode(code, subItem.url);
-            const matches = isPathActive(pathname, subItemUrl) ||
-                isPathActive(pathname, subItem.url);
-            const subPageMatches = subItem.subPages?.some(subPage => isPathActive(pathname, buildUrlWithCode(code, subPage.url)) ||
-                isPathActive(pathname, subPage.url));
-            if (!matches && !subPageMatches)
-                return best;
-            const candidateUrl = subItemUrl;
-            if (!best)
-                return candidateUrl;
-            return candidateUrl.length > best.length ? candidateUrl : best;
-        }, null) ?? null;
-        const hasActiveSubItem = !!activeSubItemUrl ||
-            !!item.subModules?.some(subItem => subItem.subPages?.some(subPage => isPathActive(pathname, buildUrlWithCode(code, subPage.url)) ||
-                isPathActive(pathname, subPage.url)));
-        // Parent only active when path matches its URL exactly AND no child
-        // is active (so parent+child don't both light up).
-        const isItemActive = (highlightActiveModule && !item.subModules?.length && !!item.isActive) ||
-            ((workspace ? samePage(pathname, itemUrl) : pathname === itemUrl) &&
-                !hasActiveSubItem);
-        return { itemUrl, activeSubItemUrl, hasActiveSubItem, isItemActive };
-    });
-    // A group opens when its page becomes current and otherwise stays as the
-    // user left it. defaultOpen alone decided once, on the first render — and
-    // on a direct load the sub-items arrive after permissions do, so the group
-    // holding the current page stayed shut.
-    const activeKey = items
-        .filter((_, i) => states[i].isItemActive || states[i].hasActiveSubItem)
-        .map(item => item.id)
-        .join(",");
-    const [openIds, setOpenIds] = React.useState(() => new Set(activeKey ? activeKey.split(",") : []));
-    React.useEffect(() => {
-        if (!activeKey)
-            return;
-        setOpenIds(prev => {
-            const ids = activeKey.split(",");
-            if (ids.every(id => prev.has(id)))
-                return prev;
-            const next = new Set(prev);
-            ids.forEach(id => next.add(id));
-            return next;
+class ApiError extends Error {
+    constructor(message, options) {
+        super(message);
+        Object.defineProperty(this, "status", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
         });
-    }, [activeKey]);
-    const setItemOpen = (id, open) => setOpenIds(prev => {
-        if (prev.has(id) === open)
-            return prev;
-        const next = new Set(prev);
-        if (open)
-            next.add(id);
-        else
-            next.delete(id);
-        return next;
-    });
-    return (jsx(SidebarGroup, { "data-sidebar": true, className: workspace ? "p-0" : undefined, children: jsx(SidebarMenu, { className: workspace ? "gap-[3px]" : undefined, children: items.map((item, index) => {
-                const groupHeading = workspace &&
-                    item.group &&
-                    item.group !== items[index - 1]?.group ? (jsx("li", { className: "list-none px-3 pb-2.5 text-xs text-muted-foreground" +
-                        (index > 0 ? " pt-5" : ""), children: item.group }, `group-${item.id}`)) : null;
-                const { itemUrl, activeSubItemUrl, isItemActive } = states[index];
-                const IconComp = item.icon;
-                const workspaceButton = workspace
-                    ? "h-auto gap-3 rounded-[10px] px-3 py-2.5 text-[13px] " +
-                        (isItemActive
-                            ? "bg-sidebar-accent font-bold text-sidebar-accent-foreground"
-                            : "font-medium text-sidebar-foreground/70")
-                    : "";
-                const icon = workspace && IconComp ? (jsx(IconComp, { className: "size-[18px] shrink-0" })) : null;
-                const badge = workspace && item.badge !== undefined && item.badge !== "" ? (jsx("span", { className: "ml-auto min-w-5 rounded-[5px] bg-primary/15 px-1 text-center text-[10px] leading-5 font-bold tabular-nums text-primary", children: item.badge })) : null;
-                return (jsxs(React.Fragment, { children: [groupHeading, jsx(Collapsible, { asChild: true, open: openIds.has(item.id), onOpenChange: open => setItemOpen(item.id, open), className: "group/collapsible", children: jsxs(SidebarMenuItem, { children: [jsx(CollapsibleTrigger, { asChild: true, children: jsx(SidebarMenuButton, { asChild: !item.subModules || item.subModules.length === 0, isActive: isItemActive, className: "data-[state=open]:text-sidebar-accent-foreground " +
-                                                workspaceButton, children: item.subModules && item.subModules.length > 0 ? (jsxs(Fragment$1, { children: [icon, jsx("span", { id: item.id, children: item.titleTh }), jsx(ChevronRight, { className: "ml-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90" })] })) : (jsxs(Link, { href: itemUrl, prefetch: false, className: "flex items-center w-full min-w-0 flex-1 " +
-                                                    (workspace ? "gap-3" : "gap-2"), onClick: handleNavLinkClick, "aria-current": isItemActive ? "page" : undefined, children: [icon, jsx("span", { id: item.id, className: "flex-1 truncate", title: item.titleTh, children: item.titleTh }), badge] })) }) }), item.subModules && item.subModules.length > 0 && (jsx(CollapsibleContent, { children: jsx(SidebarMenuSub, { className: workspace
-                                                ? "mx-0 mt-1 mb-3 ml-[21px] gap-0.5 border-l border-sidebar-border pl-2.5 [&_a]:h-auto [&_a]:gap-[11px] [&_a]:px-3 [&_a]:py-2 [&_a]:text-[13px] [&_svg]:!size-[17px]"
-                                                : undefined, children: item.subModules.map(subItem => {
-                                                const subItemUrl = buildUrlWithCode(code, subItem.url);
-                                                const isSubItemActive = subItemUrl === activeSubItemUrl;
-                                                const SubIcon = subItem.icon;
-                                                const approvalCount = approvalCounts && subItem.approvalCountKey
-                                                    ? (approvalCounts[subItem.approvalCountKey] ?? 0)
-                                                    : 0;
-                                                if (subItem.isCollapsible &&
-                                                    subItem.subPages &&
-                                                    subItem.subPages.length > 0) {
-                                                    const hasActiveSubPage = subItem.subPages.some(subPage => isPathActive(pathname, buildUrlWithCode(code, subPage.url)));
-                                                    return (jsx(Collapsible, { asChild: true, defaultOpen: isSubItemActive || hasActiveSubPage, className: "group/sub-collapsible", children: jsxs(SidebarMenuSubItem, { children: [jsx(CollapsibleTrigger, { asChild: true, children: jsxs(SidebarMenuSubButton, { className: "w-full", isActive: isSubItemActive || hasActiveSubPage, children: [SubIcon && (jsx(SubIcon, { className: "sidebar-submodule-icon flex-shrink-0" })), jsx("span", { className: "flex-1 truncate", title: subItem.titleTh, children: subItem.titleTh }), jsx(ChevronDown, { className: "ml-auto size-4 transition-transform duration-200 group-data-[state=open]/sub-collapsible:rotate-180" })] }) }), jsx(CollapsibleContent, { children: jsx(SidebarMenuSub, { className: "ml-4", children: subItem.subPages.map(subPage => {
-                                                                            const subPageUrl = buildUrlWithCode(code, subPage.url);
-                                                                            const isSubPageActive = isPathActive(pathname, subPageUrl);
-                                                                            const SubPageIcon = subPage.icon;
-                                                                            return (jsx(SidebarMenuSubItem, { children: jsx(SidebarMenuSubButton, { asChild: true, className: `font-thai w-full text-sm ${isSubPageActive
-                                                                                        ? "text-sidebar-accent-foreground font-medium"
-                                                                                        : "text-sidebar-foreground"}`, isActive: false, children: jsxs(Link, { href: subPageUrl, prefetch: false, className: "w-full flex items-center", onClick: handleNavLinkClick, children: [SubPageIcon && (jsx(SubPageIcon, { className: "sidebar-subpage-icon flex-shrink-0" })), jsx("span", { className: "flex-1 truncate", title: subPage.titleTh, children: subPage.titleTh })] }) }) }, subPage.id));
-                                                                        }) }) })] }) }, subItem.id));
-                                                }
-                                                return (jsx(SidebarMenuSubItem, { children: jsx(SidebarMenuSubButton, { asChild: true, className: "w-full" +
-                                                            (workspace && isSubItemActive
-                                                                ? " font-semibold"
-                                                                : ""), isActive: isSubItemActive, children: jsxs(Link, { href: subItemUrl, prefetch: false, className: "w-full flex items-center", onClick: handleNavLinkClick, children: [SubIcon && (jsx(SubIcon, { className: "sidebar-submodule-icon flex-shrink-0" })), jsx("span", { className: "flex-1 truncate", title: subItem.titleTh, children: subItem.titleTh }), approvalCount > 0 && (jsx(Badge, { variant: "destructive", className: "ml-auto h-5 min-w-5 px-1.5 text-xs font-medium tabular-nums", children: approvalCount > 99
-                                                                        ? "99+"
-                                                                        : approvalCount }))] }) }) }, subItem.id));
-                                            }) }) }))] }) })] }, item.id));
-            }) }) }));
+        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 (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));
+};
 
-function OrgMark({ logoUrl, size = "md", }) {
-    const [failed, setFailed] = useState(false);
-    const box = size === "sm"
-        ? "flex size-6 items-center justify-center rounded-md border overflow-hidden bg-background"
-        : size === "header"
-            ? "flex aspect-square size-8 shrink-0 items-center justify-center rounded-[9px] border border-[color:var(--header-mark-border,color-mix(in_oklab,var(--header-fg,currentColor)_28%,transparent))] bg-[var(--header-mark-bg,color-mix(in_oklab,var(--header-fg,currentColor)_10%,transparent))] text-[var(--header-mark-fg,var(--header-fg,currentColor))] overflow-hidden max-sm:size-7"
-            : "flex aspect-square size-8 shrink-0 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground overflow-hidden";
-    const icon = size === "sm" ? "size-3.5 shrink-0" : "size-4";
-    if (logoUrl && !failed) {
-        return (jsx("div", { className: cn(box, size === "md" && "bg-white"), children: jsx("img", { src: logoUrl, alt: "", className: "size-full object-contain p-0.5", onError: () => setFailed(true) }) }));
+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;
     }
-    return (jsx("div", { className: box, children: jsx(Building2, { className: icon }) }));
-}
-function OrganizationSwitcher({ activeOrganization, isContextLoading = false, organizations, isLoadingOrgs = false, setOrganizationCookie, registerOrganizationHref = "/register-organization", placement = "sidebar", className, }) {
-    const { isMobile } = useSidebarToggle();
-    const router = useRouter();
-    const params = useParams();
-    const [isPending, startTransition] = useTransition();
-    const currentCode = params?.code
-        ? Array.isArray(params.code)
-            ? params.code[0]
-            : params.code
-        : undefined;
-    const handleOrganizationChange = (org) => {
-        startTransition(async () => {
-            const orgCode = org.code || String(org.id);
-            // Write storage + cookie before navigation — Layout will re-hydrate
-            // Context on the new URL.
-            try {
-                setOrganizationId(String(org.id));
-                await setOrganizationCookie(org.id);
-            }
-            catch {
-                // ignore: navigation will re-attempt context resolution
-            }
-            if (currentCode) {
-                const currentPath = window.location.pathname;
-                const parts = currentPath.split("/");
-                const decodedParts = parts.map(p => decodeURIComponent(p));
-                const codeIndex = decodedParts.indexOf(currentCode);
-                if (codeIndex !== -1) {
-                    parts[codeIndex] = orgCode;
-                    router.push(parts.join("/"));
-                }
-                else {
-                    router.push(`/${orgCode}`);
-                }
+    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 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 {
-                router.push(`/${orgCode}`);
+            else if (value !== undefined && value !== null) {
+                searchParams.append(key, String(value));
             }
         });
-    };
-    const isLoading = isLoadingOrgs || isContextLoading;
-    if (placement === "header") {
-        const face = (interactive) => (jsxs(Fragment$1, { children: [jsx(OrgMark, { logoUrl: activeOrganization?.logoUrl, size: "header" }), jsxs("span", { className: "min-w-0 text-left", children: [jsx("small", { className: "block text-[10px] leading-tight text-[var(--header-fg-muted,currentColor)] max-sm:text-[9px]", children: "\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23\u0E17\u0E35\u0E48\u0E01\u0E33\u0E25\u0E31\u0E07\u0E43\u0E0A\u0E49\u0E07\u0E32\u0E19" }), isLoading ? (jsx(Skeleton, { className: "mt-1 h-3.5 w-28" })) : (jsx("strong", { className: "block max-w-[220px] truncate text-xs font-semibold text-[var(--header-fg,currentColor)] max-sm:max-w-[140px] max-sm:text-[11px]", children: activeOrganization?.name || "เลือกองค์กร" }))] }), interactive ? (isPending ? (jsx(Loader2, { className: "ml-1 size-3.5 shrink-0 animate-spin text-[var(--header-fg-muted,currentColor)]" })) : (jsx(ChevronsUpDown, { className: "ml-1 size-3.5 shrink-0 text-[var(--header-fg-muted,currentColor)]" }))) : null] }));
-        const faceClass = cn("flex items-center gap-2.5 rounded-lg py-1.5 max-sm:gap-2", className);
-        if (isLoading || organizations.length <= 1) {
-            return jsx("div", { className: faceClass, children: face(false) });
+        return searchParams.toString();
+    },
+});
+instance.interceptors.request.use(async (config) => {
+    if (!config.headers) {
+        config.headers = new 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);
         }
-        return (jsxs(DropdownMenu, { children: [jsx(DropdownMenuTrigger, { className: cn(faceClass, "px-1.5 outline-none transition-colors hover:bg-[var(--header-hover,var(--accent))] focus-visible:ring-2 focus-visible:ring-[var(--header-fg-muted,var(--ring))] data-[state=open]:bg-[var(--header-hover,var(--accent))]"), "aria-label": "\u0E40\u0E1B\u0E25\u0E35\u0E48\u0E22\u0E19\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23", children: face(true) }), jsxs(DropdownMenuContent, { className: "min-w-64 rounded-lg", align: "end", side: "bottom", sideOffset: 6, children: [jsx(DropdownMenuLabel, { className: "text-xs text-muted-foreground", children: "\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" }), organizations.map(org => (jsxs(DropdownMenuItem, { onClick: () => handleOrganizationChange(org), disabled: isPending, className: cn("gap-2 p-2 cursor-pointer", String(activeOrganization?.id) === String(org.id) && "bg-accent"), children: [jsx(OrgMark, { logoUrl: org.logoUrl, size: "sm" }), jsx("span", { className: "truncate", children: org.name })] }, org.id))), jsx(DropdownMenuSeparator, {}), jsxs(DropdownMenuItem, { className: "gap-2 p-2 cursor-pointer", onClick: () => router.push(registerOrganizationHref), children: [jsx("div", { className: "flex size-6 items-center justify-center rounded-md border bg-transparent", children: jsx(Plus, { className: "size-4" }) }), jsx("span", { className: "text-muted-foreground font-medium", children: "\u0E40\u0E1E\u0E34\u0E48\u0E21\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" })] })] })] }));
+        await redirectToLogout();
+        return Promise.reject(toApiError(error));
     }
-    if (isLoading) {
-        return (jsx(SidebarMenu, { className: className, children: jsx(SidebarMenuItem, { children: jsxs("div", { className: "flex items-center gap-2 p-2", children: [jsx(Skeleton, { className: "size-8 rounded-lg" }), jsx(Skeleton, { className: "h-4 w-24" })] }) }) }));
+    // 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"));
+        }
     }
-    if (organizations.length <= 1) {
-        return (jsx(SidebarMenu, { className: className, children: jsx(SidebarMenuItem, { children: jsxs("div", { className: "flex items-center gap-2 p-2", children: [jsx(OrgMark, { logoUrl: activeOrganization?.logoUrl }), jsx("span", { className: "truncate font-semibold text-sm min-w-0 flex-1", children: activeOrganization?.name || "ไม่มีองค์กร" })] }) }) }));
+    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 (jsx(SidebarMenu, { className: className, children: jsx(SidebarMenuItem, { children: jsxs(DropdownMenu, { children: [jsx(DropdownMenuTrigger, { asChild: true, children: jsxs(SidebarMenuButton, { size: "lg", className: "data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground", children: [jsx(OrgMark, { logoUrl: activeOrganization?.logoUrl }), jsx("span", { className: "truncate font-semibold text-sm flex-1 min-w-0 text-left", children: activeOrganization?.name || "เลือกองค์กร" }), isPending ? (jsx(Loader2, { className: "ml-auto size-4 animate-spin" })) : (jsx(ChevronsUpDown, { className: "ml-auto size-4" }))] }) }), jsxs(DropdownMenuContent, { className: "w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg", align: "start", side: isMobile ? "bottom" : "right", sideOffset: 4, children: [jsx(DropdownMenuLabel, { className: "text-xs text-muted-foreground", children: "\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" }), organizations.map(org => (jsxs(DropdownMenuItem, { onClick: () => handleOrganizationChange(org), disabled: isPending, className: cn("gap-2 p-2 cursor-pointer", String(activeOrganization?.id) === String(org.id) &&
-                                    "bg-accent"), children: [jsx(OrgMark, { logoUrl: org.logoUrl, size: "sm" }), jsx("span", { className: "truncate", children: org.name })] }, org.id))), jsx(DropdownMenuSeparator, {}), jsxs(DropdownMenuItem, { className: "gap-2 p-2 cursor-pointer", onClick: () => router.push(registerOrganizationHref), children: [jsx("div", { className: "flex size-6 items-center justify-center rounded-md border bg-transparent", children: jsx(Plus, { className: "size-4" }) }), jsx("span", { className: "text-muted-foreground font-medium", children: "\u0E40\u0E1E\u0E34\u0E48\u0E21\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" })] })] })] }) }) }));
+    return DEFAULT_PLATFORM_API_URL;
 }
 
-function SidebarHeader({ children, className }) {
-    return jsx("div", { className: cn("px-2 py-3", className), children: children });
-}
+/**
+ * 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";
 
-function AppSidebar({ modules, tools, activeModule, orgCode, approvalCounts, closeOnNavigation = false, highlightActiveModule = false, header, footer, bottom, chrome = "brand", className, }) {
-    const { open } = useSidebar();
-    const modulesWithActiveState = React.useMemo(() => modules.map(m => ({
-        ...m,
-        isActive: m.id === activeModule,
-    })), [modules, activeModule]);
-    if (!open)
-        return null;
-    if (chrome === "workspace") {
-        return (jsxs("div", { className: cn("flex h-screen w-[244px] shrink-0 flex-col overflow-hidden border-r border-sidebar-border bg-sidebar text-sidebar-foreground", 
-            // As a drawer (≤1024px) it floats over the page and needs the lift.
-            "max-[1024px]:shadow-2xl", className), children: [header ? jsx("div", { className: "shrink-0 px-[18px] pt-8 pb-6", children: header }) : null, jsxs(SidebarContent, { className: "flex-1 overflow-y-auto px-[18px]", children: [jsx(NavMain, { items: modulesWithActiveState, orgCode: orgCode, approvalCounts: approvalCounts, closeOnNavigation: closeOnNavigation, chrome: "workspace", highlightActiveModule: highlightActiveModule }), jsx(NavTools, { tools: tools, closeOnNavigation: closeOnNavigation })] }), bottom ? jsx("div", { className: "shrink-0 px-[18px] pt-6", children: bottom }) : null, jsx("div", { className: "shrink-0 px-[18px] pb-3", children: footer })] }));
-    }
-    return (jsxs("div", { className: cn("bg-sidebar shrink-0 flex flex-col overflow-hidden shadow-2xl h-screen w-[var(--sidebar-width-mobile)]", "!w-76 xl:rounded-b-4xl xl:rounded-tl-4xl xl:m-5 xl:h-[calc(100vh-2.5rem)]", className), children: [jsx(SidebarHeader, { children: header }), jsxs(SidebarContent, { className: "pl-2 pr-2 flex-1 overflow-y-auto", children: [jsx(NavMain, { items: modulesWithActiveState, orgCode: orgCode, approvalCounts: approvalCounts, closeOnNavigation: closeOnNavigation }), jsx(NavTools, { tools: tools, closeOnNavigation: closeOnNavigation })] }), jsx(SidebarFooter, { className: "pl-2 pr-2", children: footer })] }));
-}
-
-/**
- * Header ink as CSS variables. Header-borne pieces — breadcrumb, sidebar
- * trigger, the org switcher, the app's own page title — read these, with
- * white as the fallback, so the brand chrome looks exactly as before.
- */
-const WORKSPACE_HEADER_VARS = {
-    "--header-fg": "#fff",
-    "--header-fg-muted": "rgb(255 255 255 / 0.78)",
-    "--header-hover": "rgb(255 255 255 / 0.12)",
-    "--header-title-px": "0px",
-    "--header-title-py": "0px",
-};
-const WORKSPACE_LIGHT_HEADER_VARS = {
-    "--header-fg": "var(--foreground)",
-    "--header-fg-muted": "var(--muted-foreground)",
-    "--header-hover": "var(--accent)",
-    "--header-mark-bg": "var(--accent)",
-    "--header-mark-fg": "var(--primary)",
-    "--header-mark-border": "transparent",
-    "--header-title-px": "0px",
-    "--header-title-py": "0px",
-};
-
-/**
- * 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 (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: jsx(CircleHelp, { className: "size-5", strokeWidth: 1.65 }) }));
-}
-
-/**
- * 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.52";
-
-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 {
+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;
     }
 }
@@ -1582,270 +1415,632 @@ function describeAttached(app, ctx, email) {
         .join(" · ");
 }
 
-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 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 = useContext(QueryClientContext);
+    if (provided)
+        return provided;
+    fallbackClient ?? (fallbackClient = new 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 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 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);
 }
-const toApiError = (error) => {
-    if (error instanceof ApiError)
-        return error;
-    if (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;
+/** The owner's chip: the app's accent, tinted. */
+function OwnerChip({ size = "card" }) {
+    return (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 (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 ? jsx(OwnerChip, {}) : null, shown.map((name, i) => {
+                const last = i === shown.length - 1;
+                return (jsxs("span", { className: "flex min-w-0 max-w-full items-baseline", children: [jsx("span", { className: "truncate", children: name }), !last ? (jsx("span", { "aria-hidden": "true", className: "shrink-0 pl-1 opacity-60", children: "\u00B7" })) : null, last && more > 0 ? (jsxs("span", { className: "shrink-0 pl-1 opacity-70", children: ["+", more] })) : null] }, name));
+            })] }));
+}
+/** Every role in full, for the menu. */
+function MenuRoles({ my }) {
+    return (jsxs("div", { className: "flex flex-wrap gap-1.5", children: [my.isOwner ? jsx(OwnerChip, { size: "menu" }) : null, my.roles.map(r => (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 } = 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 = useRouter();
+    const { theme, setTheme } = useTheme();
+    const [isSigningOut, setIsSigningOut] = useState(false);
+    const [isOpen, setIsOpen] = useState(false);
+    const [showThemeMenu, setShowThemeMenu] = useState(false);
+    const [showLanguageMenu, setShowLanguageMenu] = useState(false);
+    const [showAppsMenu, setShowAppsMenu] = useState(false);
+    const buttonRef = useRef(null);
+    const [position, setPosition] = 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,
         }
-        if ("quality_check" in node && !isCheckStatus(node.quality_check)) {
-            invalidPath = "quality_check";
-            return;
+        : 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 signOut({ callbackUrl: signInRedirectHref, redirect: true });
         }
-        if ("compare_with_reference" in node &&
-            !isCompareStatus(node.compare_with_reference)) {
-            invalidPath = "compare_with_reference";
+        catch (error) {
+            console.error("Sign out error:", error);
+            window.location.href = signInRedirectHref;
         }
-    });
-    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)
+        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);
+    };
+    useEffect(() => {
+        if (isOpen && buttonRef.current) {
+            const rect = buttonRef.current.getBoundingClientRect();
+            setPosition({ top: rect.bottom, left: rect.right + 8 });
+        }
+    }, [isOpen]);
+    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 (jsx("div", { className: "p-2", children: jsxs("div", { className: "flex items-center gap-2 p-2 rounded-md", children: [jsx("div", { className: "h-8 w-8 rounded-lg bg-sidebar-accent animate-pulse" }), jsxs("div", { className: "flex-1 space-y-1", children: [jsx("div", { className: "h-4 w-24 bg-sidebar-accent rounded animate-pulse" }), jsx("div", { className: "h-3 w-32 bg-sidebar-accent rounded animate-pulse" })] })] }) }));
+    }
+    if (!user)
         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 signOut({ callbackUrl: "/auth/signin" });
+    const visibleSystemLinks = (systemLinks ?? []).filter(link => link.href && link.label);
+    const dropdownContent = isOpen ? (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 && (jsx("div", { className: "p-4 border-b border-sidebar-border bg-sidebar-accent/30", children: jsxs("div", { className: `flex gap-3 ${myRoles ? "items-start" : "items-center"}`, children: [organization.logoUrl ? (
+                        // eslint-disable-next-line @next/next/no-img-element
+                        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";
+                            } })) : (jsx(Building2, { className: "h-5 w-5 text-sidebar-foreground/70 flex-shrink-0" })), jsxs("div", { className: "flex-1 min-w-0", children: [jsx("div", { className: "font-medium text-sm sm:truncate", children: organization.name }), organization.description && (jsx("div", { className: "text-xs text-sidebar-foreground/70 truncate mt-0.5", children: organization.description })), myRoles ? (jsx("div", { className: "mt-2.5", children: jsx(MenuRoles, { my: myRoles }) })) : null] })] }) })), !organization && myRoles ? (jsx("div", { className: "p-4 border-b border-sidebar-border bg-sidebar-accent/30", children: jsx(MenuRoles, { my: myRoles }) })) : null, jsxs("div", { className: "p-2", children: [jsxs("div", { className: "relative", children: [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: [jsx(Palette, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: "\u0E40\u0E1B\u0E25\u0E35\u0E48\u0E22\u0E19\u0E18\u0E35\u0E21" }), jsx(ChevronUp, { className: `h-4 w-4 transition-transform ${showThemeMenu ? "rotate-180" : ""}` })] }), showThemeMenu && (jsx("div", { className: "mt-1 ml-4 space-y-1", children: [
+                                    { key: "light", label: "สว่าง", Icon: Sun },
+                                    { key: "dark", label: "มืด", Icon: Moon },
+                                    { key: "system", label: "ตามระบบ", Icon: Monitor },
+                                ].map(({ key, label, Icon }) => (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: [jsx(Icon, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: label }), theme === key && (jsx("div", { className: "h-2 w-2 rounded-full bg-primary" }))] }, key))) }))] }), showLanguageSwitch && (jsxs("div", { className: "relative", children: [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: [jsx(Globe, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: "\u0E40\u0E1B\u0E25\u0E35\u0E48\u0E22\u0E19\u0E20\u0E32\u0E29\u0E32" }), jsx(ChevronUp, { className: `h-4 w-4 transition-transform ${showLanguageMenu ? "rotate-180" : ""}` })] }), showLanguageMenu && (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 }) => (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: [jsx("span", { className: "flex-1 text-left", children: label }), organization?.language === code && (jsx("div", { className: "h-2 w-2 rounded-full bg-primary" }))] }, code))) }))] })), profileHref && (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: [jsx(User, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: "\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25\u0E2A\u0E48\u0E27\u0E19\u0E15\u0E31\u0E27" })] })), showSelectOrganization && (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: [jsx(Building2, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E18\u0E38\u0E23\u0E01\u0E34\u0E08" })] })), visibleSystemLinks.length > 0 && (jsxs("div", { className: "relative", children: [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: [jsx(LayoutGrid, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: "\u0E41\u0E2D\u0E1B\u0E1E\u0E25\u0E34\u0E40\u0E04\u0E0A\u0E31\u0E19" }), jsx(ChevronUp, { className: `h-4 w-4 transition-transform ${showAppsMenu ? "rotate-180" : ""}` })] }), showAppsMenu && (jsx("div", { className: "mt-1 ml-4 space-y-1", children: visibleSystemLinks.map(link => (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 ?? jsx(ExternalLink, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: link.label }), link.active && (jsx("div", { className: "h-2 w-2 rounded-full bg-primary" }))] }, `${link.label}:${link.href}`))) }))] })), helpAvailable && (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: [jsx(CircleHelp, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D" })] })), 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 ? (jsxs(Fragment$1, { children: [jsx(Loader2, { className: "h-4 w-4 animate-spin" }), jsx("span", { className: "flex-1 text-left", children: "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E2D\u0E2D\u0E01\u0E08\u0E32\u0E01\u0E23\u0E30\u0E1A\u0E1A..." })] })) : (jsxs(Fragment$1, { children: [jsx(LogOut, { className: "h-4 w-4" }), jsx("span", { className: "flex-1 text-left", children: "\u0E2D\u0E2D\u0E01\u0E08\u0E32\u0E01\u0E23\u0E30\u0E1A\u0E1A" })] })) })] })] })) : null;
+    if (variant === "workspace") {
+        return (jsx("div", { className: "mt-3.5 border-t border-sidebar-border pt-3", children: jsxs("div", { className: "relative", children: [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: [jsxs(Avatar, { className: "size-[34px] shrink-0 rounded-full border-[3px] border-sidebar-accent", children: [user.avatar ? (jsx(AvatarImage, { src: user.avatar, alt: user.name })) : null, jsx(AvatarFallback, { className: "rounded-full bg-sidebar-accent text-sm font-medium text-sidebar-accent-foreground", children: getInitials(user.name) })] }), jsxs("span", { className: `grid min-w-0 flex-1 leading-tight ${cardTall ? "gap-0.5" : ""}`, children: [jsx("strong", { className: `truncate text-[13px] font-semibold ${cardTall ? "pr-5" : ""}`, title: user.name, children: user.name }), myRoles ? (jsx(CardRoles, { my: myRoles, className: "text-[12px] font-medium leading-[17px] text-sidebar-foreground/80" })) : rolesLoading ? (jsx("span", { className: "my-[3px] block h-[11px] w-20 animate-pulse rounded bg-sidebar-accent" })) : null, jsx("small", { className: "truncate text-[11px] text-muted-foreground", title: user.email, children: user.email })] }), jsx(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" &&
+                        createPortal(dropdownContent, document.body)] }) }));
+    }
+    return (jsx("div", { className: "p-2", children: jsxs("div", { className: "relative", children: [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: [jsxs(Avatar, { className: "h-8 w-8 shrink-0 rounded-lg", children: [user.avatar ? (jsx(AvatarImage, { src: user.avatar, alt: user.name })) : null, jsx(AvatarFallback, { className: "rounded-lg bg-primary text-primary-foreground w-8 h-8", children: getInitials(user.name) })] }), jsxs("div", { className: `grid min-w-0 flex-1 text-left text-sm leading-tight ${cardTall ? "gap-0.5" : ""}`, children: [jsx("span", { className: `truncate font-medium ${cardTall ? "pr-6" : ""}`, title: user.name, children: user.name }), myRoles ? (jsx(CardRoles, { my: myRoles, className: "text-xs font-medium text-sidebar-foreground/85" })) : rolesLoading ? (jsx("span", { className: "my-0.5 block h-3 w-24 animate-pulse rounded bg-sidebar-accent" })) : null, jsx("span", { className: "truncate text-xs text-sidebar-foreground/70", title: user.email, children: user.email })] }), jsx(ChevronUp, { className: `size-4 transition-transform ${isOpen ? "rotate-180" : ""} ${cardTall ? "absolute right-2 top-2.5" : "ml-auto shrink-0"}` })] }), typeof window !== "undefined" &&
+                    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",
 };
-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 AxiosHeaders();
+/** 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 (config.data instanceof FormData && config.headers) {
-        delete config.headers["Content-Type"];
+    if (ACCOUNTING_SUB_KEYS.includes(feature) &&
+        features.includes(PLAN_FEATURES.MODULE_ACCOUNTING)) {
+        return true;
     }
-    if (!isBrowser())
-        return config;
-    const token = await getAccessToken(false);
-    if (token) {
-        config.headers.Authorization = `Bearer ${token}`;
+    if (feature === PLAN_FEATURES.BASIC_ACCOUNTING_HR &&
+        features.includes(PLAN_FEATURES.MODULE_HR) &&
+        features.includes(PLAN_FEATURES.MODULE_ACCOUNTING)) {
+        return true;
     }
-    // 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 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: jsx(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: jsx(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: jsx(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: jsx(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: jsx(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) {
+        return true;
     }
-    const precheck = runGlobalRequestPrecheck(config);
-    if (!precheck.valid) {
-        throw new ApiError(precheck.message || "Invalid request payload");
+    // Check if pathname starts with url + "/" to ensure exact segment matching
+    // This prevents /reports/sales from matching /sales
+    // Example: /org123/reports/sales should NOT match /org123/sales
+    // But /org123/sales/overview SHOULD match /org123/sales
+    if (pathname.startsWith(url + "/")) {
+        return true;
     }
-    return config;
-});
-let refreshPromise = null;
-const refreshTokenSingleFlight = async () => {
-    if (!refreshPromise) {
-        refreshPromise = getAccessToken(true).finally(() => {
-            refreshPromise = null;
+    return false;
+}
+
+/** "/O1/" and "/O1" are the same page; a query string never is. */
+function samePage(pathname, url) {
+    if (url.includes("?"))
+        return false;
+    const strip = (p) => (p.length > 1 ? p.replace(/\/+$/, "") : p);
+    return strip(pathname) === strip(url);
+}
+function NavMain({ items, orgCode, closeOnNavigation = false, approvalCounts, chrome = "brand", highlightActiveModule = false, }) {
+    const workspace = chrome === "workspace";
+    const params = useParams();
+    const pathname = usePathname();
+    const { setOpen } = useSidebar();
+    const handleNavLinkClick = () => {
+        if (closeOnNavigation)
+            setOpen(false);
+    };
+    const code = orgCode ?? params?.code;
+    // Which module (and sub-item) the current page belongs to.
+    const states = items.map(item => {
+        const itemUrl = buildUrlWithCode(code, item.url);
+        // Most specific (longest) matching sub-item URL so only one link is active.
+        const activeSubItemUrl = item.subModules?.reduce((best, subItem) => {
+            const subItemUrl = buildUrlWithCode(code, subItem.url);
+            const matches = isPathActive(pathname, subItemUrl) ||
+                isPathActive(pathname, subItem.url);
+            const subPageMatches = subItem.subPages?.some(subPage => isPathActive(pathname, buildUrlWithCode(code, subPage.url)) ||
+                isPathActive(pathname, subPage.url));
+            if (!matches && !subPageMatches)
+                return best;
+            const candidateUrl = subItemUrl;
+            if (!best)
+                return candidateUrl;
+            return candidateUrl.length > best.length ? candidateUrl : best;
+        }, null) ?? null;
+        const hasActiveSubItem = !!activeSubItemUrl ||
+            !!item.subModules?.some(subItem => subItem.subPages?.some(subPage => isPathActive(pathname, buildUrlWithCode(code, subPage.url)) ||
+                isPathActive(pathname, subPage.url)));
+        // Parent only active when path matches its URL exactly AND no child
+        // is active (so parent+child don't both light up).
+        const isItemActive = (highlightActiveModule && !item.subModules?.length && !!item.isActive) ||
+            ((workspace ? samePage(pathname, itemUrl) : pathname === itemUrl) &&
+                !hasActiveSubItem);
+        return { itemUrl, activeSubItemUrl, hasActiveSubItem, isItemActive };
+    });
+    // A group opens when its page becomes current and otherwise stays as the
+    // user left it. defaultOpen alone decided once, on the first render — and
+    // on a direct load the sub-items arrive after permissions do, so the group
+    // holding the current page stayed shut.
+    const activeKey = items
+        .filter((_, i) => states[i].isItemActive || states[i].hasActiveSubItem)
+        .map(item => item.id)
+        .join(",");
+    const [openIds, setOpenIds] = React.useState(() => new Set(activeKey ? activeKey.split(",") : []));
+    React.useEffect(() => {
+        if (!activeKey)
+            return;
+        setOpenIds(prev => {
+            const ids = activeKey.split(",");
+            if (ids.every(id => prev.has(id)))
+                return prev;
+            const next = new Set(prev);
+            ids.forEach(id => next.add(id));
+            return next;
         });
+    }, [activeKey]);
+    const setItemOpen = (id, open) => setOpenIds(prev => {
+        if (prev.has(id) === open)
+            return prev;
+        const next = new Set(prev);
+        if (open)
+            next.add(id);
+        else
+            next.delete(id);
+        return next;
+    });
+    return (jsx(SidebarGroup, { "data-sidebar": true, className: workspace ? "p-0" : undefined, children: jsx(SidebarMenu, { className: workspace ? "gap-[3px]" : undefined, children: items.map((item, index) => {
+                const groupHeading = workspace &&
+                    item.group &&
+                    item.group !== items[index - 1]?.group ? (jsx("li", { className: "list-none px-3 pb-2.5 text-xs text-muted-foreground" +
+                        (index > 0 ? " pt-5" : ""), children: item.group }, `group-${item.id}`)) : null;
+                const { itemUrl, activeSubItemUrl, isItemActive } = states[index];
+                const IconComp = item.icon;
+                const workspaceButton = workspace
+                    ? "h-auto gap-3 rounded-[10px] px-3 py-2.5 text-[13px] " +
+                        (isItemActive
+                            ? "bg-sidebar-accent font-bold text-sidebar-accent-foreground"
+                            : "font-medium text-sidebar-foreground/70")
+                    : "";
+                const icon = workspace && IconComp ? (jsx(IconComp, { className: "size-[18px] shrink-0" })) : null;
+                const badge = workspace && item.badge !== undefined && item.badge !== "" ? (jsx("span", { className: "ml-auto min-w-5 rounded-[5px] bg-primary/15 px-1 text-center text-[10px] leading-5 font-bold tabular-nums text-primary", children: item.badge })) : null;
+                return (jsxs(React.Fragment, { children: [groupHeading, jsx(Collapsible, { asChild: true, open: openIds.has(item.id), onOpenChange: open => setItemOpen(item.id, open), className: "group/collapsible", children: jsxs(SidebarMenuItem, { children: [jsx(CollapsibleTrigger, { asChild: true, children: jsx(SidebarMenuButton, { asChild: !item.subModules || item.subModules.length === 0, isActive: isItemActive, className: "data-[state=open]:text-sidebar-accent-foreground " +
+                                                workspaceButton, children: item.subModules && item.subModules.length > 0 ? (jsxs(Fragment$1, { children: [icon, jsx("span", { id: item.id, children: item.titleTh }), jsx(ChevronRight, { className: "ml-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90" })] })) : (jsxs(Link, { href: itemUrl, prefetch: false, className: "flex items-center w-full min-w-0 flex-1 " +
+                                                    (workspace ? "gap-3" : "gap-2"), onClick: handleNavLinkClick, "aria-current": isItemActive ? "page" : undefined, children: [icon, jsx("span", { id: item.id, className: "flex-1 truncate", title: item.titleTh, children: item.titleTh }), badge] })) }) }), item.subModules && item.subModules.length > 0 && (jsx(CollapsibleContent, { children: jsx(SidebarMenuSub, { className: workspace
+                                                ? "mx-0 mt-1 mb-3 ml-[21px] gap-0.5 border-l border-sidebar-border pl-2.5 [&_a]:h-auto [&_a]:gap-[11px] [&_a]:px-3 [&_a]:py-2 [&_a]:text-[13px] [&_svg]:!size-[17px]"
+                                                : undefined, children: item.subModules.map(subItem => {
+                                                const subItemUrl = buildUrlWithCode(code, subItem.url);
+                                                const isSubItemActive = subItemUrl === activeSubItemUrl;
+                                                const SubIcon = subItem.icon;
+                                                const approvalCount = approvalCounts && subItem.approvalCountKey
+                                                    ? (approvalCounts[subItem.approvalCountKey] ?? 0)
+                                                    : 0;
+                                                if (subItem.isCollapsible &&
+                                                    subItem.subPages &&
+                                                    subItem.subPages.length > 0) {
+                                                    const hasActiveSubPage = subItem.subPages.some(subPage => isPathActive(pathname, buildUrlWithCode(code, subPage.url)));
+                                                    return (jsx(Collapsible, { asChild: true, defaultOpen: isSubItemActive || hasActiveSubPage, className: "group/sub-collapsible", children: jsxs(SidebarMenuSubItem, { children: [jsx(CollapsibleTrigger, { asChild: true, children: jsxs(SidebarMenuSubButton, { className: "w-full", isActive: isSubItemActive || hasActiveSubPage, children: [SubIcon && (jsx(SubIcon, { className: "sidebar-submodule-icon flex-shrink-0" })), jsx("span", { className: "flex-1 truncate", title: subItem.titleTh, children: subItem.titleTh }), jsx(ChevronDown, { className: "ml-auto size-4 transition-transform duration-200 group-data-[state=open]/sub-collapsible:rotate-180" })] }) }), jsx(CollapsibleContent, { children: jsx(SidebarMenuSub, { className: "ml-4", children: subItem.subPages.map(subPage => {
+                                                                            const subPageUrl = buildUrlWithCode(code, subPage.url);
+                                                                            const isSubPageActive = isPathActive(pathname, subPageUrl);
+                                                                            const SubPageIcon = subPage.icon;
+                                                                            return (jsx(SidebarMenuSubItem, { children: jsx(SidebarMenuSubButton, { asChild: true, className: `font-thai w-full text-sm ${isSubPageActive
+                                                                                        ? "text-sidebar-accent-foreground font-medium"
+                                                                                        : "text-sidebar-foreground"}`, isActive: false, children: jsxs(Link, { href: subPageUrl, prefetch: false, className: "w-full flex items-center", onClick: handleNavLinkClick, children: [SubPageIcon && (jsx(SubPageIcon, { className: "sidebar-subpage-icon flex-shrink-0" })), jsx("span", { className: "flex-1 truncate", title: subPage.titleTh, children: subPage.titleTh })] }) }) }, subPage.id));
+                                                                        }) }) })] }) }, subItem.id));
+                                                }
+                                                return (jsx(SidebarMenuSubItem, { children: jsx(SidebarMenuSubButton, { asChild: true, className: "w-full" +
+                                                            (workspace && isSubItemActive
+                                                                ? " font-semibold"
+                                                                : ""), isActive: isSubItemActive, children: jsxs(Link, { href: subItemUrl, prefetch: false, className: "w-full flex items-center", onClick: handleNavLinkClick, children: [SubIcon && (jsx(SubIcon, { className: "sidebar-submodule-icon flex-shrink-0" })), jsx("span", { className: "flex-1 truncate", title: subItem.titleTh, children: subItem.titleTh }), approvalCount > 0 && (jsx(Badge, { variant: "destructive", className: "ml-auto h-5 min-w-5 px-1.5 text-xs font-medium tabular-nums", children: approvalCount > 99
+                                                                        ? "99+"
+                                                                        : approvalCount }))] }) }) }, subItem.id));
+                                            }) }) }))] }) })] }, item.id));
+            }) }) }));
+}
+
+function OrgMark({ logoUrl, size = "md", }) {
+    const [failed, setFailed] = useState(false);
+    const box = size === "sm"
+        ? "flex size-6 items-center justify-center rounded-md border overflow-hidden bg-background"
+        : size === "header"
+            ? "flex aspect-square size-8 shrink-0 items-center justify-center rounded-[9px] border border-[color:var(--header-mark-border,color-mix(in_oklab,var(--header-fg,currentColor)_28%,transparent))] bg-[var(--header-mark-bg,color-mix(in_oklab,var(--header-fg,currentColor)_10%,transparent))] text-[var(--header-mark-fg,var(--header-fg,currentColor))] overflow-hidden max-sm:size-7"
+            : "flex aspect-square size-8 shrink-0 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground overflow-hidden";
+    const icon = size === "sm" ? "size-3.5 shrink-0" : "size-4";
+    if (logoUrl && !failed) {
+        return (jsx("div", { className: cn(box, size === "md" && "bg-white"), children: jsx("img", { src: logoUrl, alt: "", className: "size-full object-contain p-0.5", onError: () => setFailed(true) }) }));
     }
-    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);
+    return (jsx("div", { className: box, children: jsx(Building2, { className: icon }) }));
+}
+function OrganizationSwitcher({ activeOrganization, isContextLoading = false, organizations, isLoadingOrgs = false, setOrganizationCookie, registerOrganizationHref = "/register-organization", placement = "sidebar", className, }) {
+    const { isMobile } = useSidebarToggle();
+    const router = useRouter();
+    const params = useParams();
+    const [isPending, startTransition] = useTransition();
+    const currentCode = params?.code
+        ? Array.isArray(params.code)
+            ? params.code[0]
+            : params.code
+        : undefined;
+    const handleOrganizationChange = (org) => {
+        startTransition(async () => {
+            const orgCode = org.code || String(org.id);
+            // Write storage + cookie before navigation — Layout will re-hydrate
+            // Context on the new URL.
+            try {
+                setOrganizationId(String(org.id));
+                await setOrganizationCookie(org.id);
+            }
+            catch {
+                // ignore: navigation will re-attempt context resolution
+            }
+            if (currentCode) {
+                const currentPath = window.location.pathname;
+                const parts = currentPath.split("/");
+                const decodedParts = parts.map(p => decodeURIComponent(p));
+                const codeIndex = decodedParts.indexOf(currentCode);
+                if (codeIndex !== -1) {
+                    parts[codeIndex] = orgCode;
+                    router.push(parts.join("/"));
+                }
+                else {
+                    router.push(`/${orgCode}`);
+                }
+            }
+            else {
+                router.push(`/${orgCode}`);
+            }
+        });
+    };
+    const isLoading = isLoadingOrgs || isContextLoading;
+    if (placement === "header") {
+        const face = (interactive) => (jsxs(Fragment$1, { children: [jsx(OrgMark, { logoUrl: activeOrganization?.logoUrl, size: "header" }), jsxs("span", { className: "min-w-0 text-left", children: [jsx("small", { className: "block text-[10px] leading-tight text-[var(--header-fg-muted,currentColor)] max-sm:text-[9px]", children: "\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23\u0E17\u0E35\u0E48\u0E01\u0E33\u0E25\u0E31\u0E07\u0E43\u0E0A\u0E49\u0E07\u0E32\u0E19" }), isLoading ? (jsx(Skeleton, { className: "mt-1 h-3.5 w-28" })) : (jsx("strong", { className: "block max-w-[220px] truncate text-xs font-semibold text-[var(--header-fg,currentColor)] max-sm:max-w-[140px] max-sm:text-[11px]", children: activeOrganization?.name || "เลือกองค์กร" }))] }), interactive ? (isPending ? (jsx(Loader2, { className: "ml-1 size-3.5 shrink-0 animate-spin text-[var(--header-fg-muted,currentColor)]" })) : (jsx(ChevronsUpDown, { className: "ml-1 size-3.5 shrink-0 text-[var(--header-fg-muted,currentColor)]" }))) : null] }));
+        const faceClass = cn("flex items-center gap-2.5 rounded-lg py-1.5 max-sm:gap-2", className);
+        if (isLoading || organizations.length <= 1) {
+            return jsx("div", { className: faceClass, children: face(false) });
         }
-        await redirectToLogout();
-        return Promise.reject(toApiError(error));
+        return (jsxs(DropdownMenu, { children: [jsx(DropdownMenuTrigger, { className: cn(faceClass, "px-1.5 outline-none transition-colors hover:bg-[var(--header-hover,var(--accent))] focus-visible:ring-2 focus-visible:ring-[var(--header-fg-muted,var(--ring))] data-[state=open]:bg-[var(--header-hover,var(--accent))]"), "aria-label": "\u0E40\u0E1B\u0E25\u0E35\u0E48\u0E22\u0E19\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23", children: face(true) }), jsxs(DropdownMenuContent, { className: "min-w-64 rounded-lg", align: "end", side: "bottom", sideOffset: 6, children: [jsx(DropdownMenuLabel, { className: "text-xs text-muted-foreground", children: "\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" }), organizations.map(org => (jsxs(DropdownMenuItem, { onClick: () => handleOrganizationChange(org), disabled: isPending, className: cn("gap-2 p-2 cursor-pointer", String(activeOrganization?.id) === String(org.id) && "bg-accent"), children: [jsx(OrgMark, { logoUrl: org.logoUrl, size: "sm" }), jsx("span", { className: "truncate", children: org.name })] }, org.id))), jsx(DropdownMenuSeparator, {}), jsxs(DropdownMenuItem, { className: "gap-2 p-2 cursor-pointer", onClick: () => router.push(registerOrganizationHref), children: [jsx("div", { className: "flex size-6 items-center justify-center rounded-md border bg-transparent", children: jsx(Plus, { className: "size-4" }) }), jsx("span", { className: "text-muted-foreground font-medium", children: "\u0E40\u0E1E\u0E34\u0E48\u0E21\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" })] })] })] }));
     }
-    // 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"));
-        }
+    if (isLoading) {
+        return (jsx(SidebarMenu, { className: className, children: jsx(SidebarMenuItem, { children: jsxs("div", { className: "flex items-center gap-2 p-2", children: [jsx(Skeleton, { className: "size-8 rounded-lg" }), jsx(Skeleton, { className: "h-4 w-24" })] }) }) }));
+    }
+    if (organizations.length <= 1) {
+        return (jsx(SidebarMenu, { className: className, children: jsx(SidebarMenuItem, { children: jsxs("div", { className: "flex items-center gap-2 p-2", children: [jsx(OrgMark, { logoUrl: activeOrganization?.logoUrl }), jsx("span", { className: "truncate font-semibold text-sm min-w-0 flex-1", children: activeOrganization?.name || "ไม่มีองค์กร" })] }) }) }));
     }
-    return Promise.reject(toApiError(error));
-});
+    return (jsx(SidebarMenu, { className: className, children: jsx(SidebarMenuItem, { children: jsxs(DropdownMenu, { children: [jsx(DropdownMenuTrigger, { asChild: true, children: jsxs(SidebarMenuButton, { size: "lg", className: "data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground", children: [jsx(OrgMark, { logoUrl: activeOrganization?.logoUrl }), jsx("span", { className: "truncate font-semibold text-sm flex-1 min-w-0 text-left", children: activeOrganization?.name || "เลือกองค์กร" }), isPending ? (jsx(Loader2, { className: "ml-auto size-4 animate-spin" })) : (jsx(ChevronsUpDown, { className: "ml-auto size-4" }))] }) }), jsxs(DropdownMenuContent, { className: "w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg", align: "start", side: isMobile ? "bottom" : "right", sideOffset: 4, children: [jsx(DropdownMenuLabel, { className: "text-xs text-muted-foreground", children: "\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" }), organizations.map(org => (jsxs(DropdownMenuItem, { onClick: () => handleOrganizationChange(org), disabled: isPending, className: cn("gap-2 p-2 cursor-pointer", String(activeOrganization?.id) === String(org.id) &&
+                                    "bg-accent"), children: [jsx(OrgMark, { logoUrl: org.logoUrl, size: "sm" }), jsx("span", { className: "truncate", children: org.name })] }, org.id))), jsx(DropdownMenuSeparator, {}), jsxs(DropdownMenuItem, { className: "gap-2 p-2 cursor-pointer", onClick: () => router.push(registerOrganizationHref), children: [jsx("div", { className: "flex size-6 items-center justify-center rounded-md border bg-transparent", children: jsx(Plus, { className: "size-4" }) }), jsx("span", { className: "text-muted-foreground font-medium", children: "\u0E40\u0E1E\u0E34\u0E48\u0E21\u0E2D\u0E07\u0E04\u0E4C\u0E01\u0E23" })] })] })] }) }) }));
+}
+
+function SidebarHeader({ children, className }) {
+    return jsx("div", { className: cn("px-2 py-3", className), children: children });
+}
+
+function AppSidebar({ modules, tools, activeModule, orgCode, approvalCounts, closeOnNavigation = false, highlightActiveModule = false, header, footer, bottom, chrome = "brand", className, }) {
+    const { open } = useSidebar();
+    const modulesWithActiveState = React.useMemo(() => modules.map(m => ({
+        ...m,
+        isActive: m.id === activeModule,
+    })), [modules, activeModule]);
+    if (!open)
+        return null;
+    if (chrome === "workspace") {
+        return (jsxs("div", { className: cn("flex h-screen w-[244px] shrink-0 flex-col overflow-hidden border-r border-sidebar-border bg-sidebar text-sidebar-foreground", 
+            // As a drawer (≤1024px) it floats over the page and needs the lift.
+            "max-[1024px]:shadow-2xl", className), children: [header ? jsx("div", { className: "shrink-0 px-[18px] pt-8 pb-6", children: header }) : null, jsxs(SidebarContent, { className: "flex-1 overflow-y-auto px-[18px]", children: [jsx(NavMain, { items: modulesWithActiveState, orgCode: orgCode, approvalCounts: approvalCounts, closeOnNavigation: closeOnNavigation, chrome: "workspace", highlightActiveModule: highlightActiveModule }), jsx(NavTools, { tools: tools, closeOnNavigation: closeOnNavigation })] }), bottom ? jsx("div", { className: "shrink-0 px-[18px] pt-6", children: bottom }) : null, jsx("div", { className: "shrink-0 px-[18px] pb-3", children: footer })] }));
+    }
+    return (jsxs("div", { className: cn("bg-sidebar shrink-0 flex flex-col overflow-hidden shadow-2xl h-screen w-[var(--sidebar-width-mobile)]", "!w-76 xl:rounded-b-4xl xl:rounded-tl-4xl xl:m-5 xl:h-[calc(100vh-2.5rem)]", className), children: [jsx(SidebarHeader, { children: header }), jsxs(SidebarContent, { className: "pl-2 pr-2 flex-1 overflow-y-auto", children: [jsx(NavMain, { items: modulesWithActiveState, orgCode: orgCode, approvalCounts: approvalCounts, closeOnNavigation: closeOnNavigation }), jsx(NavTools, { tools: tools, closeOnNavigation: closeOnNavigation })] }), jsx(SidebarFooter, { className: "pl-2 pr-2", children: footer })] }));
+}
+
+/**
+ * Header ink as CSS variables. Header-borne pieces — breadcrumb, sidebar
+ * trigger, the org switcher, the app's own page title — read these, with
+ * white as the fallback, so the brand chrome looks exactly as before.
+ */
+const WORKSPACE_HEADER_VARS = {
+    "--header-fg": "#fff",
+    "--header-fg-muted": "rgb(255 255 255 / 0.78)",
+    "--header-hover": "rgb(255 255 255 / 0.12)",
+    "--header-title-px": "0px",
+    "--header-title-py": "0px",
+};
+const WORKSPACE_LIGHT_HEADER_VARS = {
+    "--header-fg": "var(--foreground)",
+    "--header-fg-muted": "var(--muted-foreground)",
+    "--header-hover": "var(--accent)",
+    "--header-mark-bg": "var(--accent)",
+    "--header-mark-fg": "var(--primary)",
+    "--header-mark-border": "transparent",
+    "--header-title-px": "0px",
+    "--header-title-py": "0px",
+};
+
+/**
+ * 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 (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: jsx(CircleHelp, { className: "size-5", strokeWidth: 1.65 }) }));
+}
 
 const hasPaginationShape = (payload) => {
     return ("total" in payload ||
@@ -1873,46 +2068,358 @@ const unwrapApiResponse = (payload) => {
 };
 
 /**
- * The help channel lives on platform-api (POST /support/messages): every app
- * already calls it with the user's token and the organisation header, and
- * its CORS admits every app. The shared axios instance carries both and
+ * 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.
+ *
+ * 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.
+ */
+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);
+        }
+    }
+    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 });
+        }
+        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 });
+    }
+    /** 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"),
+        };
+    }
+    /**
+     * 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();
+    }
+}
+
+/**
+ * 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.
  */
-const DEFAULT_PLATFORM_API_URL = "https://platform-api.antniti.com/api/v1";
 function helpApiBase(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;
+    return platformApiBase(app);
 }
-/** A failure the dialog shows as is. */
+/** 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) {
+    constructor(message, status, attachmentId) {
         super(message);
         Object.defineProperty(this, "status", {
             enumerable: true,
             configurable: true,
             writable: true,
-            value: status
+            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 attachmentIdOf(err) {
+    const data = err?.response?.data?.data;
+    return typeof data?.attachment_id === "string" ? data.attachment_id : undefined;
+}
 function friendly(err, fallback) {
     const e = toApiError(err);
+    const attachmentId = attachmentIdOf(err);
     if (e.status === 429) {
-        return new HelpSendError("ส่งบ่อยเกินไป กรุณาลองใหม่ภายหลัง", 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) {
+    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);
+    return new HelpSendError(fallback, e.status, attachmentId);
 }
 async function sendHelpMessage(input) {
     try {
@@ -1921,6 +2428,7 @@ async function sendHelpMessage(input) {
             message: input.message,
             app: input.app === "other" ? "" : input.app,
             context: input.context,
+            attachment_ids: input.attachmentIds ?? [],
         });
         return unwrapApiResponse(res.data);
     }
@@ -1928,6 +2436,83 @@ async function sendHelpMessage(input) {
         throw friendly(err, "ส่งไม่สำเร็จ");
     }
 }
+/** 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, "โหลดข้อมูลไม่สำเร็จ");
+    }
+}
+/** 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);
+        };
+        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);
+    });
+}
+/**
+ * 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 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`, {
@@ -1941,6 +2526,167 @@ async function listMyHelpMessages(app) {
     }
 }
 
+/** One message's images, uploading as they are added. */
+function useHelpAttachments(app) {
+    const attach = React.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.useRef({
+        items: attach.items,
+        rejections: attach.rejections,
+    });
+    const read = React.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.useSyncExternalStore(React.useCallback(l => attach.subscribe(l), [attach]), read, read);
+    // Leaving the page: what was uploaded and not sent is forgotten.
+    React.useEffect(() => () => attach.clear(), [attach]);
+    return { attach, items: state.items, rejections: state.rejections };
+}
+/**
+ * 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 useHelpImageDrop(attach, enabled) {
+    const [over, setOver] = React.useState(false);
+    const depth = React.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`;
+}
+/**
+ * แนบรูป: 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 HelpAttachField({ state, disabled, id }) {
+    const { attach, items, rejections } = state;
+    const input = React.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 (jsxs("div", { className: "grid gap-2", children: [jsxs("div", { className: "flex flex-wrap items-start gap-2", children: [items.map(it => (jsx(AttachThumb, { item: it, onRemove: () => attach.remove(it.key), disabled: disabled }, it.key))), jsxs(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: [jsx(ImagePlus, { className: "h-4 w-4" }), "\u0E41\u0E19\u0E1A\u0E23\u0E39\u0E1B"] }), 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 ? (jsx("ul", { role: "alert", className: "grid gap-0.5 text-xs text-destructive", children: problems.map(p => (jsxs("li", { className: "break-words", children: [p.name, ": ", p.message] }, p.key))) })) : null] }));
+}
+function AttachThumb({ item, onRemove, disabled }) {
+    const failed = item.status === "failed";
+    return (jsxs("figure", { className: "relative m-0 w-16", children: [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
+                    jsx("img", { src: item.preview, alt: item.name, className: "h-full w-full object-cover" })) : null, item.status === "uploading" ? (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: jsx("div", { className: "h-full bg-primary transition-[width]", style: { width: `${Math.round(item.progress * 100)}%` } }) })) : null] }), 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: jsx(X, { className: "h-3 w-3" }) }), jsx("figcaption", { className: "mt-0.5 truncate text-[10px] leading-tight text-muted-foreground", title: item.name, children: failed ? 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 (jsx("ul", { className: "mt-2 flex flex-wrap gap-2", children: images.map(img => (jsx("li", { children: img.url ? (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: jsx("img", { src: img.url, alt: img.file_name || "รูปที่แนบ", loading: "lazy", className: "h-full w-full object-cover" }) })) : (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);
+    }
+    catch {
+        return null;
+    }
+    const raw = (params.get(HELP_LINK_PARAM) ?? "").trim().toUpperCase();
+    return REF.test(raw) ? raw : null;
+}
+/**
+ * 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 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();
+}
+
 const KINDS = [
     { value: "help", label: "ขอความช่วยเหลือ", placeholder: "ต้องการให้ช่วยเรื่องอะไร" },
     { value: "problem", label: "แจ้งปัญหา", placeholder: "เกิดอะไรขึ้น และกำลังทำอะไรอยู่" },
@@ -1958,6 +2704,7 @@ const STATUS_TONE = {
     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()))
@@ -1971,10 +2718,34 @@ function when(iso) {
         hour12: false,
     });
 }
+function errorText(e, fallback) {
+    return e instanceof Error && e.message ? e.message : fallback;
+}
+/**
+ * Sends a message with its images: waits for what is still uploading, then
+ * sends; an image platform-api refuses is marked on its thumbnail.
+ */
+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;
+    }
+    catch (err) {
+        if (err instanceof HelpSendError && err.attachmentId)
+            state.attach.refuse(err.attachmentId, err.message);
+        throw err;
+    }
+}
 /**
  * The ช่วยเหลือ dialog. AppLayoutShell mounts one; the top-bar button and
- * the user menu open it with openHelp(). It sends to platform-api, which
- * puts the message in the back office's queue on admin.antniti.com.
+ * 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 HelpDialogHost({ app, orgCode }) {
     const open = useHelpOpen();
@@ -1987,24 +2758,60 @@ function HelpDialogHost({ app, orgCode }) {
     const [sent, setSent] = React.useState(null);
     const [mine, setMine] = React.useState(null);
     const [mineError, setMineError] = React.useState(null);
+    const [threadKey, setThreadKey] = React.useState(null);
+    const [thread, setThread] = React.useState(null);
+    const [threadError, setThreadError] = React.useState(null);
+    const [followDraft, setFollowDraft] = React.useState("");
+    const [following, setFollowing] = React.useState(false);
+    const [followError, setFollowError] = React.useState(null);
     React.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.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.useMemo(() => detectHelpApp(app), [app, open]);
     const context = React.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.useCallback((key) => {
+        setView("thread");
+        setThreadKey(key);
+        setThread(null);
+        setThreadError(null);
+        setFollowError(null);
+        getMyHelpMessage(appId, key)
+            .then(setThread)
+            .catch((e) => setThreadError(errorText(e, "โหลดข้อมูลไม่สำเร็จ")));
+    }, [appId]);
     React.useEffect(() => {
-        if (open) {
+        if (!open)
+            return;
+        setError(null);
+        const key = pendingHelpRef();
+        if (key)
+            openThread(key);
+        else
             setView("form");
-            setError(null);
-        }
-    }, [open]);
+    }, [open, openThread]);
     const loadMine = React.useCallback(() => {
+        clearPendingHelpRef();
         setView("mine");
         setMine(null);
         setMineError(null);
         listMyHelpMessages(appId)
             .then(setMine)
-            .catch((e) => setMineError(e instanceof Error ? e.message : "โหลดข้อมูลไม่สำเร็จ"));
+            .catch((e) => setMineError(errorText(e, "โหลดข้อมูลไม่สำเร็จ")));
     }, [appId]);
     const trimmed = message.trim();
     const canSend = trimmed.length > 0 && !sending;
@@ -2015,25 +2822,61 @@ function HelpDialogHost({ app, orgCode }) {
         setSending(true);
         setError(null);
         try {
-            const res = await sendHelpMessage({ app: appId, kind, message: trimmed, context });
+            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(err instanceof Error ? err.message : "ส่งไม่สำเร็จ");
+            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;
-    return (jsx(Dialog, { open: open, onOpenChange: o => (o ? openHelp() : closeHelp()), children: jsxs(DialogContent, { className: "max-h-[calc(100dvh-2rem)] overflow-y-auto sm:max-w-lg", children: [view === "form" ? (jsxs("form", { onSubmit: send, className: "grid gap-4", children: [jsx(DialogHeader, { children: jsx(DialogTitle, { children: "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D" }) }), jsxs("div", { className: "grid gap-2", children: [jsx(Label, { id: "erp-help-kind", children: "\u0E1B\u0E23\u0E30\u0E40\u0E20\u0E17" }), jsx("div", { role: "radiogroup", "aria-labelledby": "erp-help-kind", className: "flex gap-1 rounded-lg bg-muted p-1", children: KINDS.map(k => (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 " +
+    const dropRing = (over) => (over ? " rounded-lg ring-2 ring-primary ring-offset-4 ring-offset-background" : "");
+    return (jsx(Dialog, { open: open, onOpenChange: o => (o ? openHelp() : closeHelp()), children: jsxs(DialogContent, { className: "max-h-[calc(100dvh-2rem)] overflow-y-auto sm:max-w-lg", children: [view === "form" ? (jsxs("form", { onSubmit: send, className: "grid gap-4" + dropRing(formDrop.over), ...formDrop.props, children: [jsx(DialogHeader, { children: jsx(DialogTitle, { children: "\u0E0A\u0E48\u0E27\u0E22\u0E40\u0E2B\u0E25\u0E37\u0E2D" }) }), jsxs("div", { className: "grid gap-2", children: [jsx(Label, { id: "erp-help-kind", children: "\u0E1B\u0E23\u0E30\u0E40\u0E20\u0E17" }), jsx("div", { role: "radiogroup", "aria-labelledby": "erp-help-kind", className: "flex gap-1 rounded-lg bg-muted p-1", children: KINDS.map(k => (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))) })] }), jsxs("div", { className: "grid gap-2", children: [jsx(Label, { htmlFor: "erp-help-message", children: "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21" }), jsx(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" })] }), context ? (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 ? (jsx("p", { role: "alert", className: "text-sm text-destructive", children: error })) : null, jsxs(DialogFooter, { className: "flex-row items-center gap-2 sm:justify-between", children: [jsx("button", { type: "button", onClick: loadMine, className: "mr-auto text-sm text-primary hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded", children: "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21\u0E17\u0E35\u0E48\u0E2A\u0E48\u0E07\u0E41\u0E25\u0E49\u0E27" }), jsxs("div", { className: "flex gap-2", children: [jsx(Button, { type: "button", variant: "outline", onClick: closeHelp, children: "\u0E22\u0E01\u0E40\u0E25\u0E34\u0E01" }), jsxs(Button, { type: "submit", disabled: !canSend, children: [sending ? jsx(Loader2, { className: "mr-1 h-4 w-4 animate-spin" }) : null, "\u0E2A\u0E48\u0E07"] })] })] })] })) : null, view === "sent" && sent ? (jsxs("div", { className: "grid gap-4", children: [jsxs("div", { className: "flex flex-col items-center gap-2 py-4 text-center", children: [jsx(CircleCheck, { className: "h-12 w-12 text-primary", strokeWidth: 1.6 }), jsx(DialogTitle, { className: "text-lg font-semibold", children: "\u0E2A\u0E48\u0E07\u0E41\u0E25\u0E49\u0E27" }), jsxs("p", { className: "text-sm text-muted-foreground", children: ["\u0E40\u0E25\u0E02\u0E17\u0E35\u0E48\u0E2D\u0E49\u0E32\u0E07\u0E2D\u0E34\u0E07", " ", jsx("span", { className: "font-mono text-base font-semibold text-foreground", children: sent.ref })] })] }), jsxs(DialogFooter, { className: "flex-row items-center gap-2 sm:justify-between", children: [jsx("button", { type: "button", onClick: loadMine, className: "mr-auto text-sm text-primary hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded", children: "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21\u0E17\u0E35\u0E48\u0E2A\u0E48\u0E07\u0E41\u0E25\u0E49\u0E27" }), jsx(Button, { type: "button", onClick: closeHelp, children: "\u0E1B\u0E34\u0E14" })] })] })) : null, view === "mine" ? (jsxs("div", { className: "grid gap-4", children: [jsx(DialogHeader, { children: jsxs(DialogTitle, { className: "flex items-center gap-2", children: [jsx("button", { type: "button", "aria-label": "\u0E01\u0E25\u0E31\u0E1A", onClick: () => setView("form"), className: "-ml-1 grid size-8 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: jsx(ArrowLeft, { className: "h-4 w-4" }) }), "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21\u0E17\u0E35\u0E48\u0E2A\u0E48\u0E07\u0E41\u0E25\u0E49\u0E27"] }) }), mine === null && !mineError ? (jsxs("div", { className: "flex items-center gap-2 py-6 text-sm text-muted-foreground", children: [jsx(Loader2, { className: "h-4 w-4 animate-spin" }), "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E42\u0E2B\u0E25\u0E14"] })) : null, mineError ? (jsx("p", { role: "alert", className: "text-sm text-destructive", children: mineError })) : null, mine && mine.length === 0 ? (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 ? (jsx("ul", { className: "grid gap-3", children: mine.map(m => (jsxs("li", { className: "rounded-lg border border-border p-3", children: [jsxs("div", { className: "flex flex-wrap items-center gap-x-2 gap-y-1 text-xs text-muted-foreground", children: [jsx("span", { className: "font-mono font-semibold text-foreground", children: m.ref }), jsx("span", { children: KIND_LABEL[m.kind] ?? m.kind }), jsx("span", { children: when(m.created_at) }), 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 })] }), jsx("p", { className: "mt-2 line-clamp-4 whitespace-pre-wrap break-words text-sm", children: m.message }), m.replies.map((r, i) => (jsxs("div", { className: "mt-2 rounded-md bg-muted px-3 py-2", children: [jsxs("p", { className: "text-xs text-muted-foreground", children: ["\u0E17\u0E35\u0E21 AntNiti \u00B7 ", when(r.created_at)] }), jsx("p", { className: "mt-1 whitespace-pre-wrap break-words text-sm", children: r.body })] }, i)))] }, m.id))) })) : null] })) : null] }) }));
+                                                : "text-muted-foreground hover:text-foreground"), children: k.label }, k.value))) })] }), jsxs("div", { className: "grid gap-2", children: [jsx(Label, { htmlFor: "erp-help-message", children: "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21" }), jsx(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" })] }), jsx(HelpAttachField, { state: images, disabled: sending, id: "erp-help-images" }), context ? (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 ? (jsx("p", { role: "alert", className: "text-sm text-destructive", children: error })) : null, jsxs(DialogFooter, { className: "flex-row items-center gap-2 sm:justify-between", children: [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" }), jsxs("div", { className: "flex gap-2", children: [jsx(Button, { type: "button", variant: "outline", onClick: closeHelp, children: "\u0E22\u0E01\u0E40\u0E25\u0E34\u0E01" }), jsxs(Button, { type: "submit", disabled: !canSend, children: [sending ? jsx(Loader2, { className: "mr-1 h-4 w-4 animate-spin" }) : null, "\u0E2A\u0E48\u0E07"] })] })] })] })) : null, view === "sent" && sent ? (jsxs("div", { className: "grid gap-4", children: [jsxs("div", { className: "flex flex-col items-center gap-2 py-4 text-center", children: [jsx(CircleCheck, { className: "h-12 w-12 text-primary", strokeWidth: 1.6 }), jsx(DialogTitle, { className: "text-lg font-semibold", children: "\u0E2A\u0E48\u0E07\u0E41\u0E25\u0E49\u0E27" }), jsxs("p", { className: "text-sm text-muted-foreground", children: ["\u0E40\u0E25\u0E02\u0E17\u0E35\u0E48\u0E2D\u0E49\u0E32\u0E07\u0E2D\u0E34\u0E07", " ", jsx("span", { className: "font-mono text-base font-semibold text-foreground", children: sent.ref })] })] }), jsxs(DialogFooter, { className: "flex-row items-center gap-2 sm:justify-between", children: [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" }), jsx(Button, { type: "button", onClick: closeHelp, children: "\u0E1B\u0E34\u0E14" })] })] })) : null, view === "mine" ? (jsxs("div", { className: "grid gap-4", children: [jsx(DialogHeader, { children: jsxs(DialogTitle, { className: "flex items-center gap-2", children: [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 ? jsx(Loading, {}) : null, mineError ? (jsx("p", { role: "alert", className: "text-sm text-destructive", children: mineError })) : null, mine && mine.length === 0 ? (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 ? (jsx("ul", { className: "grid gap-3", children: mine.map(m => {
+                                const entries = helpThread(m);
+                                const last = entries[entries.length - 1];
+                                return (jsxs("li", { className: "rounded-lg border border-border", children: [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: [jsxs("span", { className: "flex flex-wrap items-center gap-x-2 gap-y-1 text-xs text-muted-foreground", children: [jsx("span", { className: "font-mono font-semibold text-foreground", children: m.ref }), jsx("span", { children: KIND_LABEL[m.kind] ?? m.kind }), jsx("span", { children: when(m.created_at) }), 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 }), jsx(ChevronRight, { className: "h-4 w-4", "aria-hidden": "true" })] }), jsx("span", { className: "mt-2 line-clamp-3 block whitespace-pre-wrap break-words text-sm", children: m.message }), last ? (jsxs("span", { className: "mt-2 line-clamp-2 block rounded-md bg-muted px-3 py-2 text-xs", children: [jsxs("span", { className: "text-muted-foreground", children: [last.author === "staff" ? "ทีม AntNiti" : "คุณ", " \u00B7 ", when(last.created_at)] }), jsx("span", { className: "mt-0.5 block whitespace-pre-wrap break-words text-sm", children: last.body })] })) : null] }), m.images && m.images.length > 0 ? (jsx("div", { className: "px-3 pb-3", children: jsx(HelpImageStrip, { images: m.images, size: "sm" }) })) : null] }, m.id));
+                            }) })) : null] })) : null, view === "thread" ? (jsxs("div", { className: "grid gap-4", children: [jsx(DialogHeader, { children: jsxs(DialogTitle, { className: "flex items-center gap-2", children: [jsx(BackButton, { onClick: loadMine }), jsx("span", { className: "font-mono", children: thread?.ref ?? threadKey }), thread ? (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 ? jsx(Loading, {}) : null, threadError ? (jsx("p", { role: "alert", className: "text-sm text-destructive", children: threadError })) : null, thread ? (jsxs(Fragment$1, { children: [jsxs("ol", { className: "grid gap-3", "aria-label": "\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21", children: [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 => (jsx(ThreadBubble, { mine: e.author === "customer", label: e.author === "staff" ? "ทีม AntNiti" : "คุณ", at: e.created_at, body: e.body, images: e.images }, e.id)))] }), jsxs("form", { onSubmit: sendFollowUp, className: "grid gap-3 border-t border-border pt-4" + dropRing(followDrop.over), ...followDrop.props, children: [jsxs("div", { className: "grid gap-2", children: [jsx(Label, { htmlFor: "erp-help-followup", children: "\u0E15\u0E2D\u0E1A\u0E01\u0E25\u0E31\u0E1A" }), jsx(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" })] }), jsx(HelpAttachField, { state: followImages, disabled: following, id: "erp-help-followup-images" }), followError ? (jsx("p", { role: "alert", className: "text-sm text-destructive", children: followError })) : null, jsx(DialogFooter, { className: "flex-row items-center justify-end gap-2", children: jsxs(Button, { type: "submit", disabled: !followTrimmed || following, children: [following ? jsx(Loader2, { className: "mr-1 h-4 w-4 animate-spin" }) : null, "\u0E2A\u0E48\u0E07"] }) })] })] })) : null] })) : null] }) }));
+}
+function BackButton({ onClick }) {
+    return (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: jsx(ArrowLeft, { className: "h-4 w-4" }) }));
+}
+function Loading() {
+    return (jsxs("div", { className: "flex items-center gap-2 py-6 text-sm text-muted-foreground", children: [jsx(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 (jsx("li", { className: "flex " + (mine ? "justify-end pl-6" : "justify-start pr-6"), children: 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: [jsxs("p", { className: "text-xs text-muted-foreground", children: [label, " \u00B7 ", when(at)] }), jsx("p", { className: "mt-1 whitespace-pre-wrap break-words text-sm", children: body }), jsx(HelpImageStrip, { images: images })] }) }));
 }
 
 /**
@@ -2756,5 +3599,5 @@ const getAxiosErrorMessage = (error) => {
     return String(error);
 };
 
-export { AccessDenied, ApiError, AppBreadcrumb, AppLayoutShell, AppSidebar, EMPLOYEE_RECORD_OK_EVENT, EMPLOYEE_RECORD_REQUIRED, EMPLOYEE_RECORD_REQUIRED_EVENT, EmployeeRequiredGate, FeatureFlagsProvider, HeaderBackground, HelpButton, HelpDialogHost, NavMain, NavTools, NavUser, OrganizationSwitcher, PLAN_FEATURES, PermissionGateShell, PermissionProvider, PermissionRulesProvider, ReactQueryProvider, SHELL_VERSION, SessionBackedProfileCacheSeeder, SessionRefreshTrigger, SidebarContent, SidebarFooter, SidebarHeader, SidebarHelpCard, SidebarHelpLink, SidebarProvider, SidebarTrigger, TapMenu, ThemeProvider, WORKSPACE_HEADER_VARS, WORKSPACE_LIGHT_HEADER_VARS, WorkspaceBrand, instance as axiosInstance, buildSystemLinks, buildUrlWithCode, canAccessNavPermissionRoute, clearAccessTokenCache, clearOrganizationId, closeHelp, decodeJWT, describeAttached, describeBrowser, detectHelpApp, filterNavigationModulesByPermission, filterNavigationToolsByPermission, getAccessToken, getActiveModule, getActiveSubModule, getAxiosErrorMessage, getOrganizationId, getQueryClientConfig, getRequiredChildGroups, hasPlanFeature, isLikelyTransientNetworkError, isPathActive, normalizePathnameForPermissionRules, openHelp, resolveUiRoutePermission, runGlobalRequestPrecheck, runWithTransientRetry, setOrganizationId, toApiError, unwrapApiResponse, updateOrganizationId, useClearOrgOnUserChange, useFeatureFlag, useFeatureFlags, useInvalidateQueriesOnOrgChange, useKeycloakRoles, useOrganizationIdState, usePermissionRules, useSessionRefresh, useSidebar, useSidebarToggle };
+export { AccessDenied, ApiError, AppBreadcrumb, AppLayoutShell, AppSidebar, EMPLOYEE_RECORD_OK_EVENT, EMPLOYEE_RECORD_REQUIRED, EMPLOYEE_RECORD_REQUIRED_EVENT, EmployeeRequiredGate, FeatureFlagsProvider, HeaderBackground, HelpButton, HelpDialogHost, NavMain, NavTools, NavUser, OWNER_CHIP, OrganizationSwitcher, PLAN_FEATURES, PermissionGateShell, PermissionProvider, PermissionRulesProvider, ReactQueryProvider, SHELL_VERSION, SessionBackedProfileCacheSeeder, SessionRefreshTrigger, SidebarContent, SidebarFooter, SidebarHeader, SidebarHelpCard, SidebarHelpLink, SidebarProvider, SidebarTrigger, TapMenu, ThemeProvider, WORKSPACE_HEADER_VARS, WORKSPACE_LIGHT_HEADER_VARS, WorkspaceBrand, instance as axiosInstance, buildSystemLinks, buildUrlWithCode, canAccessNavPermissionRoute, clearAccessTokenCache, clearOrganizationId, closeHelp, decodeJWT, describeAttached, describeBrowser, detectHelpApp, filterNavigationModulesByPermission, filterNavigationToolsByPermission, getAccessToken, getActiveModule, getActiveSubModule, getAxiosErrorMessage, getOrganizationId, getQueryClientConfig, getRequiredChildGroups, hasPlanFeature, isLikelyTransientNetworkError, isPathActive, myRolesQueryKey, normalizePathnameForPermissionRules, openHelp, parseMyRoles, resolveUiRoutePermission, roleSummary, runGlobalRequestPrecheck, runWithTransientRetry, setOrganizationId, toApiError, unwrapApiResponse, updateOrganizationId, useClearOrgOnUserChange, useFeatureFlag, useFeatureFlags, useInvalidateQueriesOnOrgChange, useKeycloakRoles, useMyRoles, useOrganizationIdState, usePermissionRules, useSessionRefresh, useSidebar, useSidebarToggle };
 //# sourceMappingURL=index.esm.js.map