@object-ui/app-shell 6.2.3 → 7.1.0

package/dist/views/PageView.d.ts

@@ -1,6 +1,11 @@
 /**
  * Page View Component
- * Renders a custom page based on the pageName parameter.
- * Edit opens a right-side drawer with PageCanvasEditor for real-time preview.
+ *
+ * Renders a custom page based on the pageName parameter. Page *authoring*
+ * happens in the metadata studio (canvas + inspector), not here — runtime is
+ * pure rendering. For parity with the view/report/dashboard runtime editors,
+ * admins get a lightweight "Edit in studio" affordance that deep-links to the
+ * page's studio editor (`/apps/:app/metadata/page/:name`) rather than
+ * embedding the heavyweight page canvas in the runtime.
  */
-export declare function PageView(): import("react/jsx-runtime").JSX.Element;
+export declare function PageView(): import("react").JSX.Element;

package/dist/views/PageView.js

@@ -1,51 +1,64 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * Page View Component
- * Renders a custom page based on the pageName parameter.
- * Edit opens a right-side drawer with PageCanvasEditor for real-time preview.
+ *
+ * Renders a custom page based on the pageName parameter. Page *authoring*
+ * happens in the metadata studio (canvas + inspector), not here — runtime is
+ * pure rendering. For parity with the view/report/dashboard runtime editors,
+ * admins get a lightweight "Edit in studio" affordance that deep-links to the
+ * page's studio editor (`/apps/:app/metadata/page/:name`) rather than
+ * embedding the heavyweight page canvas in the runtime.
  */
-import { useState, useCallback, lazy, Suspense } from 'react';
-import { useParams, useSearchParams } from 'react-router-dom';
-import { SchemaRenderer } from '@object-ui/react';
+import { useState } from 'react';
+import { useParams, useSearchParams, useNavigate, useLocation } from 'react-router-dom';
+import { SchemaRenderer, useAdapter } 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 { useAuth } from '@object-ui/auth';
 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 })));
+import { useExpressionContext } from '../providers/ExpressionProvider';
+import { preferLocal } from '../utils/preferLocal';
+import { ConsoleActionRuntimeProvider } from '../hooks/useConsoleActionRuntime';
+import { InterfaceListPage } from './InterfaceListPage';
 export function PageView() {
     const { t } = useObjectTranslation();
     const { pageName } = useParams();
     const [searchParams] = useSearchParams();
     const { showDebug } = useMetadataInspector();
-    const [drawerOpen, setDrawerOpen] = useState(false);
-    // Find page definition from API-driven metadata
-    const { pages } = useMetadata();
-    const page = pages?.find((p) => p.name === pageName);
-    // Local schema state for live preview — initialized from metadata
-    const [editSchema, setEditSchema] = useState(null);
-    const handleOpenDrawer = useCallback(() => {
-        // Snapshot the current page definition as starting schema
-        setEditSchema(page);
-        setDrawerOpen(true);
-    }, [page]);
-    const handleCloseDrawer = useCallback((open) => {
-        setDrawerOpen(open);
-        if (!open) {
-            // Drawer closed — keep the latest saved schema (already persisted via auto-save)
-        }
-    }, []);
+    const navigate = useNavigate();
+    const location = useLocation();
+    // Editing a page mutates the shared metadata definition, so the entry point
+    // is admin-only (mirrors the view/report/dashboard runtime editors).
+    const { user } = useAuth();
+    const isAdmin = user?.role === 'admin';
+    const { pages, objects } = useMetadata();
+    // ADR-0048 Phase 2 — prefer the page owned by the current app's package so
+    // two packages shipping `page/<same-name>` each resolve within their own
+    // container instead of by load order.
+    const { app: activeApp } = useExpressionContext();
+    const dataSource = useAdapter();
+    // Bumped after a successful page action so embedded data (lists, etc.)
+    // re-fetch. Threaded into the page context AND used to remount the renderer.
+    const [refreshKey, setRefreshKey] = useState(0);
+    const page = preferLocal(pages, pageName, activeApp?._packageId);
     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: 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());
