@object-ui/app-shell 4.0.11 → 4.2.1

package/CHANGELOG.md

@@ -1,5 +1,91 @@
 # @object-ui/app-shell — Changelog
 
+## 4.2.1
+
+### Patch Changes
+
+- 47c27c7: fix
+  - @object-ui/types@4.2.1
+  - @object-ui/core@4.2.1
+  - @object-ui/i18n@4.2.1
+  - @object-ui/react@4.2.1
+  - @object-ui/components@4.2.1
+  - @object-ui/fields@4.2.1
+  - @object-ui/layout@4.2.1
+  - @object-ui/data-objectstack@4.2.1
+  - @object-ui/auth@4.2.1
+  - @object-ui/permissions@4.2.1
+  - @object-ui/collaboration@4.2.1
+
+## 4.2.0
+
+### Patch Changes
+
+- 786de60: ReportView no longer caps the report content at `max-w-5xl` (1024px). Reports now use the full available content width, matching DashboardView behavior. Matrix and grid reports in particular benefit from the additional horizontal real estate.
+- Updated dependencies [eb738bd]
+- Updated dependencies [650392e]
+- Updated dependencies [84b4bf1]
+  - @object-ui/i18n@4.2.0
+  - @object-ui/components@4.2.0
+  - @object-ui/fields@4.2.0
+  - @object-ui/react@4.2.0
+  - @object-ui/layout@4.2.0
+  - @object-ui/types@4.2.0
+  - @object-ui/core@4.2.0
+  - @object-ui/data-objectstack@4.2.0
+  - @object-ui/auth@4.2.0
+  - @object-ui/permissions@4.2.0
+  - @object-ui/collaboration@4.2.0
+
+## 4.1.0
+
+### Patch Changes
+
+- b4ce9e2: Fix summary reports: render chart + KPIs, correct empty-table on server-aggregated data.
+  - `plugin-report`: `SpecReportGrid` now renders a KPI strip (per aggregating column) and a chart section above the grid for `summary` reports. KPI section auto-hides when no aggregating columns. New `buildChartData()` adapter buckets aggregated `ReportRow[]` to chart-ready data, auto-sorts pie/funnel descending, and falls back to row count when the chart `yAxis` points at a non-numeric column. When the data is server-aggregated, the grid switches columns to `[groupings, ${field}__${agg}]` so cells aren't empty against a raw-row column schema.
+  - `plugin-charts`: register `'column'` as an alias of `'bar'` in `ChartRenderer` / `AdvancedChartImpl` (Recharts only has `BarChart`).
+  - `app-shell`: `ReportView` now routes any object-backed report (matrix/joined/summary/tabular/columns/groupingsAcross) through the spec `ReportRenderer`; fully-legacy `fields`+`data` schemas still use `ReportViewer`.
+  - @object-ui/types@4.1.0
+  - @object-ui/core@4.1.0
+  - @object-ui/i18n@4.1.0
+  - @object-ui/react@4.1.0
+  - @object-ui/components@4.1.0
+  - @object-ui/fields@4.1.0
+  - @object-ui/layout@4.1.0
+  - @object-ui/data-objectstack@4.1.0
+  - @object-ui/auth@4.1.0
+  - @object-ui/permissions@4.1.0
+  - @object-ui/collaboration@4.1.0
+
+## 4.0.12
+
+### Patch Changes
+
+- e468592: fix
+  - @object-ui/types@4.0.12
+  - @object-ui/core@4.0.12
+  - @object-ui/i18n@4.0.12
+  - @object-ui/react@4.0.12
+  - @object-ui/components@4.0.12
+  - @object-ui/fields@4.0.12
+  - @object-ui/layout@4.0.12
+  - @object-ui/data-objectstack@4.0.12
+  - @object-ui/auth@4.0.12
+  - @object-ui/permissions@4.0.12
+  - @object-ui/plugin-calendar@4.0.12
+  - @object-ui/plugin-charts@4.0.12
+  - @object-ui/plugin-chatbot@4.0.12
+  - @object-ui/plugin-dashboard@4.0.12
+  - @object-ui/plugin-designer@4.0.12
+  - @object-ui/plugin-detail@4.0.12
+  - @object-ui/plugin-form@4.0.12
+  - @object-ui/plugin-grid@4.0.12
+  - @object-ui/plugin-kanban@4.0.12
+  - @object-ui/plugin-list@4.0.12
+  - @object-ui/plugin-report@4.0.12
+  - @object-ui/plugin-view@4.0.12
+  - @object-ui/collaboration@4.0.12
+
 ## 4.0.11
 
 ### Patch Changes

package/dist/components/ManagedByBanner.d.ts

