@object-ui/app-shell 4.0.6 → 4.0.8

package/dist/views/ObjectView.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 /**
  * Console ObjectView
  *
@@ -9,9 +9,10 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * - useObjectActions for toolbar create button
  * - ListView delegation for non-grid view types (kanban, calendar, chart, etc.)
  */
-import { useMemo, useState, useCallback, useEffect, lazy, Suspense } from 'react';
+import { useMemo, useState, useCallback, useEffect, useRef, lazy, Suspense } from 'react';
 import { useParams, useSearchParams, useNavigate } from 'react-router-dom';
 const ObjectChart = lazy(() => import('@object-ui/plugin-charts').then((m) => ({ default: m.ObjectChart })));
+const ImportWizard = lazy(() => import('@object-ui/plugin-grid').then((m) => ({ default: m.ImportWizard })));
 import { ListView } from '@object-ui/plugin-list';
 import { DetailView, RecordChatterPanel } from '@object-ui/plugin-detail';
 import { ObjectView as PluginObjectView, ViewTabBar, ManageViewsDialog } from '@object-ui/plugin-view';
@@ -19,11 +20,12 @@ import { ObjectView as PluginObjectView, ViewTabBar, ManageViewsDialog } from '@
 // uses ComponentRegistry.registerLazy so heavy plugins stay code-split).
 // Do NOT add eager `import '@object-ui/plugin-*'` side-effect imports here.
 import { Button, Empty, EmptyTitle, EmptyDescription, NavigationOverlay } from '@object-ui/components';
-import { Plus, Table as TableIcon, KanbanSquare, Calendar, LayoutGrid, Activity, GanttChart, MapPin, BarChart3 } from 'lucide-react';
+import { Plus, Upload, Table as TableIcon, KanbanSquare, Calendar, LayoutGrid, Activity, GanttChart, MapPin, BarChart3 } from 'lucide-react';
 import { getIcon } from '../utils/getIcon';
 import { MetadataPanel, useMetadataInspector } from './MetadataInspector';
 import { ViewConfigPanel } from './ViewConfigPanel';
 import { CreateViewDialog } from './CreateViewDialog';
+import { PageHeader } from '../layout/PageHeader';
 import { useObjectActions } from '../hooks/useObjectActions';
 import { useObjectTranslation, useObjectLabel } from '@object-ui/i18n';
 import { usePermissions } from '@object-ui/permissions';
@@ -196,13 +198,13 @@ function DrawerDetailContent({ objectDef, recordId, dataSource, onEdit }) {
                         },
                     }, items: feedItems, onAddComment: handleAddComment, onAddReply: handleAddReply, onToggleReaction: handleToggleReaction }) })] }));
 }