-    // Use the live-edited schema for preview when the drawer is open
-    const previewSchema = drawerOpen && editSchema ? editSchema : page;
-    return (_jsxs("div", { className: "flex flex-row h-full w-full overflow-hidden relative", children: [_jsxs("div", { className: "flex-1 overflow-auto h-full relative group", children: [_jsx("div", { className: `absolute top-1.5 sm:top-2 right-1.5 sm:right-2 z-50 flex items-center gap-1.5 transition-opacity ${showDebug ? 'opacity-100' : 'opacity-0 group-hover:opacity-100'}`, children: _jsxs("button", { type: "button", onClick: handleOpenDrawer, className: "inline-flex items-center gap-1.5 rounded-md border border-input bg-background px-2.5 py-1.5 text-xs font-medium text-muted-foreground shadow-sm hover:bg-accent hover:text-accent-foreground", "data-testid": "page-edit-button", children: [_jsx(Pencil, { className: "h-3.5 w-3.5" }), "Edit"] }) }), _jsx(SchemaRenderer, { schema: {
-                            ...previewSchema,
-                            type: previewSchema.type || 'page',
-                            context: { ...previewSchema.context, params }
-                        } })] }), _jsx(MetadataPanel, { open: showDebug, sections: [{ title: 'Page Configuration', data: previewSchema }] }), _jsx(DesignDrawer, { open: drawerOpen, onOpenChange: handleCloseDrawer, title: `Edit Page: ${page.label || page.title || pageName}`, schema: editSchema || page, onSchemaChange: setEditSchema, collection: "sys_page", recordName: pageName, children: (schema, onChange) => (_jsx(Suspense, { fallback: _jsx("div", { className: "p-4 text-muted-foreground", children: "Loading editor\u2026" }), children: _jsx(PageCanvasEditor, { schema: schema, onChange: onChange }) })) })] }));
+    // Resolve the app slug from the path (`/apps/:app/page/:name`) so the deep
+    // link survives whatever Router basename the host mounts under.
+    const appName = location.pathname.match(/\/apps\/([^/]+)/)?.[1];
+    const canEditInStudio = isAdmin && !!appName && !!pageName;
+    const openInStudio = () => {
+        if (!canEditInStudio)
+            return;
+        navigate(`/apps/${appName}/metadata/page/${encodeURIComponent(pageName)}`);
+    };
+    return (_jsx(ConsoleActionRuntimeProvider, { dataSource: dataSource, objects: objects, onRefresh: () => setRefreshKey((k) => k + 1), children: _jsxs("div", { className: "flex flex-row h-full w-full overflow-hidden relative", children: [_jsxs("div", { className: "flex-1 overflow-auto h-full relative", children: [canEditInStudio && (_jsx("button", { type: "button", onClick: openInStudio, className: "absolute right-3 top-3 z-30 inline-flex h-7 w-7 items-center justify-center rounded-md border border-input bg-background/90 text-muted-foreground shadow-sm backdrop-blur hover:bg-accent hover:text-accent-foreground", "data-testid": "page-edit-in-studio-button", title: t('common.editInStudio', { defaultValue: 'Edit in studio' }), "aria-label": t('common.editInStudio', { defaultValue: 'Edit in studio' }), children: _jsx(Pencil, { className: "h-3.5 w-3.5" }) })), page.interfaceConfig?.source ? (_jsx(InterfaceListPage, { page: page, reserveEditAffordance: canEditInStudio }, refreshKey)) : (_jsx(SchemaRenderer, { schema: {
+                                ...page,
+                                type: page.type || 'page',
+                                context: { ...page.context, params, refreshKey },
+                            } }, refreshKey))] }), _jsx(MetadataPanel, { open: showDebug, sections: [{ title: 'Page Configuration', data: page }] })] }) }));
 }

package/dist/views/RecordDetailView.d.ts

@@ -29,5 +29,5 @@ interface RecordDetailViewProps {
      */
     embedded?: boolean;
 }
-export declare function RecordDetailView({ dataSource, objects, onEdit, objectNameOverride, recordIdOverride, embedded }: RecordDetailViewProps): import("react/jsx-runtime").JSX.Element;
+export declare function RecordDetailView({ dataSource, objects, onEdit, objectNameOverride, recordIdOverride, embedded }: RecordDetailViewProps): import("react").JSX.Element;
 export {};