@@ -0,0 +1,16 @@
+export interface ManagedByBannerProps {
+    /** The `managedBy` flag from the object schema. */
+    managedBy?: string;
+    /** Optional override for the human-readable system name. */
+    label?: string;
+    /** Optional documentation link rendered as "Learn more →". */
+    docHref?: string;
+    /**
+     * Optional human-readable name for the source record / parent workflow
+     * referenced in `system`-bucket banners (e.g. "Opportunity"). When
+     * provided the banner reads "Use the Opportunity record's Submit for
+     * Approval action…" instead of the generic phrasing.
+     */
+    sourceRecordLabel?: string;
+}
+export declare function ManagedByBanner({ managedBy, label, docHref, sourceRecordLabel }: ManagedByBannerProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/ManagedByBanner.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { ShieldAlert, Info, Lock, Archive } from 'lucide-react';
+const VARIANTS = {
+    config: {
+        icon: Info,
+        tone: 'border-sky-300/60 bg-sky-50 text-sky-900 dark:border-sky-500/40 dark:bg-sky-950/40 dark:text-sky-100',
+        title: 'Administrator configuration',
+        body: () => "These rows define how the platform behaves at runtime — they're authored here, but the runtime data they produce lives in a separate table. Changes take effect once a row is marked Active.",
+    },
+    system: {
+        icon: Lock,
+        tone: 'border-slate-300/60 bg-slate-50 text-slate-900 dark:border-slate-500/40 dark:bg-slate-950/40 dark:text-slate-100',
+        title: 'Managed by the platform',
+        body: (_display, src) => `Rows here are created and updated automatically by the platform engine. To start a new one, use the action button on the ${src ?? 'source record'} (e.g. "Submit for Approval", "Share", "Invite"). The list below is the audit / monitoring surface — actions like Approve, Recall, or Resend live on the row.`,
+    },
+    'append-only': {
+        icon: Archive,
+        tone: 'border-zinc-300/60 bg-zinc-50 text-zinc-900 dark:border-zinc-500/40 dark:bg-zinc-950/40 dark:text-zinc-100',
+        title: 'Read-only historical record',
+        body: () => "This is an immutable audit log. Rows cannot be created, edited, or deleted from the UI — they're written by the platform when events occur. Use Export to download for compliance review.",
+    },
+    'better-auth': {
+        icon: ShieldAlert,
+        tone: 'border-amber-300/60 bg-amber-50 text-amber-900 dark:border-amber-500/40 dark:bg-amber-950/40 dark:text-amber-100',
+        title: 'Managed by better-auth',
+        body: (display) => `This object's schema is owned by ${display}. Direct edits here bypass password hashing, session validation, two-factor checks, and audit hooks — and may corrupt account state. Use the dedicated identity workflows instead (Invite User, Reset Password, Revoke Session, Rotate Key, …).`,
+    },
+};
+export function ManagedByBanner({ managedBy, label, docHref, sourceRecordLabel }) {
+    if (!managedBy || managedBy === 'platform')
+        return null;
+    const variant = VARIANTS[managedBy];
+    if (!variant)
+        return null;
+    const display = label ?? managedBy;
+    const Icon = variant.icon;
+    return (_jsxs("div", { role: "note", "data-testid": "managed-by-banner", "data-bucket": managedBy, className: `flex items-start gap-3 border-b px-4 py-2.5 text-sm ${variant.tone}`, children: [_jsx(Icon, { className: "mt-0.5 h-4 w-4 flex-none" }), _jsxs("div", { className: "flex-1", children: [_jsxs("strong", { className: "font-semibold", children: [variant.title, "."] }), ' ', variant.body(display, sourceRecordLabel), docHref && (_jsxs(_Fragment, { children: [' ', _jsx("a", { href: docHref, target: "_blank", rel: "noreferrer", className: "underline underline-offset-2 hover:opacity-80", children: "Learn more \u2192" })] }))] })] }));
+}

package/dist/console/home/HomeLayout.js

@@ -26,5 +26,5 @@ export function HomeLayout({ children }) {
     useEffect(() => {
         setContext('home');
     }, [setContext]);
-    return (_jsxs("div", { className: "flex min-h-svh w-full flex-col bg-background", "data-testid": "home-layout", children: [_jsx("header", { className: "sticky top-0 z-30 flex h-14 w-full shrink-0 items-center gap-2 border-b bg-background px-2 sm:px-4", children: _jsx(AppHeader, { variant: "home" }) }), _jsx("main", { className: "flex-1 min-w-0 overflow-auto", children: children }), showChatbot && (_jsx(Suspense, { fallback: null, children: _jsx(ConsoleFloatingChatbot, { appLabel: "Workspace", objects: [] }) }))] }));
+    return (_jsxs("div", { className: "flex min-h-svh w-full flex-col bg-background", "data-testid": "home-layout", children: [_jsx("header", { className: "sticky top-0 z-30 flex h-14 w-full shrink-0 items-center gap-2 border-b bg-background px-2 sm:px-4", children: _jsx(AppHeader, { variant: "home" }) }), _jsx("main", { className: "flex-1 min-w-0 overflow-auto pb-20 sm:pb-0", children: children }), showChatbot && (_jsx(Suspense, { fallback: null, children: _jsx(ConsoleFloatingChatbot, { appLabel: "Workspace", objects: [] }) }))] }));
 }

package/dist/console/home/HomePage.js

@@ -48,7 +48,9 @@ export function HomePage() {
     }
     // Empty state - no apps configured
     if (activeApps.length === 0) {
-        return (_jsx("div", { className: "flex flex-1 items-center justify-center p-6", children: _jsxs(Empty, { children: [_jsx(EmptyTitle, { children: "Welcome to ObjectUI" }), _jsx(EmptyDescription, { children: "Get started by creating your first application or configure your system settings." }), _jsxs("div", { className: "mt-6 flex flex-col sm:flex-row items-center gap-3", children: [_jsxs(Button, { onClick: () => navigate('/create-app'), "data-testid": "create-first-app-btn", children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), "Create Your First App"] }), _jsxs(Button, { variant: "outline", onClick: () => navigate('/apps/setup'), "data-testid": "go-to-settings-btn", children: [_jsx(Settings, { className: "mr-2 h-4 w-4" }), "System Settings"] })] })] }) }));
+        return (_jsx("div", { className: "flex flex-1 items-center justify-center p-6", children: _jsxs(Empty, { children: [_jsx(EmptyTitle, { children: t('home.welcome', { defaultValue: 'Welcome to ObjectUI' }) }), _jsx(EmptyDescription, { children: t('home.welcomeDescription', {
+                            defaultValue: 'Get started by creating your first application or configure your system settings.',
+                        }) }), _jsxs("div", { className: "mt-6 flex flex-col sm:flex-row items-center gap-3", children: [_jsxs(Button, { onClick: () => navigate('/create-app'), "data-testid": "create-first-app-btn", children: [_jsx(Plus, { className: "mr-2 h-4 w-4" }), t('home.createFirstApp', { defaultValue: 'Create Your First App' })] }), _jsxs(Button, { variant: "outline", onClick: () => navigate('/apps/setup'), "data-testid": "go-to-settings-btn", children: [_jsx(Settings, { className: "mr-2 h-4 w-4" }), t('home.systemSettings', { defaultValue: 'System Settings' })] })] })] }) }));
     }
     return (_jsxs("div", { className: "bg-background", children: [_jsxs("div", { className: "px-4 sm:px-6 pt-6 pb-4", children: [_jsx("h1", { className: "text-2xl sm:text-3xl font-bold tracking-tight", children: t('home.title', { defaultValue: 'Home' }) }), _jsx("p", { className: "text-sm text-muted-foreground mt-1", children: t('home.subtitle', { defaultValue: 'Your workspace dashboard' }) })] }), _jsxs("div", { className: "px-4 sm:px-6 py-4 space-y-8", children: [_jsx(QuickActions, {}), starredApps.length > 0 && (_jsx(StarredApps, { items: starredApps })), recentApps.length > 0 && (_jsx(RecentApps, { items: recentApps })), _jsxs("section", { children: [_jsx("h2", { className: "text-2xl font-semibold tracking-tight mb-4", children: t('home.allApps', { defaultValue: 'All Applications' }) }), _jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4", children: activeApps.map((app) => (_jsx(AppCard, { app: app, onClick: () => navigate(`/apps/${app.name}`), isFavorite: favorites.some(f => f.id === `app:${app.name}`) }, app.name))) })] })] })] }));
 }

package/dist/layout/AppHeader.js

@@ -19,7 +19,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
  */
 import { useLocation, useParams, Link, useNavigate } from 'react-router-dom';
 import { SidebarTrigger, Button, DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuGroup, Avatar, AvatarImage, AvatarFallback, } from '@object-ui/components';
-import { Search, HelpCircle, ChevronDown, Settings, LogOut, User as UserIcon, Boxes, } from 'lucide-react';
+import { Search, HelpCircle, ChevronDown, Settings, LogOut, User as UserIcon, Boxes, Bell, CheckSquare, } from 'lucide-react';
 import { useState, useEffect, useCallback, useRef } from 'react';
 import { useOffline } from '@object-ui/react';
 import { PresenceAvatars } from '@object-ui/collaboration';
@@ -58,11 +58,17 @@ export function AppHeader({ variant, appName, objects, connectionState, presence
     const { currentAppName, recordTitle } = useNavigationContext();
     const [apiPresenceUsers, setApiPresenceUsers] = useState(null);
     const [apiActivities, setApiActivities] = useState(null);
+    /** M10.8: in-header notifications. Polled from sys_notification scoped to current user. */
+    const [notifications, setNotifications] = useState([]);
     // Once the server returns 404 for these collections we stop retrying for
     // the lifetime of the page — they're optional features and re-requesting
     // on every navigation creates console noise + wasted round trips.
     const presenceUnavailableRef = useRef(false);
     const activityUnavailableRef = useRef(false);
+    const notificationsUnavailableRef = useRef(false);
+    /** M11.C15: pending approvals count for the topbar shortcut. */
+    const [pendingApprovalsCount, setPendingApprovalsCount] = useState(0);
+    const approvalsUnavailableRef = useRef(false);
     const fetchPresenceAndActivities = useCallback(async () => {
         if (!dataSource || !isApp)
             return;
@@ -103,6 +109,172 @@ export function AppHeader({ variant, appName, objects, connectionState, presence
         catch { /* fallback below */ }
     }, [dataSource, isApp]);
     useEffect(() => { fetchPresenceAndActivities(); }, [fetchPresenceAndActivities]);
+    /**
+     * M10.8 + M11.B3: poll sys_notification for the signed-in user.
+     *
+     * - Limited to the 20 most-recent entries; unread count drives the bell badge.
+     * - Adaptive interval: 10s while the tab is foregrounded (was 30s) so the
+     *   bell reflects mentions / assignments within seconds without requiring a
+     *   server-push transport.
+     * - Immediate refetch on `visibilitychange` when the user returns to the
+     *   tab, so a backgrounded tab catches up the moment it regains focus.
+     * - On transient errors, switches to exponential backoff (cap 2 min) and
+     *   resets on the first successful fetch.
+     * - Tolerates 404 so deployments without sys_notification degrade silently.
+     *
+     * Full server-push (SSE / WebSocket) is tracked separately as a M12
+     * enhancement; this adaptive poll already reduces perceived latency from
+     * ~15s (average half of the old 30s window) to ~5s and is sufficient for
+     * pilots up to ~50 concurrent users.
+     */
+    useEffect(() => {
+        if (!dataSource || !isApp || !user?.id)
+            return;
+        if (notificationsUnavailableRef.current)
+            return;
+        let cancelled = false;
+        let timer = null;
+        const ACTIVE_INTERVAL_MS = 10000;
+        const HIDDEN_INTERVAL_MS = 60000;
+        const MAX_BACKOFF_MS = 120000;
+        let backoffMs = ACTIVE_INTERVAL_MS;
+        const isMissingResource = (err) => err?.httpStatus === 404 || err?.status === 404 || err?.code === 'object_not_found';
+        const fetchOnce = async () => {
+            try {
+                const res = await dataSource.find('sys_notification', {
+                    $filter: { recipient_id: user.id },
+                    $orderby: { created_at: 'desc' },
+                    $top: 20,
+                });
+                if (cancelled)
+                    return;
+                if (Array.isArray(res?.data))
+                    setNotifications(res.data);
+                backoffMs = ACTIVE_INTERVAL_MS;
+            }
+            catch (err) {
+                if (isMissingResource(err)) {
+                    notificationsUnavailableRef.current = true;
+                    return;
+                }
+                backoffMs = Math.min(backoffMs * 2, MAX_BACKOFF_MS);
+            }
+        };
+        const scheduleNext = () => {
+            if (cancelled || notificationsUnavailableRef.current)
+                return;
+            const hidden = typeof document !== 'undefined' && document.hidden;
+            const delay = hidden ? HIDDEN_INTERVAL_MS : backoffMs;
+            timer = setTimeout(async () => {
+                await fetchOnce();
+                scheduleNext();
+            }, delay);
+        };
+        const onVisibilityChange = () => {
+            if (cancelled)
+                return;
+            if (typeof document === 'undefined' || document.hidden)
+                return;
+            if (timer) {
+                clearTimeout(timer);
+                timer = null;
+            }
+            backoffMs = ACTIVE_INTERVAL_MS;
+            fetchOnce().finally(scheduleNext);
+        };
+        fetchOnce().finally(scheduleNext);
+        if (typeof document !== 'undefined') {
+            document.addEventListener('visibilitychange', onVisibilityChange);
+        }
+        return () => {
+            cancelled = true;
+            if (timer)
+                clearTimeout(timer);
+            if (typeof document !== 'undefined') {
+                document.removeEventListener('visibilitychange', onVisibilityChange);
+            }
+        };
+    }, [dataSource, isApp, user?.id]);
+    /**
+     * M11.C15: poll pending-approvals count for the topbar shortcut badge.
+     * Hits the framework's `/api/v1/approvals/requests?status=pending`
+     * endpoint with the user's identities (id, email, role:<r>). Degrades
+     * silently to zero on 404 (approvals plugin not installed).
+     */
+    useEffect(() => {
+        if (!isApp || !user?.id)
+            return;
+        if (approvalsUnavailableRef.current)
+            return;
+        const serverUrl = (import.meta.env?.VITE_SERVER_URL || '').replace(/\/$/, '');
+        const base = `${serverUrl}/api/v1/approvals/requests`;
+        const identities = [];
+        if (user.id)
+            identities.push(user.id);
+        if (user.email)
+            identities.push(user.email);
+        for (const r of (user.roles || [])) {
+            if (r)
+                identities.push(`role:${r}`);
+        }
+        let cancelled = false;
+        let timer = null;
+        const POLL_MS = 30000;
+        const fetchOnce = async () => {
+            try {
+                const seen = new Set();
+                if (identities.length === 0)
+                    return;
+                for (const id of identities) {
+                    const qs = new URLSearchParams({ status: 'pending', approverId: id });
+                    const res = await fetch(`${base}?${qs}`, { credentials: 'include' });
+                    if (res.status === 404) {
+                        approvalsUnavailableRef.current = true;
+                        return;
+                    }
+                    if (!res.ok)
+                        return;
+                    const payload = await res.json().catch(() => null);
+                    for (const row of (payload?.data || []))
+                        seen.add(row.id);
+                }
+                if (!cancelled)
+                    setPendingApprovalsCount(seen.size);
+            }
+            catch { /* transient — keep last value */ }
+        };
+        const schedule = () => {
+            if (cancelled || approvalsUnavailableRef.current)
+                return;
+            timer = setTimeout(async () => { await fetchOnce(); schedule(); }, POLL_MS);
+        };
+        fetchOnce().finally(schedule);
+        return () => { cancelled = true; if (timer)
+            clearTimeout(timer); };
+    }, [isApp, user?.id]);
+    const unreadCount = notifications.reduce((n, x) => n + (x.is_read ? 0 : 1), 0);
+    const markNotificationRead = useCallback(async (id) => {
+        setNotifications(prev => prev.map(n => n.id === id ? { ...n, is_read: true } : n));
+        if (!dataSource)
+            return;
+        try {
+            await dataSource.update('sys_notification', id, {
+                is_read: true,
+                read_at: new Date().toISOString(),
+            });
+        }
+        catch { /* best-effort */ }
+    }, [dataSource]);
+    const markAllRead = useCallback(async () => {
+        const unread = notifications.filter(n => !n.is_read);
+        if (!unread.length)
+            return;
+        setNotifications(prev => prev.map(n => ({ ...n, is_read: true })));
+        if (!dataSource)
+            return;
+        const now = new Date().toISOString();
+        await Promise.all(unread.map(n => dataSource.update('sys_notification', n.id, { is_read: true, read_at: now }).catch(() => { })));
+    }, [dataSource, notifications]);
     const activeUsers = presenceUsers ?? apiPresenceUsers ?? EMPTY_PRESENCE_USERS;
     const activeActivities = activities ?? apiActivities ?? [];
     const orgList = organizations ?? [];
@@ -203,5 +375,18 @@ export function AppHeader({ variant, appName, objects, connectionState, presence
     return (_jsxs("div", { className: "flex items-center justify-between w-full h-full", children: [_jsxs("div", { className: "flex items-center min-w-0 flex-1", children: [_jsx(Link, { to: "/home", className: "flex items-center justify-center h-7 w-7 shrink-0 rounded-md bg-primary text-primary-foreground hover:bg-primary/90 transition-colors", title: "ObjectStack", children: _jsx(Boxes, { className: "h-4 w-4" }) }), resolvedVariant === 'home' && (_jsx("span", { className: "hidden sm:inline ml-2 text-sm font-semibold tracking-tight", children: "ObjectStack" })), resolvedVariant === 'orgs' && (_jsxs(_Fragment, { children: [_jsx(PathSep, {}), _jsx("span", { className: "text-sm font-medium text-foreground/80 px-1.5", children: t('organizations.title', { defaultValue: 'Organizations' }) })] })), isApp && (_jsxs(_Fragment, { children: [_jsx(SidebarTrigger, { className: "md:hidden shrink-0 ml-1", "aria-label": t('common.toggleSidebar') || 'Toggle sidebar' }), activeAppName && onAppChange ? (_jsxs(_Fragment, { children: [_jsx(PathSep, {}), _jsx(AppSwitcher, { activeAppName: activeAppName, onAppChange: onAppChange })] })) : appName ? (_jsxs(_Fragment, { children: [_jsx(PathSep, {}), _jsx("span", { className: "text-sm font-medium text-foreground/80 px-1.5", children: appName })] })) : null, extraSegments.map((seg, i) => {
                                 const isLast = i === extraSegments.length - 1;
                                 return (_jsxs("span", { className: "hidden sm:flex items-center min-w-0", children: [_jsx(PathSep, {}), seg.siblings && seg.siblings.length > 1 ? (_jsxs(DropdownMenu, { children: [_jsxs(DropdownMenuTrigger, { className: `flex items-center gap-1 rounded-md px-1.5 py-1 text-sm font-medium transition-colors outline-none hover:bg-accent hover:text-foreground ${!isLast ? 'text-foreground/60' : 'text-foreground/80'}`, children: [seg.label, _jsx(ChevronDown, { className: "h-3.5 w-3.5 text-muted-foreground" })] }), _jsxs(DropdownMenuContent, { align: "start", sideOffset: 8, className: "w-56 max-h-72 overflow-y-auto", children: [_jsx(DropdownMenuLabel, { className: "text-xs text-muted-foreground font-normal", children: "Switch Object" }), _jsx(DropdownMenuSeparator, {}), seg.siblings.map((sibling) => (_jsx(DropdownMenuItem, { asChild: true, children: _jsx(Link, { to: sibling.href, className: "w-full", children: sibling.label }) }, sibling.href)))] })] })) : seg.href ? (_jsx(Link, { to: seg.href, className: `rounded-md px-1.5 py-1 text-sm font-medium transition-colors hover:bg-accent hover:text-foreground truncate max-w-[160px] ${isLast ? 'text-foreground/80' : 'text-foreground/60'}`, children: seg.label })) : (_jsx("span", { className: `px-1.5 py-1 text-sm font-medium truncate max-w-[160px] ${isLast ? 'text-foreground/80' : 'text-foreground/60'}`, children: seg.label }))] }, i));
-                            }), _jsx("span", { className: "text-sm font-medium sm:hidden truncate min-w-0 ml-1", children: lastSegmentLabel })] }))] }), _jsxs("div", { className: "flex items-center gap-0.5 sm:gap-1 shrink-0 [&>*+*[data-topbar-group]]:ml-1 [&>[data-topbar-group]+[data-topbar-group]]:border-l [&>[data-topbar-group]+[data-topbar-group]]:border-border/60 [&>[data-topbar-group]+[data-topbar-group]]:pl-1 sm:[&>[data-topbar-group]+[data-topbar-group]]:pl-2 sm:[&>[data-topbar-group]+[data-topbar-group]]:ml-2", children: [!isOnline && (_jsxs("div", { className: "flex items-center gap-1 px-2 py-1 rounded-full bg-yellow-100 dark:bg-yellow-900/30 text-yellow-800 dark:text-yellow-200 text-xs font-medium", children: [_jsx("span", { className: "h-2 w-2 rounded-full bg-yellow-500 animate-pulse" }), "Offline"] })), isApp && connectionState && _jsx(ConnectionStatus, { state: connectionState }), isApp && activeUsers.length > 0 && (_jsx("div", { className: "hidden md:flex items-center shrink-0", title: "Users currently online", children: _jsx(PresenceAvatars, { users: activeUsers, size: "sm", maxVisible: 3, showStatus: true }) })), _jsxs("div", { "data-topbar-group": true, className: "flex items-center gap-0.5 sm:gap-1 shrink-0", children: [_jsxs("button", { onClick: () => document.dispatchEvent(new KeyboardEvent('keydown', { key: 'k', metaKey: true })), className: "hidden lg:flex relative items-center gap-2 w-48 xl:w-64 h-8 px-3 text-sm rounded-md border bg-muted/50 text-muted-foreground hover:bg-muted transition-colors", children: [_jsx(Search, { className: "h-3.5 w-3.5 shrink-0" }), _jsx("span", { className: "flex-1 text-left text-xs", children: t('console.search', { defaultValue: 'Search...' }) }), _jsxs("kbd", { className: "pointer-events-none inline-flex h-5 items-center gap-0.5 rounded border bg-background px-1.5 text-[10px] font-medium text-muted-foreground", children: [_jsx("span", { className: "text-xs", children: "\u2318" }), "K"] })] }), _jsx(Button, { variant: "ghost", size: "icon", className: "lg:hidden h-8 w-8 shrink-0", onClick: () => document.dispatchEvent(new KeyboardEvent('keydown', { key: 'k', metaKey: true })), "aria-label": t('console.search', { defaultValue: 'Search...' }), children: _jsx(Search, { className: "h-4 w-4" }) })] }), _jsxs("div", { "data-topbar-group": true, className: "flex items-center gap-0.5 shrink-0", children: [_jsx("div", { className: "hidden sm:flex shrink-0", children: _jsx(ActivityFeed, { activities: activeActivities }) }), _jsx(Button, { variant: "ghost", size: "icon", className: "h-8 w-8 hidden md:flex shrink-0", asChild: true, "aria-label": t('sidebar.helpTooltip', { defaultValue: 'Help & Documentation' }), children: _jsx("a", { href: "https://docs.objectstack.ai", target: "_blank", rel: "noopener noreferrer", children: _jsx(HelpCircle, { className: "h-4 w-4" }) }) })] }), _jsxs("div", { "data-topbar-group": true, className: "flex items-center gap-0.5 shrink-0", children: [_jsx("div", { className: "hidden sm:flex shrink-0", children: _jsx(ModeToggle, {}) }), _jsx("div", { className: "hidden sm:flex shrink-0", children: _jsx(LocaleSwitcher, {}) }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "icon", className: "h-8 w-8 shrink-0 rounded-full", children: _jsxs(Avatar, { className: "h-7 w-7 rounded-full", children: [_jsx(AvatarImage, { src: user?.image, alt: user?.name ?? 'User' }), _jsx(AvatarFallback, { className: "rounded-full bg-primary text-primary-foreground text-xs", children: getUserInitials(user) })] }) }) }), _jsxs(DropdownMenuContent, { align: "end", className: "min-w-64 rounded-lg", sideOffset: 4, children: [_jsx(DropdownMenuLabel, { className: "p-0 font-normal", children: _jsxs("div", { className: "flex items-center gap-2 px-2 py-2", children: [_jsxs(Avatar, { className: "h-8 w-8 rounded-lg", children: [_jsx(AvatarImage, { src: user?.image, alt: user?.name ?? 'User' }), _jsx(AvatarFallback, { className: "rounded-lg bg-primary text-primary-foreground", children: getUserInitials(user) })] }), _jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [_jsx("span", { className: "truncate font-semibold", children: user?.name ?? 'User' }), _jsx("span", { className: "truncate text-xs text-muted-foreground", children: user?.email ?? '' })] })] }) }), _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuGroup, { children: [hasOrgSection && (_jsxs(DropdownMenuItem, { onClick: () => navigate('/organizations'), className: "cursor-pointer", children: [_jsx(Boxes, { className: "mr-2 h-4 w-4" }), t('organizations.mine', { defaultValue: 'My Organizations' })] })), _jsxs(DropdownMenuItem, { onClick: () => navigate('/apps/setup/system/profile'), children: [_jsx(UserIcon, { className: "mr-2 h-4 w-4" }), t('user.profile', { defaultValue: 'Profile' })] }), _jsxs(DropdownMenuItem, { onClick: () => navigate('/apps/setup'), children: [_jsx(Settings, { className: "mr-2 h-4 w-4" }), t('sidebar.settings', { defaultValue: 'Settings' })] })] }), isAuthEnabled && (_jsxs(_Fragment, { children: [_jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { className: "text-destructive focus:text-destructive", onClick: () => signOut(), children: [_jsx(LogOut, { className: "mr-2 h-4 w-4" }), t('user.logout', { defaultValue: 'Log out' })] })] }))] })] })] })] })] }));
+                            }), _jsx("span", { className: "text-sm font-medium sm:hidden truncate min-w-0 ml-1", children: lastSegmentLabel })] }))] }), _jsxs("div", { className: "flex items-center gap-0.5 sm:gap-1 shrink-0 [&>*+*[data-topbar-group]]:ml-1 [&>[data-topbar-group]+[data-topbar-group]]:border-l [&>[data-topbar-group]+[data-topbar-group]]:border-border/60 [&>[data-topbar-group]+[data-topbar-group]]:pl-1 sm:[&>[data-topbar-group]+[data-topbar-group]]:pl-2 sm:[&>[data-topbar-group]+[data-topbar-group]]:ml-2", children: [!isOnline && (_jsxs("div", { className: "flex items-center gap-1 px-2 py-1 rounded-full bg-yellow-100 dark:bg-yellow-900/30 text-yellow-800 dark:text-yellow-200 text-xs font-medium", children: [_jsx("span", { className: "h-2 w-2 rounded-full bg-yellow-500 animate-pulse" }), "Offline"] })), isApp && connectionState && _jsx(ConnectionStatus, { state: connectionState }), isApp && activeUsers.length > 0 && (_jsx("div", { className: "hidden md:flex items-center shrink-0", title: "Users currently online", children: _jsx(PresenceAvatars, { users: activeUsers, size: "sm", maxVisible: 3, showStatus: true }) })), _jsxs("div", { "data-topbar-group": true, className: "flex items-center gap-0.5 sm:gap-1 shrink-0", children: [_jsxs("button", { onClick: () => document.dispatchEvent(new KeyboardEvent('keydown', { key: 'k', metaKey: true })), className: "hidden lg:flex relative items-center gap-2 w-48 xl:w-64 h-8 px-3 text-sm rounded-md border bg-muted/50 text-muted-foreground hover:bg-muted transition-colors", children: [_jsx(Search, { className: "h-3.5 w-3.5 shrink-0" }), _jsx("span", { className: "flex-1 text-left text-xs", children: t('console.search', { defaultValue: 'Search...' }) }), _jsxs("kbd", { className: "pointer-events-none inline-flex h-5 items-center gap-0.5 rounded border bg-background px-1.5 text-[10px] font-medium text-muted-foreground", children: [_jsx("span", { className: "text-xs", children: "\u2318" }), "K"] })] }), _jsx(Button, { variant: "ghost", size: "icon", className: "lg:hidden h-8 w-8 shrink-0", onClick: () => document.dispatchEvent(new KeyboardEvent('keydown', { key: 'k', metaKey: true })), "aria-label": t('console.search', { defaultValue: 'Search...' }), children: _jsx(Search, { className: "h-4 w-4" }) })] }), _jsxs("div", { "data-topbar-group": true, className: "flex items-center gap-0.5 shrink-0", children: [_jsx("div", { className: "hidden sm:flex shrink-0", children: _jsx(ActivityFeed, { activities: activeActivities }) }), pendingApprovalsCount >= 0 && (_jsxs(Button, { variant: "ghost", size: "icon", className: "h-8 w-8 relative shrink-0", "aria-label": t('sidebar.approvals', { defaultValue: 'Approvals' }), title: t('sidebar.approvals', { defaultValue: 'Approvals' }), onClick: () => {
+                                    const app = currentAppName ?? params.appName;
+                                    navigate(app ? `/apps/${app}/system/approvals` : '/apps/setup/system/approvals');
+                                }, children: [_jsx(CheckSquare, { className: "h-4 w-4" }), pendingApprovalsCount > 0 && (_jsx("span", { className: "absolute -top-0.5 -right-0.5 h-4 min-w-[16px] rounded-full bg-amber-500 text-[10px] leading-4 text-white text-center px-1", children: pendingApprovalsCount > 9 ? '9+' : pendingApprovalsCount }))] })), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "icon", className: "h-8 w-8 relative shrink-0", "aria-label": t('sidebar.notifications', { defaultValue: 'Notifications' }), children: [_jsx(Bell, { className: "h-4 w-4" }), unreadCount > 0 && (_jsx("span", { className: "absolute -top-0.5 -right-0.5 h-4 min-w-[16px] rounded-full bg-red-500 text-[10px] leading-4 text-white text-center px-1", children: unreadCount > 9 ? '9+' : unreadCount }))] }) }), _jsxs(DropdownMenuContent, { align: "end", className: "w-80 max-h-96 overflow-auto", children: [_jsxs(DropdownMenuLabel, { className: "flex items-center justify-between", children: [_jsx("span", { children: t('sidebar.notifications', { defaultValue: 'Notifications' }) }), unreadCount > 0 && (_jsx("button", { type: "button", onClick: (e) => { e.preventDefault(); markAllRead(); }, className: "text-xs text-muted-foreground hover:text-foreground", children: t('notifications.markAllRead', { defaultValue: 'Mark all read' }) }))] }), _jsx(DropdownMenuSeparator, {}), notifications.length === 0 ? (_jsx("div", { className: "px-3 py-6 text-sm text-muted-foreground text-center", children: t('notifications.empty', { defaultValue: 'No notifications' }) })) : (notifications.map((n) => (_jsxs(DropdownMenuItem, { className: `flex flex-col items-start gap-1 ${n.is_read ? '' : 'bg-accent/40'}`, onSelect: () => {
+                                                    markNotificationRead(n.id);
+                                                    if (n.source_object && n.source_id) {
+                                                        // Navigate to the related record; relative to /apps/<currentApp> if any.
+                                                        const app = currentAppName ?? params.appName;
+                                                        const target = app
+                                                            ? `/apps/${app}/${n.source_object}/${n.source_id}`
+                                                            : `/objects/${n.source_object}/${n.source_id}`;
+                                                        navigate(target);
+                                                    }
+                                                }, children: [_jsx("div", { className: "text-sm font-medium leading-tight", children: n.title }), n.body && (_jsx("div", { className: "text-xs text-muted-foreground line-clamp-2", children: n.body })), n.created_at && (_jsx("div", { className: "text-[10px] text-muted-foreground", children: new Date(n.created_at).toLocaleString() }))] }, n.id))))] })] }), _jsx(Button, { variant: "ghost", size: "icon", className: "h-8 w-8 hidden md:flex shrink-0", asChild: true, "aria-label": t('sidebar.helpTooltip', { defaultValue: 'Help & Documentation' }), children: _jsx("a", { href: "https://docs.objectstack.ai", target: "_blank", rel: "noopener noreferrer", children: _jsx(HelpCircle, { className: "h-4 w-4" }) }) })] }), _jsxs("div", { "data-topbar-group": true, className: "flex items-center gap-0.5 shrink-0", children: [_jsx("div", { className: "hidden sm:flex shrink-0", children: _jsx(ModeToggle, {}) }), _jsx("div", { className: "hidden sm:flex shrink-0", children: _jsx(LocaleSwitcher, {}) }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx(Button, { variant: "ghost", size: "icon", className: "h-8 w-8 shrink-0 rounded-full", children: _jsxs(Avatar, { className: "h-7 w-7 rounded-full", children: [_jsx(AvatarImage, { src: user?.image, alt: user?.name ?? 'User' }), _jsx(AvatarFallback, { className: "rounded-full bg-primary text-primary-foreground text-xs", children: getUserInitials(user) })] }) }) }), _jsxs(DropdownMenuContent, { align: "end", className: "min-w-64 rounded-lg", sideOffset: 4, children: [_jsx(DropdownMenuLabel, { className: "p-0 font-normal", children: _jsxs("div", { className: "flex items-center gap-2 px-2 py-2", children: [_jsxs(Avatar, { className: "h-8 w-8 rounded-lg", children: [_jsx(AvatarImage, { src: user?.image, alt: user?.name ?? 'User' }), _jsx(AvatarFallback, { className: "rounded-lg bg-primary text-primary-foreground", children: getUserInitials(user) })] }), _jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [_jsx("span", { className: "truncate font-semibold", children: user?.name ?? 'User' }), _jsx("span", { className: "truncate text-xs text-muted-foreground", children: user?.email ?? '' })] })] }) }), _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuGroup, { children: [hasOrgSection && (_jsxs(DropdownMenuItem, { onClick: () => navigate('/organizations'), className: "cursor-pointer", children: [_jsx(Boxes, { className: "mr-2 h-4 w-4" }), t('organizations.mine', { defaultValue: 'My Organizations' })] })), _jsxs(DropdownMenuItem, { onClick: () => navigate('/apps/setup/system/profile'), children: [_jsx(UserIcon, { className: "mr-2 h-4 w-4" }), t('user.profile', { defaultValue: 'Profile' })] }), _jsxs(DropdownMenuItem, { onClick: () => navigate('/apps/setup'), children: [_jsx(Settings, { className: "mr-2 h-4 w-4" }), t('sidebar.settings', { defaultValue: 'Settings' })] })] }), isAuthEnabled && (_jsxs(_Fragment, { children: [_jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { className: "text-destructive focus:text-destructive", onClick: () => signOut(), children: [_jsx(LogOut, { className: "mr-2 h-4 w-4" }), t('user.logout', { defaultValue: 'Log out' })] })] }))] })] })] })] })] }));
 }