-export function ObjectView({ dataSource, objects, onEdit }) {
+export function ObjectView({ dataSource, objects, onEdit, externalRefreshKey }) {
     const navigate = useNavigate();
     const { objectName, viewId } = useParams();
     const [searchParams, setSearchParams] = useSearchParams();
     const { showDebug } = useMetadataInspector();
     const { t } = useObjectTranslation();
-    const { objectLabel, objectDescription: objectDesc } = useObjectLabel();
+    const { objectLabel, objectDescription: objectDesc, viewLabel, actionLabel, actionConfirm, actionSuccess } = useObjectLabel();
     // Inline view config panel state (Airtable-style right sidebar)
     const [showViewConfigPanel, setShowViewConfigPanel] = useState(false);
     const [viewConfigPanelMode, setViewConfigPanelMode] = useState('edit');
@@ -212,6 +214,35 @@ export function ObjectView({ dataSource, objects, onEdit }) {
     const [manageViewsOpen, setManageViewsOpen] = useState(false);
     // Draft state for view config edits — cached locally, saved on demand
     const [viewDraft, setViewDraft] = useState(null);
+    // Per-view debounce timers + latest pending patch payloads. Keyed by
+    // viewId so toggles on different views don't clobber each other. We
+    // merge incoming patches into a single payload so rapid successive
+    // toggles (e.g. resize-drag emitting 60 events/sec) collapse into one
+    // network write.
+    const persistTimers = useRef({});
+    const persistPending = useRef({});
+    const persistViewPatch = useCallback((viewIdLocal, baseViewDef, patch) => {
+        if (!dataSource?.updateViewConfig || !objectName || !viewIdLocal)
+            return;
+        // Merge into pending payload — every key present is the latest
+        // value the user intended.
+        const prev = persistPending.current[viewIdLocal] || {};
+        persistPending.current[viewIdLocal] = { ...prev, ...patch };
+        const existing = persistTimers.current[viewIdLocal];
+        if (existing)
+            clearTimeout(existing);
+        persistTimers.current[viewIdLocal] = setTimeout(() => {
+            const merged = persistPending.current[viewIdLocal] || {};
+            delete persistPending.current[viewIdLocal];
+            delete persistTimers.current[viewIdLocal];
+            Promise.resolve(dataSource.updateViewConfig(objectName, viewIdLocal, {
+                ...baseViewDef,
+                ...merged,
+            })).catch((err) => {
+                console.error('[ObjectView] Failed to persist view config:', err);
+            });
+        }, 300);
+    }, [dataSource, objectName]);
     const handleViewConfigSave = useCallback((draft) => {
         setViewDraft(draft);
         setRefreshKey(k => k + 1);
@@ -258,10 +289,43 @@ export function ObjectView({ dataSource, objects, onEdit }) {
                 const incomingColumns = Array.isArray(config.columns) && config.columns.length > 0
                     ? config.columns
                     : defaultColumns;
+                // Translate NamedListView spec shape (type, label, kanban, chart,
+                // gantt, etc., columns, filter, sort) into the sys_view storage
+                // shape (view_type, label, object_name, *_json columns).
+                // Per spec: front-end follows the protocol, the persistence
+                // boundary owns the mapping to physical columns.
+                const VIEW_TYPE_KEYS = [
+                    'kanban', 'calendar', 'timeline', 'gantt',
+                    'gallery', 'map', 'chart', 'grid',
+                ];
+                const subConfig = {};
+                for (const k of VIEW_TYPE_KEYS) {
+                    if (config[k] && typeof config[k] === 'object') {
+                        Object.assign(subConfig, config[k]);
+                    }
+                }
+                const viewType = config.type || 'grid';
+                const baseLabel = config.label || config.name || 'Untitled View';
+                const slug = baseLabel
+                    .toLowerCase()
+                    .replace(/[^a-z0-9]+/g, '_')
+                    .replace(/^_+|_+$/g, '')
+                    .slice(0, 60) || 'view';
                 const payload = {
-                    objectName,
-                    ...config,
-                    columns: incomingColumns,
+                    name: `${slug}_${Date.now().toString(36)}`,
+                    label: baseLabel,
+                    object_name: objectName,
+                    view_type: viewType,
+                    columns_json: JSON.stringify(incomingColumns),
+                    filters_json: config.filter ? JSON.stringify(config.filter) : null,
+                    sort_json: config.sort ? JSON.stringify(config.sort) : null,
+                    config_json: Object.keys(subConfig).length > 0
+                        ? JSON.stringify(subConfig)
+                        : null,
+                    page_size: config.pageSize ?? 25,
+                    show_search: config.showSearch !== false,
+                    show_filters: config.showFilters !== false,
+                    managed_by: 'user',
                 };
                 const created = await dataSource.create('sys_view', payload);
                 createdId = created?.id ?? created?._id;
@@ -298,6 +362,15 @@ export function ObjectView({ dataSource, objects, onEdit }) {
     }
     // Refresh trigger — bumped after view CRUD or external data mutations.
     const [refreshKey, setRefreshKey] = useState(0);
+    // Propagate externally-triggered refreshes (e.g. global ModalForm submit)
+    // into our internal refreshKey so list/data effects re-run.
+    useEffect(() => {
+        if (externalRefreshKey === undefined || externalRefreshKey === 0)
+            return;
+        setRefreshKey(k => k + 1);
+    }, [externalRefreshKey]);
+    // Import wizard open/close state — toolbar entry triggers it.
+    const [showImport, setShowImport] = useState(false);
     // ─── User-defined views (sys_view) ──────────────────────────────────
     // Saved views created via the ViewConfigPanel ("Add View") are persisted
     // to the `sys_view` object. We fetch them here and merge into `views` so
@@ -338,6 +411,70 @@ export function ObjectView({ dataSource, objects, onEdit }) {
         });
         return () => { cancelled = true; };
     }, [dataSource, objectName, refreshKey]);
+    // Persisted per-view config overrides (e.g. density toggle). Saved
+    // separately from `objectDef.listViews` (the embedded definition) via
+    // `dataSource.updateViewConfig` and read back here so toggle preferences
+    // survive a hard reload. Keyed by viewId → partial view config to merge.
+    //
+    // Use the batch listViewOverrides() when available — fires one HTTP
+    // GET per object instead of N (one per defined view), avoiding a flurry
+    // of 404s for objects whose views have never been customized. Falls
+    // back to per-view getView() for adapters that don't support the batch
+    // method.
+    const [viewOverrides, setViewOverrides] = useState({});
+    useEffect(() => {
+        let cancelled = false;
+        if (!dataSource || !objectName) {
+            setViewOverrides({});
+            return;
+        }
+        const definedViews = (objectDef.listViews || objectDef.list_views || {});
+        const ids = Object.keys(definedViews);
+        if (ids.length === 0) {
+            setViewOverrides({});
+            return;
+        }
+        const loadBatch = async () => {
+            if (typeof dataSource.listViewOverrides === 'function') {
+                try {
+                    const all = await dataSource.listViewOverrides(objectName);
+                    if (all && typeof all === 'object') {
+                        const map = {};
+                        for (const id of ids) {
+                            if (all[id])
+                                map[id] = all[id];
+                        }
+                        return map;
+                    }
+                }
+                catch {
+                    // fall through to per-view fetch
+                }
+            }
+            if (typeof dataSource.getView !== 'function')
+                return {};
+            const entries = await Promise.all(ids.map(async (id) => {
+                try {
+                    const v = await dataSource.getView(objectName, id);
+                    return [id, v];
+                }
+                catch {
+                    return [id, null];
+                }
+            }));
+            const map = {};
+            for (const [id, v] of entries) {
+                if (v && typeof v === 'object')
+                    map[id] = v;
+            }
+            return map;
+        };
+        loadBatch().then((map) => {
+            if (!cancelled)
+                setViewOverrides(map);
+        });
+        return () => { cancelled = true; };
+    }, [dataSource, objectName, objectDef.listViews, objectDef.list_views, refreshKey]);
     // Resolve Views from objectDef.listViews (camelCase per @objectstack/spec)
     const views = useMemo(() => {
         // Default column resolution priority:
@@ -371,11 +508,18 @@ export function ObjectView({ dataSource, objects, onEdit }) {
             return [];
         };
         const definedViews = objectDef.listViews || objectDef.list_views || {};
-        const viewList = Object.entries(definedViews).map(([key, value]) => ({
-            id: key,
-            ...value,
-            type: value.type || 'grid'
-        }));
+        const viewList = Object.entries(definedViews).map(([key, value]) => {
+            const override = viewOverrides[key];
+            // Override wins per-key — saved overrides represent user
+            // preferences (density, column widths, etc.) that should
+            // shadow the embedded definition.
+            return {
+                id: key,
+                ...value,
+                ...(override || {}),
+                type: (override?.type) || value.type || 'grid',
+            };
+        });
         if (viewList.length === 0) {
             viewList.push({
                 id: 'all',
@@ -465,7 +609,7 @@ export function ObjectView({ dataSource, objects, onEdit }) {
             return (aSaved.created_at || '').localeCompare(bSaved.created_at || '');
         });
         return viewList;
-    }, [objectDef, savedViews, t]);
+    }, [objectDef, savedViews, viewOverrides, t]);
     // Active View State — merge saved draft if available for this view.
     // Resolution priority: URL viewId → ?view= → user-marked default → first.
     const defaultViewId = useMemo(() => {
@@ -534,7 +678,7 @@ export function ObjectView({ dataSource, objects, onEdit }) {
         }
         catch (err) {
             console.error('[ViewTabBar] Failed to rename view:', err);
-            toast.error('Failed to rename view');
+            toast.error(t('objectViewActions.renameFailed'));
         }
     }, [dataSource, isSavedView, t]);
     // Promise-based confirm/param dialogs — declared early so destructive
@@ -581,7 +725,7 @@ export function ObjectView({ dataSource, objects, onEdit }) {
         }
         catch (err) {
             console.error('[ViewTabBar] Failed to delete view:', err);
-            toast.error('Failed to delete view');
+            toast.error(t('objectViewActions.deleteFailed'));
         }
     }, [dataSource, isSavedView, activeViewId, views, viewId, navigate, t, confirmHandler]);
     const handleDuplicateView = useCallback(async (vid) => {
@@ -696,14 +840,6 @@ export function ObjectView({ dataSource, objects, onEdit }) {
     const handleAddView = useCallback(() => {
         setShowCreateViewDialog(true);
     }, []);
-    // Action system for toolbar operations — refreshKey moved up (declared earlier).
-    const actions = useObjectActions({
-        objectName: objectDef.name,
-        objectLabel: objectDef.label,
-        dataSource,
-        onEdit,
-        onRefresh: () => setRefreshKey(k => k + 1),
-    });
     // ─── ActionProvider handlers for schema-driven toolbar actions ──────
     const currentUser = user
         ? { id: user.id, name: user.name, avatar: user.image }
@@ -714,6 +850,18 @@ export function ObjectView({ dataSource, objects, onEdit }) {
         else
             toast.success(message);
     }, []);
+    // Action system for toolbar operations — refreshKey moved up (declared earlier).
+    // Wired to confirmHandler/toastHandler so deletes use the Shadcn AlertDialog
+    // and Sonner toast instead of native window.confirm.
+    const actions = useObjectActions({
+        objectName: objectDef.name,
+        objectLabel: objectDef.label,
+        dataSource,
+        onEdit,
+        onRefresh: () => setRefreshKey(k => k + 1),
+        onConfirm: confirmHandler,
+        onToast: toastHandler,
+    });
     const navigateHandler = useCallback((url, options) => {
         if (options?.external || options?.newTab) {
             window.open(url, '_blank', 'noopener,noreferrer');
@@ -854,6 +1002,24 @@ export function ObjectView({ dataSource, objects, onEdit }) {
     // Memoize to avoid unstable object identity on every render (stale closure prevention)
     const detailNavigation = useMemo(() => activeView?.navigation ?? objectDef.navigation ?? { mode: 'page' }, [activeView?.navigation, objectDef.navigation]);
     const drawerRecordId = searchParams.get('recordId');
+    /**
+     * URL-derived equality filters in the form `?filter[<field>]=<value>`.
+     * Used by related-list "View All" buttons to scope the destination list
+     * to a single parent record. Emitted as ObjectQL triples (`[field, '=', value]`)
+     * which matches the shape consumed by the list view's data fetcher when
+     * merging base filters.
+     */
+    const urlFilters = useMemo(() => {
+        const out = [];
+        searchParams.forEach((value, key) => {
+            const m = /^filter\[(.+)\]$/.exec(key);
+            if (m && m[1] && value !== '') {
+                out.push([m[1], '=', value]);
+            }
+        });
+        return out;
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [searchParams.toString()]);
     // Memoize onNavigate to prevent stale closure in useNavigationOverlay's handleClick
     const handleNavOverlayNavigate = useCallback((recordId, action) => {
         if (action === 'new_window') {
@@ -933,6 +1099,35 @@ export function ObjectView({ dataSource, objects, onEdit }) {
             // Propagate appearance/view-config properties for live preview
             rowHeight: viewDef.rowHeight ?? listSchema.rowHeight,
             densityMode: viewDef.densityMode ?? listSchema.densityMode,
+            // Hydrate persisted user preferences so they survive reload
+            // (Airtable-style per-view personal config). All four below go
+            // through the same persistViewPatch helper which debounces and
+            // batches concurrent toggles.
+            sort: viewDef.sort ?? listSchema.sort,
+            filter: (() => {
+                const base = viewDef.filter ?? listSchema.filter;
+                if (!urlFilters.length)
+                    return base;
+                const baseArr = Array.isArray(base) ? base : [];
+                return [...baseArr, ...urlFilters];
+            })(),
+            hiddenFields: viewDef.hiddenFields ?? listSchema.hiddenFields,
+            columnState: viewDef.columnState ?? listSchema.columnState,
+            onDensityChange: (mode) => {
+                persistViewPatch(viewDef.id, viewDef, { densityMode: mode });
+            },
+            onSortChange: (sort) => {
+                persistViewPatch(viewDef.id, viewDef, { sort });
+            },
+            onFilterChange: (filter) => {
+                persistViewPatch(viewDef.id, viewDef, { filter });
+            },
+            onHiddenFieldsChange: (hidden) => {
+                persistViewPatch(viewDef.id, viewDef, { hiddenFields: hidden });
+            },
+            onColumnStateChange: (state) => {
+                persistViewPatch(viewDef.id, viewDef, { columnState: state });
+            },
             inlineEdit: viewDef.inlineEdit ?? viewDef.editRecordsInline ?? listSchema.inlineEdit,
             appearance: viewDef.showDescription != null
                 ? { showDescription: viewDef.showDescription }
@@ -966,7 +1161,6 @@ export function ObjectView({ dataSource, objects, onEdit }) {
             searchableFields: viewDef.searchableFields ?? listSchema.searchableFields,
             filterableFields: viewDef.filterableFields ?? listSchema.filterableFields,
             resizable: viewDef.resizable ?? listSchema.resizable,
-            hiddenFields: viewDef.hiddenFields ?? listSchema.hiddenFields,
             rowActions: viewDef.rowActions ?? listSchema.rowActions,
             bulkActions: viewDef.bulkActions ?? listSchema.bulkActions,
             sharing: viewDef.sharing ?? listSchema.sharing,
@@ -981,7 +1175,13 @@ export function ObjectView({ dataSource, objects, onEdit }) {
             aria: viewDef.aria ?? listSchema.aria,
             tabs: listSchema.tabs,
             // Propagate filter/sort as default filters/sort for data flow
-            ...(viewDef.filter?.length ? { filters: viewDef.filter } : {}),
+            ...((() => {
+                const combined = [
+                    ...(Array.isArray(viewDef.filter) ? viewDef.filter : []),
+                    ...urlFilters,
+                ];
+                return combined.length ? { filters: combined } : {};
+            })()),
             ...(viewDef.sort?.length ? { sort: viewDef.sort } : {}),
             options: {
                 kanban: {
@@ -1040,10 +1240,40 @@ export function ObjectView({ dataSource, objects, onEdit }) {
                 },
             },
         };
-        return (_jsx(ListView, { schema: fullSchema, className: className, onEdit: editHandler, onRowClick: (record) => {
+        return (_jsx(ListView, { schema: fullSchema, className: className, onEdit: editHandler, onDelete: (record) => {
+                if (record?.id != null) {
+                    // useObjectActions.deleteRecord wraps execute() which
+                    // already shows a confirmation dialog + success toast
+                    // and triggers onRefresh on success.
+                    actions.deleteRecord(String(record.id));
+                }
+            }, onBulkDelete: (records) => {
+                const valid = records.filter((r) => r?.id != null);
+                if (valid.length === 0)
+                    return;
+                // Route through actions.execute so the shared AlertDialog
+                // confirms once for the whole batch and the existing
+                // delete handler (now batch-aware) handles refresh + toast.
+                actions.execute({
+                    type: 'delete',
+                    confirmText: t('console.objectView.bulkDeleteConfirm', {
+                        count: valid.length,
+                        defaultValue: `Delete ${valid.length} selected records? This cannot be undone.`,
+                    }),
+                    params: { records: valid },
+                });
+            }, onRowClick: (record) => {
                 navOverlay.handleClick(record);
+            }, onSortChange: (sort) => {
+                persistViewPatch(viewDef.id, viewDef, { sort });
+            }, onFilterChange: (filter) => {
+                persistViewPatch(viewDef.id, viewDef, { filter });
+            }, onHiddenFieldsChange: (hidden) => {
+                persistViewPatch(viewDef.id, viewDef, { hiddenFields: hidden });
+            }, onColumnStateChange: (state) => {
+                persistViewPatch(viewDef.id, viewDef, { columnState: state });
             }, dataSource: ds }, key));
-    }, [activeView, objectDef, objectName, refreshKey, navOverlay]);
+    }, [activeView, objectDef, objectName, refreshKey, navOverlay, actions, persistViewPatch, urlFilters]);
     // Memoize the merged views array so PluginObjectView doesn't get a new
     // reference on every render (which would trigger unnecessary data refetches).
     const mergedViews = useMemo(() => views.map((v) => v.id === activeViewId && viewDraft && viewDraft.id === v.id
@@ -1080,13 +1310,37 @@ export function ObjectView({ dataSource, objects, onEdit }) {
             }
         },
     }), [objectDef.name, onEdit, activeView?.showSearch, activeView?.showFilters, activeView?.showSort, navigate, viewId, isAdmin]);
-    return (_jsxs(ActionProvider, { context: { objectName: objectDef.name, user: currentUser }, onConfirm: confirmHandler, onToast: toastHandler, onNavigate: navigateHandler, onParamCollection: paramCollectionHandler, handlers: { api: apiHandler, flow: flowHandler, script: serverActionHandler, modal: serverActionHandler }, children: [_jsxs("div", { className: "h-full flex flex-col bg-background min-w-0 overflow-hidden", children: [_jsxs("div", { className: "flex justify-between items-center py-2.5 sm:py-3 px-3 sm:px-4 border-b shrink-0 bg-background z-10", children: [_jsxs("div", { className: "flex items-center gap-2 sm:gap-3 min-w-0 flex-1", children: [_jsx("div", { className: "bg-primary/10 p-1.5 sm:p-2 rounded-md shrink-0", children: (() => { const I = getIcon(objectDef?.icon); return _jsx(I, { className: "h-4 w-4 text-primary" }); })() }), _jsxs("div", { className: "min-w-0", children: [_jsx("h1", { className: "text-base sm:text-lg font-semibold tracking-tight text-foreground truncate", children: objectLabel(objectDef) }), objectDef.description && (_jsx("p", { className: "text-xs text-muted-foreground truncate hidden sm:block max-w-md", children: objectDesc(objectDef) }))] })] }), _jsxs("div", { className: "flex items-center gap-1.5 sm:gap-2 shrink-0", children: [can(objectDef.name, 'create') && (_jsxs(Button, { size: "sm", onClick: actions.create, className: "shadow-none gap-1.5 sm:gap-2 h-8 sm:h-9", children: [_jsx(Plus, { className: "h-4 w-4" }), _jsx("span", { className: "hidden sm:inline", children: t('console.objectView.new') })] })), objectDef.actions?.some((a) => a.locations?.includes('list_toolbar')) && (_jsx(SchemaRenderer, { schema: {
-                                            type: 'action:bar',
-                                            location: 'list_toolbar',
-                                            actions: objectDef.actions,
-                                            size: 'sm',
-                                            variant: 'outline',
-                                        } }))] })] }), views.length >= 1 && (() => {
+    return (_jsxs(ActionProvider, { context: { objectName: objectDef.name, user: currentUser }, onConfirm: confirmHandler, onToast: toastHandler, onNavigate: navigateHandler, onParamCollection: paramCollectionHandler, handlers: { api: apiHandler, flow: flowHandler, script: serverActionHandler, modal: serverActionHandler }, children: [_jsxs("div", { className: "h-full flex flex-col bg-background min-w-0 overflow-hidden", children: [_jsx(PageHeader, { title: objectLabel(objectDef), description: objectDef.description ? objectDesc(objectDef) : undefined, icon: (() => { const I = getIcon(objectDef?.icon); return _jsx(I, { className: "h-4 w-4" }); })(), actions: _jsxs(_Fragment, { children: [can(objectDef.name, 'create') && (_jsxs(Button, { size: "sm", onClick: actions.create, className: "shadow-none gap-1.5 sm:gap-2 h-8 sm:h-9", children: [_jsx(Plus, { className: "h-4 w-4" }), _jsx("span", { className: "hidden sm:inline", children: t('console.objectView.new') })] })), can(objectDef.name, 'create') && (_jsxs(Button, { size: "sm", variant: "outline", onClick: () => setShowImport(true), className: "shadow-none gap-1.5 sm:gap-2 h-8 sm:h-9", title: t('console.objectView.importTitle'), "data-testid": "object-view-import-button", children: [_jsx(Upload, { className: "h-4 w-4" }), _jsx("span", { className: "hidden sm:inline", children: t('console.objectView.import') })] })), objectDef.actions?.some((a) => a.locations?.includes('list_toolbar')) && (_jsx(SchemaRenderer, { schema: {
+                                        type: 'action:bar',
+                                        location: 'list_toolbar',
+                                        actions: (objectDef.actions || []).map((a) => ({
+                                            ...a,
+                                            label: actionLabel(objectDef.name, a.name, a.label || a.name),
+                                            ...(a.confirmText !== undefined && {
+                                                confirmText: actionConfirm(objectDef.name, a.name, a.confirmText),
+                                            }),
+                                            ...(a.successMessage !== undefined && {
+                                                successMessage: actionSuccess(objectDef.name, a.name, a.successMessage),
+                                            }),
+                                        })),
+                                        size: 'sm',
+                                        variant: 'outline',
+                                    } }))] }) }), showImport && (_jsx(Suspense, { fallback: null, children: _jsx(ImportWizard, { open: showImport, onOpenChange: setShowImport, objectName: objectDef.name, objectLabel: objectLabel(objectDef), fields: Object.entries(objectDef.fields || {}).map(([name, def]) => ({
+                                name,
+                                label: def?.label || name,
+                                type: def?.type || 'text',
+                                required: !!def?.required,
+                            })), dataSource: dataSource, onComplete: (result) => {
+                                setRefreshKey(k => k + 1);
+                                const ok = result.importedRows;
+                                const skip = result.skippedRows;
+                                if (skip > 0) {
+                                    toast.warning(t('console.objectView.importedWithSkipped', { ok, skipped: skip }));
+                                }
+                                else if (ok > 0) {
+                                    toast.success(t('console.objectView.importedToast', { count: ok }));
+                                }
+                            } }) })), views.length >= 1 && (() => {
                         const viewTabItems = views.map((view) => {
                             const saved = savedViews.find((sv) => (sv.id || sv._id) === view.id);
                             // System views (loaded from objectDef.listViews / metadata) are
@@ -1095,7 +1349,7 @@ export function ObjectView({ dataSource, objects, onEdit }) {
                             const isSystem = !saved;
                             return {
                                 id: view.id,
-                                label: view.label,
+                                label: viewLabel(objectDef.name, view.name || view.id, view.label || view.name || view.id),
                                 type: view.type,
                                 hasActiveFilters: Array.isArray(view.filter) && view.filter.length > 0,
                                 hasActiveSort: Array.isArray(view.sort) && view.sort.length > 0,
@@ -1116,14 +1370,14 @@ export function ObjectView({ dataSource, objects, onEdit }) {
                                         showVisibilityGroups: true,
                                     }, onAddView: isAdmin ? handleAddView : undefined, onRenameView: isAdmin ? handleRenameView : undefined, onDeleteView: isAdmin ? handleDeleteView : undefined, onDuplicateView: isAdmin ? handleDuplicateView : undefined, onPinView: isAdmin ? handlePinView : undefined, onSetDefaultView: isAdmin ? handleSetDefaultView : undefined, onConfigView: isAdmin ? handleConfigView : undefined, onManageViews: isAdmin ? () => setManageViewsOpen(true) : undefined }), isAdmin && (_jsx(ManageViewsDialog, { open: manageViewsOpen, onOpenChange: setManageViewsOpen, views: viewTabItems, activeViewId: activeViewId, viewTypeIcons: VIEW_TYPE_ICONS, onRename: handleRenameView, onDelete: handleDeleteView, onDuplicate: handleDuplicateView, onSetDefault: handleSetDefaultView, onSetPinned: handlePinView, onReorder: handleReorderViews, onAddView: handleAddView, onConfigView: handleConfigView }))] }));
                     })(), _jsxs("div", { className: "flex-1 overflow-hidden relative flex flex-row", children: [navOverlay.mode === 'split' && navOverlay.isOpen ? (_jsx(NavigationOverlay, { ...navOverlay, setIsOpen: (open) => { if (!open)
-                                    handleDrawerClose(); }, title: objectLabel(objectDef), mainContent: _jsxs("div", { className: "flex-1 min-w-0 relative h-full flex flex-col", children: [_jsx("div", { className: "flex-1 relative overflow-auto p-3 sm:p-4", children: _jsx(PluginObjectView, { schema: objectViewSchema, dataSource: dataSource, views: mergedViews, activeViewId: activeViewId, onViewChange: handleViewChange, onEdit: (record) => onEdit?.(record), onRowClick: (record) => {
-                                                    navOverlay.handleClick(record);
-                                                }, renderListView: renderListView, onCreateView: handleCreateView, onViewAction: handleViewAction }) }), typeof recordCount === 'number' && (_jsx("div", { "data-testid": "record-count-footer", className: "border-t px-3 sm:px-4 py-1.5 text-xs text-muted-foreground bg-muted/5 shrink-0", children: t('console.objectView.recordCount', { count: recordCount }) }))] }), children: (record) => {
+                                    handleDrawerClose(); }, title: objectLabel(objectDef), mainContent: _jsxs("div", { className: "flex-1 min-w-0 relative h-full flex flex-col", children: [_jsx("div", { className: "flex-1 relative overflow-hidden p-3 sm:p-4", children: _jsx("div", { className: "h-full overflow-auto rounded-lg border bg-card shadow-xs", children: _jsx(PluginObjectView, { schema: objectViewSchema, dataSource: dataSource, views: mergedViews, activeViewId: activeViewId, onViewChange: handleViewChange, onEdit: (record) => onEdit?.(record), onRowClick: (record) => {
+                                                        navOverlay.handleClick(record);
+                                                    }, renderListView: renderListView, onCreateView: handleCreateView, onViewAction: handleViewAction }) }) }), typeof recordCount === 'number' && (_jsx("div", { "data-testid": "record-count-footer", className: "border-t px-3 sm:px-4 py-1.5 text-xs text-muted-foreground bg-muted/5 shrink-0", children: t('console.objectView.recordCount', { count: recordCount }) }))] }), children: (record) => {
                                     const recordId = (record.id || record._id);
                                     return (_jsx(DrawerDetailContent, { objectDef: objectDef, recordId: recordId, dataSource: dataSource, onEdit: onEdit }));
-                                } })) : (_jsx("div", { className: "flex-1 min-w-0 relative h-full flex flex-col", children: _jsx("div", { className: "flex-1 relative overflow-auto p-3 sm:p-4", children: _jsx(PluginObjectView, { schema: objectViewSchema, dataSource: dataSource, views: mergedViews, activeViewId: activeViewId, onViewChange: handleViewChange, onEdit: (record) => onEdit?.(record), onRowClick: (record) => {
-                                            navOverlay.handleClick(record);
-                                        }, renderListView: renderListView, onCreateView: handleCreateView, onViewAction: handleViewAction }) }) })), _jsx(MetadataPanel, { open: showDebug && isAdmin, sections: [
+                                } })) : (_jsx("div", { className: "flex-1 min-w-0 relative h-full flex flex-col", children: _jsx("div", { className: "flex-1 relative overflow-hidden p-3 sm:p-4", children: _jsx("div", { className: "h-full overflow-auto rounded-lg border bg-card shadow-xs", children: _jsx(PluginObjectView, { schema: objectViewSchema, dataSource: dataSource, views: mergedViews, activeViewId: activeViewId, onViewChange: handleViewChange, onEdit: (record) => onEdit?.(record), onRowClick: (record) => {
+                                                navOverlay.handleClick(record);
+                                            }, renderListView: renderListView, onCreateView: handleCreateView, onViewAction: handleViewAction }) }) }) })), _jsx(MetadataPanel, { open: showDebug && isAdmin, sections: [
                                     { title: 'View Configuration', data: activeView },
                                     { title: 'Object Definition', data: objectDef },
                                 ] }), _jsx("div", { "data-testid": "view-config-panel-wrapper", className: `transition-[max-width,opacity] duration-300 ease-in-out overflow-hidden ${showViewConfigPanel && isAdmin ? 'max-w-[280px] opacity-100' : 'max-w-0 opacity-0'}`, children: _jsx(ViewConfigPanel, { open: showViewConfigPanel && isAdmin, onClose: () => { setShowViewConfigPanel(false); setViewConfigPanelMode('edit'); }, mode: viewConfigPanelMode, activeView: activeView, objectDef: objectDef, recordCount: recordCount, onSave: handleViewConfigSave, onViewUpdate: handleViewUpdate, onCreate: handleViewCreate }) }), _jsx(CreateViewDialog, { open: showCreateViewDialog && isAdmin, onOpenChange: setShowCreateViewDialog, existingLabels: views.map((v) => v.label).filter(Boolean), objectDef: objectDef, onCreate: (cfg) => handleViewCreate(cfg) })] }), navOverlay.mode !== 'split' && (_jsx(NavigationOverlay, { ...navOverlay, setIsOpen: (open) => { if (!open)

package/dist/views/PageView.js

@@ -9,11 +9,13 @@ import { useParams, useSearchParams } from 'react-router-dom';
 import { SchemaRenderer } from '@object-ui/react';
 import { Empty, EmptyTitle, EmptyDescription } from '@object-ui/components';
 import { FileText, Pencil } from 'lucide-react';
+import { useObjectTranslation } from '@object-ui/i18n';
 import { MetadataPanel, useMetadataInspector } from './MetadataInspector';
 import { useMetadata } from '../providers/MetadataProvider';
 import { DesignDrawer } from './DesignDrawer';
 const PageCanvasEditor = lazy(() => import('@object-ui/plugin-designer').then((m) => ({ default: m.PageCanvasEditor })));
 export function PageView() {
+    const { t } = useObjectTranslation();
     const { pageName } = useParams();
     const [searchParams] = useSearchParams();
     const { showDebug } = useMetadataInspector();
@@ -35,7 +37,7 @@ export function PageView() {
         }
     }, []);
     if (!page) {
-        return (_jsx("div", { className: "h-full flex items-center justify-center p-8", children: _jsxs(Empty, { children: [_jsx("div", { className: "mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-muted", children: _jsx(FileText, { className: "h-6 w-6 text-muted-foreground" }) }), _jsx(EmptyTitle, { children: "Page Not Found" }), _jsxs(EmptyDescription, { children: ["The page \"", pageName, "\" could not be found. It may have been removed or renamed."] })] }) }));
+        return (_jsx("div", { className: "h-full flex items-center justify-center p-8", children: _jsxs(Empty, { children: [_jsx("div", { className: "mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-muted", children: _jsx(FileText, { className: "h-6 w-6 text-muted-foreground" }) }), _jsx(EmptyTitle, { children: t('empty.pageNotFound') }), _jsx(EmptyDescription, { children: t('empty.pageNotFoundDescription', { name: pageName }) })] }) }));
     }
     // Convert URL search params to an object for the page context
     const params = Object.fromEntries(searchParams.entries());