package/dist/layout/AppSidebar.js

@@ -202,19 +202,37 @@ export function AppSidebar({ activeAppName, onAppChange }) {
                                                 }) }) })] })), _jsx(SidebarGroup, { className: "py-0", children: _jsxs(SidebarGroupContent, { className: "relative", children: [_jsx(Search, { className: "pointer-events-none absolute left-2 top-1/2 size-4 -translate-y-1/2 select-none opacity-70" }), _jsx(SidebarInput, { placeholder: "Search navigation...", value: navSearchQuery, onChange: (e) => setNavSearchQuery(e.target.value), className: "pl-8" })] }) }), _jsx(NavigationRenderer, { items: processedNavigation, basePath: basePath, evaluateVisibility: evalVis, checkPermission: checkPerm, checkCapability: checkCap, searchQuery: navSearchQuery, enablePinning: true, onPinToggle: togglePin, enableReorder: true, onReorder: handleReorder, resolveObjectLabel: (objectName, fallback) => resolveNavObjectLabel({ name: objectName, label: fallback }), t: t }), recentItems.length > 0 && (_jsxs(SidebarGroup, { children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5 cursor-pointer select-none", onClick: () => setRecentExpanded(prev => !prev), children: [_jsx(ChevronRight, { className: `h-3 w-3 transition-transform duration-150 ${recentExpanded ? 'rotate-90' : ''}` }), _jsx(Clock, { className: "h-3.5 w-3.5" }), "Recent"] }), recentExpanded && (_jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: recentItems.slice(0, 5).map(item => (_jsx(SidebarMenuItem, { children: _jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, children: _jsxs(Link, { to: item.href, children: [_jsx("span", { className: "text-muted-foreground", children: item.type === 'dashboard' ? '📊' : item.type === 'report' ? '📈' : '📄' }), _jsx("span", { className: "truncate", children: item.label })] }) }) }, item.id))) }) }))] })), favorites.length > 0 && (_jsxs(SidebarGroup, { children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5", children: [_jsx(Star, { className: "h-3.5 w-3.5" }), "Favorites"] }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: favorites.slice(0, 8).map(item => (_jsxs(SidebarMenuItem, { children: [_jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, children: _jsxs(Link, { to: item.href, children: [_jsx("span", { className: "text-muted-foreground", children: item.type === 'dashboard' ? '📊' : item.type === 'report' ? '📈' : item.type === 'page' ? '📄' : '📋' }), _jsx("span", { className: "truncate", children: item.label })] }) }), _jsx(SidebarMenuAction, { showOnHover: true, onClick: (e) => { e.stopPropagation(); removeFavorite(item.id); }, "aria-label": `Remove ${item.label} from favorites`, children: _jsx(StarOff, { className: "h-3 w-3" }) })] }, item.id))) }) })] }))] })) : (_jsxs(SidebarGroup, { "data-testid": "system-fallback-nav", children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5", children: [_jsx(Settings, { className: "h-3.5 w-3.5" }), "System"] }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: systemFallbackNavigation.map((item) => {
                                             const NavIcon = getIcon(item.icon);
                                             return (_jsx(SidebarMenuItem, { children: _jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, children: _jsxs(Link, { to: item.url || '/system', children: [_jsx(NavIcon, { className: "h-4 w-4" }), _jsx("span", { children: item.label })] }) }) }, item.id));
-                                        }) }) })] })) }), _jsx(SidebarFooter, { children: _jsx(SidebarMenu, { 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: [_jsxs(Avatar, { className: "h-8 w-8 rounded-lg", children: [_jsx(AvatarImage, { src: user?.image, alt: user?.name ?? 'User' }), _jsx(AvatarFallback, { className: "rounded-lg bg-primary text-primary-foreground", children: getUserInitials(user) })] }), _jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [_jsx("span", { className: "truncate font-semibold", children: user?.name ?? 'User' }), _jsx("span", { className: "truncate text-xs text-muted-foreground", children: user?.email ?? '' })] }), _jsx(ChevronsUpDown, { className: "ml-auto size-4" })] }) }), _jsxs(DropdownMenuContent, { className: "w-(--radix-dropdown-menu-trigger-width) min-w-56 rounded-lg", side: isMobile ? "bottom" : "right", align: "end", sideOffset: 4, children: [_jsx(DropdownMenuLabel, { className: "p-0 font-normal", children: _jsxs("div", { className: "flex items-center gap-2 px-1 py-1.5 text-left text-sm", children: [_jsxs(Avatar, { className: "h-8 w-8 rounded-lg", children: [_jsx(AvatarImage, { src: user?.image, alt: user?.name ?? 'User' }), _jsx(AvatarFallback, { className: "rounded-lg bg-primary text-primary-foreground", children: getUserInitials(user) })] }), _jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [_jsx("span", { className: "truncate font-semibold", children: user?.name ?? 'User' }), _jsx("span", { className: "truncate text-xs text-muted-foreground", children: user?.email ?? '' })] })] }) }), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuGroup, { children: _jsxs(DropdownMenuItem, { onClick: () => navigate('/apps/setup'), children: [_jsx(Settings, { className: "mr-2 h-4 w-4" }), t('user.settings', { defaultValue: 'Settings' })] }) }), isAuthEnabled && (_jsxs(_Fragment, { children: [_jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { className: "text-destructive focus:text-destructive", onClick: () => signOut(), children: [_jsx(LogOut, { className: "mr-2 h-4 w-4" }), t('user.logout', { defaultValue: 'Log out' })] })] }))] })] }) }) }) })] }), isMobile && (_jsx("div", { className: "fixed bottom-0 left-0 right-0 z-50 flex items-center justify-around border-t bg-background/95 backdrop-blur-sm px-2 py-1 sm:hidden safe-area-bottom", children: (activeApp ? resolvedNavigation : systemFallbackNavigation).filter((n) => n.type !== 'group').slice(0, 5).map((item) => {
-                    const NavIcon = getIcon(item.icon);
-                    const baseUrl = activeApp ? `/apps/${activeAppName}` : '';
-                    let href = item.url || '#';
-                    if (item.type === 'object') {
-                        href = `${baseUrl}/${item.objectName}`;
-                        if (item.viewName)
-                            href += `/view/${item.viewName}`;
+                                        }) }) })] })) }), _jsx(SidebarFooter, { children: _jsx(SidebarMenu, { 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: [_jsxs(Avatar, { className: "h-8 w-8 rounded-lg", children: [_jsx(AvatarImage, { src: user?.image, alt: user?.name ?? 'User' }), _jsx(AvatarFallback, { className: "rounded-lg bg-primary text-primary-foreground", children: getUserInitials(user) })] }), _jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [_jsx("span", { className: "truncate font-semibold", children: user?.name ?? 'User' }), _jsx("span", { className: "truncate text-xs text-muted-foreground", children: user?.email ?? '' })] }), _jsx(ChevronsUpDown, { className: "ml-auto size-4" })] }) }), _jsxs(DropdownMenuContent, { className: "w-(--radix-dropdown-menu-trigger-width) min-w-56 rounded-lg", side: isMobile ? "bottom" : "right", align: "end", sideOffset: 4, children: [_jsx(DropdownMenuLabel, { className: "p-0 font-normal", children: _jsxs("div", { className: "flex items-center gap-2 px-1 py-1.5 text-left text-sm", children: [_jsxs(Avatar, { className: "h-8 w-8 rounded-lg", children: [_jsx(AvatarImage, { src: user?.image, alt: user?.name ?? 'User' }), _jsx(AvatarFallback, { className: "rounded-lg bg-primary text-primary-foreground", children: getUserInitials(user) })] }), _jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [_jsx("span", { className: "truncate font-semibold", children: user?.name ?? 'User' }), _jsx("span", { className: "truncate text-xs text-muted-foreground", children: user?.email ?? '' })] })] }) }), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuGroup, { children: _jsxs(DropdownMenuItem, { onClick: () => navigate('/apps/setup'), children: [_jsx(Settings, { className: "mr-2 h-4 w-4" }), t('user.settings', { defaultValue: 'Settings' })] }) }), isAuthEnabled && (_jsxs(_Fragment, { children: [_jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { className: "text-destructive focus:text-destructive", onClick: () => signOut(), children: [_jsx(LogOut, { className: "mr-2 h-4 w-4" }), t('user.logout', { defaultValue: 'Log out' })] })] }))] })] }) }) }) })] }), isMobile && (_jsx("div", { className: "fixed bottom-0 left-0 right-0 z-50 flex items-center justify-around border-t bg-background/95 backdrop-blur-sm px-2 py-1 sm:hidden safe-area-bottom", children: (() => {
+                    // Flatten group items so apps that organise navigation into groups
+                    // (e.g. Setup → Overview / Administration / …) still surface real
+                    // leaf links in the mobile bottom nav instead of rendering nothing.
+                    const source = activeApp ? resolvedNavigation : systemFallbackNavigation;
+                    const leaves = [];
+                    for (const item of source) {
+                        if (item.type === 'group') {
+                            for (const child of (item.children || item.items || [])) {
+                                if (child && child.type !== 'group')
+                                    leaves.push(child);
+                            }
+                        }
+                        else {
+                            leaves.push(item);
+                        }
                     }
-                    else if (item.type === 'dashboard')
-                        href = item.dashboardName ? `${baseUrl}/dashboard/${item.dashboardName}` : '#';
-                    else if (item.type === 'page')
-                        href = item.pageName ? `${baseUrl}/page/${item.pageName}` : '#';
-                    return (_jsxs(Link, { to: href, className: "flex flex-col items-center gap-0.5 px-2 py-1.5 text-muted-foreground hover:text-foreground transition-colors min-w-[44px] min-h-[44px] justify-center", children: [_jsx(NavIcon, { className: "h-5 w-5" }), _jsx("span", { className: "text-[10px] truncate max-w-[60px]", children: resolveI18nLabel(item.label, t) })] }, item.id));
-                }) }))] }));
+                    return leaves.slice(0, 5).map((item) => {
+                        const NavIcon = getIcon(item.icon);
+                        const baseUrl = activeApp ? `/apps/${activeAppName}` : '';
+                        let href = item.url || '#';
+                        if (item.type === 'object') {
+                            href = `${baseUrl}/${item.objectName}`;
+                            if (item.viewName)
+                                href += `/view/${item.viewName}`;
+                        }
+                        else if (item.type === 'dashboard')
+                            href = item.dashboardName ? `${baseUrl}/dashboard/${item.dashboardName}` : '#';
+                        else if (item.type === 'page')
+                            href = item.pageName ? `${baseUrl}/page/${item.pageName}` : '#';
+                        return (_jsxs(Link, { to: href, className: "flex flex-col items-center gap-0.5 px-2 py-1.5 text-muted-foreground hover:text-foreground transition-colors min-w-[44px] min-h-[44px] justify-center", children: [_jsx(NavIcon, { className: "h-5 w-5" }), _jsx("span", { className: "text-[10px] truncate max-w-[60px]", children: resolveI18nLabel(item.label, t) })] }, item.id));
+                    });
+                })() }))] }));
 }

package/dist/layout/UnifiedSidebar.js

@@ -180,18 +180,35 @@ export function UnifiedSidebar({ activeAppName }) {
                                                     const NavIcon = getIcon(item.icon);
                                                     const isActive = location.pathname === item.url;
                                                     return (_jsx(SidebarMenuItem, { children: _jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, isActive: isActive, children: _jsxs(Link, { to: item.url || '/home', children: [_jsx(NavIcon, { className: "h-4 w-4" }), _jsx("span", { children: item.label })] }) }) }, item.id));
-                                                }) }) }) }), favorites.filter(f => f.type === 'object' || f.type === 'dashboard' || f.type === 'page').length > 0 && (_jsxs(SidebarGroup, { children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5", children: [_jsx(Star, { className: "h-3.5 w-3.5" }), t('sidebar.starred', { defaultValue: 'Starred' })] }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: favorites.filter(f => f.type === 'object' || f.type === 'dashboard' || f.type === 'page').slice(0, 8).map(item => (_jsxs(SidebarMenuItem, { children: [_jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, children: _jsxs(Link, { to: item.href, children: [_jsx("span", { className: "text-muted-foreground", children: item.type === 'dashboard' ? '📊' : item.type === 'page' ? '📄' : '📋' }), _jsx("span", { className: "truncate", children: item.label })] }) }), _jsx(SidebarMenuAction, { showOnHover: true, onClick: (e) => { e.stopPropagation(); removeFavorite(item.id); }, "aria-label": t('sidebar.removeFromFavorites', { defaultValue: 'Remove {{name}} from favorites', name: item.label }), children: _jsx(StarOff, { className: "h-3 w-3" }) })] }, item.id))) }) })] }))] })) }) }), _jsx(SidebarFooter, { className: "border-t p-1", children: _jsx(SidebarTrigger, { className: "w-full justify-start pl-2 group-data-[state=collapsed]:justify-center group-data-[state=collapsed]:pl-0" }) })] }), isMobile && context === 'app' && (_jsx("div", { className: "fixed bottom-0 left-0 right-0 z-50 flex items-center justify-around border-t bg-background/95 backdrop-blur-sm px-2 py-1 sm:hidden safe-area-bottom", children: processedNavigation.filter((n) => n.type !== 'group').slice(0, 5).map((item) => {
-                    const NavIcon = getIcon(item.icon);
-                    let href = item.url || '#';
-                    if (item.type === 'object') {
-                        href = `${basePath}/${item.objectName}`;
-                        if (item.viewName)
-                            href += `/view/${item.viewName}`;
+                                                }) }) }) }), favorites.filter(f => f.type === 'object' || f.type === 'dashboard' || f.type === 'page').length > 0 && (_jsxs(SidebarGroup, { children: [_jsxs(SidebarGroupLabel, { className: "flex items-center gap-1.5", children: [_jsx(Star, { className: "h-3.5 w-3.5" }), t('sidebar.starred', { defaultValue: 'Starred' })] }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: favorites.filter(f => f.type === 'object' || f.type === 'dashboard' || f.type === 'page').slice(0, 8).map(item => (_jsxs(SidebarMenuItem, { children: [_jsx(SidebarMenuButton, { asChild: true, tooltip: item.label, children: _jsxs(Link, { to: item.href, children: [_jsx("span", { className: "text-muted-foreground", children: item.type === 'dashboard' ? '📊' : item.type === 'page' ? '📄' : '📋' }), _jsx("span", { className: "truncate", children: item.label })] }) }), _jsx(SidebarMenuAction, { showOnHover: true, onClick: (e) => { e.stopPropagation(); removeFavorite(item.id); }, "aria-label": t('sidebar.removeFromFavorites', { defaultValue: 'Remove {{name}} from favorites', name: item.label }), children: _jsx(StarOff, { className: "h-3 w-3" }) })] }, item.id))) }) })] }))] })) }) }), _jsx(SidebarFooter, { className: "border-t p-1", children: _jsx(SidebarTrigger, { className: "w-full justify-start pl-2 group-data-[state=collapsed]:justify-center group-data-[state=collapsed]:pl-0" }) })] }), isMobile && context === 'app' && (_jsx("div", { className: "fixed bottom-0 left-0 right-0 z-50 flex items-center justify-around border-t bg-background/95 backdrop-blur-sm px-2 py-1 sm:hidden safe-area-bottom", children: (() => {
+                    // Flatten group items so apps that organise navigation into groups
+                    // (e.g. Setup → Overview / Administration / …) still surface real
+                    // leaf links in the mobile bottom nav instead of rendering nothing.
+                    const leaves = [];
+                    for (const item of processedNavigation) {
+                        if (item.type === 'group') {
+                            for (const child of (item.children || [])) {
+                                if (child && child.type !== 'group')
+                                    leaves.push(child);
+                            }
+                        }
+                        else {
+                            leaves.push(item);
+                        }
                     }
-                    else if (item.type === 'dashboard')
-                        href = item.dashboardName ? `${basePath}/dashboard/${item.dashboardName}` : '#';
-                    else if (item.type === 'page')
-                        href = item.pageName ? `${basePath}/page/${item.pageName}` : '#';
-                    return (_jsxs(Link, { to: href, className: "flex flex-col items-center gap-0.5 px-2 py-1.5 text-muted-foreground hover:text-foreground transition-colors min-w-[44px] min-h-[44px] justify-center", children: [_jsx(NavIcon, { className: "h-5 w-5" }), _jsx("span", { className: "text-[10px] truncate max-w-[60px]", children: resolveI18nLabel(item.label, t) })] }, item.id));
-                }) }))] }));
+                    return leaves.slice(0, 5).map((item) => {
+                        const NavIcon = getIcon(item.icon);
+                        let href = item.url || '#';
+                        if (item.type === 'object') {
+                            href = `${basePath}/${item.objectName}`;
+                            if (item.viewName)
+                                href += `/view/${item.viewName}`;
+                        }
+                        else if (item.type === 'dashboard')
+                            href = item.dashboardName ? `${basePath}/dashboard/${item.dashboardName}` : '#';
+                        else if (item.type === 'page')
+                            href = item.pageName ? `${basePath}/page/${item.pageName}` : '#';
+                        return (_jsxs(Link, { to: href, className: "flex flex-col items-center gap-0.5 px-2 py-1.5 text-muted-foreground hover:text-foreground transition-colors min-w-[44px] min-h-[44px] justify-center", children: [_jsx(NavIcon, { className: "h-5 w-5" }), _jsx("span", { className: "text-[10px] truncate max-w-[60px]", children: resolveI18nLabel(item.label, t) })] }, item.id));
+                    });
+                })() }))] }));
 }

package/dist/utils/crudAffordances.d.ts

@@ -0,0 +1,41 @@
+/**
+ * crudAffordances — UI-side mirror of the framework's
+ * `resolveCrudAffordances()` helper (see
+ * `@objectstack/spec/data/object.zod.ts`).
+ *
+ * The framework tags every object with a `managedBy` lifecycle bucket
+ * (`platform | config | system | append-only | better-auth`) and an
+ * optional `userActions` override block. UI components ask this helper
+ * "should I show the New / Import / Edit / Delete / Export buttons?" so
+ * the toolbar tracks the object's lifecycle automatically — no need for
+ * each view to special-case `sys_*` names.
+ *
+ * Keep this in lockstep with the framework helper. The bucket defaults
+ * mirror what Salesforce / ServiceNow / Workday / Notion do for the
+ * equivalent categories of system tables.
+ */
+export type ManagedByBucket = 'platform' | 'config' | 'system' | 'append-only' | 'better-auth';
+export interface CrudAffordances {
+    /** Generic "New" button for single-record creation. */
+    create: boolean;
+    /** CSV bulk-import wizard. */
+    import: boolean;
+    /** Inline + form editing of existing rows. */
+    edit: boolean;
+    /** Row-level + bulk delete. */
+    delete: boolean;
+    /** CSV / clipboard export. */
+    exportCsv: boolean;
+}
+export interface UserActionsOverride {
+    create?: boolean;
+    import?: boolean;
+    edit?: boolean;
+    delete?: boolean;
+    exportCsv?: boolean;
+}
+export interface SchemaLike {
+    managedBy?: string | null;
+    userActions?: UserActionsOverride | null;
+}
+export declare function resolveCrudAffordances(obj: SchemaLike | null | undefined): CrudAffordances;