@djangocfg/layouts 2.1.217 → 2.1.218

package/README.md

@@ -49,6 +49,7 @@ export default function RootLayout({ children }) {
 - **PwaProvider** - PWA installation (optional)
 - **ErrorTrackingProvider** - Error handling and tracking
 - **ErrorBoundary** - React error boundary
+- **MonitorProvider** - Frontend error monitoring via `@djangocfg/monitor` (optional)
 - **MCP Chat Widget** - AI chat assistant (optional)
 
 **Global components:**
@@ -104,6 +105,22 @@ export default function RootLayout({ children }) {
 }
 ```
 
+**Monitor prop** — pass `monitor` to enable frontend error monitoring (installs `window.monitor` in DevTools):
+
+```tsx
+<AppLayout
+  monitor={{
+    project: 'my-app',
+    environment: process.env.NODE_ENV,
+  }}
+  // ...
+>
+  {children}
+</AppLayout>
+```
+
+After mount, `window.monitor.error(...)`, `.warn(...)`, `.flush()`, `.status()` are available in the browser console.
+
 **Layout priority:** Admin → Private → Public → Fallback
 
 **noLayoutPaths:** Paths that render without any layout wrapper. Useful for fullscreen pages (terminal, embed, print). Providers (auth, theme, centrifugo) are still applied.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@djangocfg/layouts",
-  "version": "2.1.217",
+  "version": "2.1.218",
   "description": "Simple, straightforward layout components for Next.js - import and use with props",
   "keywords": [
     "layouts",
@@ -74,13 +74,13 @@
     "check": "tsc --noEmit"
   },
   "peerDependencies": {
-    "@djangocfg/api": "^2.1.217",
-    "@djangocfg/centrifugo": "^2.1.217",
-    "@djangocfg/i18n": "^2.1.217",
-    "@djangocfg/monitor": "^2.1.217",
-    "@djangocfg/ui-core": "^2.1.217",
-    "@djangocfg/ui-nextjs": "^2.1.217",
-    "@djangocfg/ui-tools": "^2.1.217",
+    "@djangocfg/api": "^2.1.218",
+    "@djangocfg/centrifugo": "^2.1.218",
+    "@djangocfg/i18n": "^2.1.218",
+    "@djangocfg/monitor": "^2.1.218",
+    "@djangocfg/ui-core": "^2.1.218",
+    "@djangocfg/ui-nextjs": "^2.1.218",
+    "@djangocfg/ui-tools": "^2.1.218",
     "@hookform/resolvers": "^5.2.2",
     "consola": "^3.4.2",
     "lucide-react": "^0.545.0",
@@ -108,14 +108,14 @@
     "uuid": "^11.1.0"
   },
   "devDependencies": {
-    "@djangocfg/api": "^2.1.217",
-    "@djangocfg/i18n": "^2.1.217",
-    "@djangocfg/centrifugo": "^2.1.217",
-    "@djangocfg/monitor": "^2.1.217",
-    "@djangocfg/typescript-config": "^2.1.217",
-    "@djangocfg/ui-core": "^2.1.217",
-    "@djangocfg/ui-nextjs": "^2.1.217",
-    "@djangocfg/ui-tools": "^2.1.217",
+    "@djangocfg/api": "^2.1.218",
+    "@djangocfg/i18n": "^2.1.218",
+    "@djangocfg/centrifugo": "^2.1.218",
+    "@djangocfg/monitor": "^2.1.218",
+    "@djangocfg/typescript-config": "^2.1.218",
+    "@djangocfg/ui-core": "^2.1.218",
+    "@djangocfg/ui-nextjs": "^2.1.218",
+    "@djangocfg/ui-tools": "^2.1.218",
     "@types/node": "^24.7.2",
     "@types/react": "^19.1.0",
     "@types/react-dom": "^19.1.0",

package/src/layouts/AppLayout/AppLayout.tsx

@@ -50,6 +50,7 @@ import type {
   PwaInstallConfig,
 } from '../types';
 import type { AuthConfig } from '@djangocfg/api/auth';
+import type { MonitorConfig } from '@djangocfg/monitor';
 
 export type LayoutMode = 'public' | 'private' | 'admin';
 
@@ -135,6 +136,9 @@ export interface AppLayoutProps {
 
   /** i18n configuration for locale switching (applies to all layouts) */
   i18n?: I18nLayoutConfig;
+
+  /** Monitor configuration — initialises window.monitor + auto-captures JS errors & console */
+  monitor?: MonitorConfig;
 }
 
 /**
@@ -256,6 +260,7 @@ export function AppLayout(props: AppLayoutProps) {
     swr,
     mcpChat,
     pwaInstall,
+    monitor,
   } = props;
 
   return (
@@ -269,6 +274,7 @@ export function AppLayout(props: AppLayoutProps) {
       swr={swr}
       mcpChat={mcpChat}
       pwaInstall={pwaInstall}
+      monitor={monitor}
     >
       <AppLayoutContent {...props} />
     </BaseApp>

package/src/layouts/AppLayout/BaseApp.tsx

@@ -42,6 +42,7 @@ import dynamic from 'next/dynamic';
 import NextTopLoader from 'nextjs-toploader';
 import { SWRConfig } from 'swr';
 
+import { MonitorProvider } from '@djangocfg/monitor/client';
 import { getCentrifugoAuthTokenRetrieve } from '@djangocfg/api';
 import { AuthProvider } from '@djangocfg/api/auth';
 import { CentrifugoProvider } from '@djangocfg/centrifugo';
@@ -84,6 +85,7 @@ export function BaseApp({
   swr,
   mcpChat,
   pwaInstall,
+  monitor,
 }: BaseAppProps) {
   // ErrorBoundary is enabled by default
   const enableErrorBoundary = errorBoundary?.enabled !== false;
@@ -128,6 +130,7 @@ export function BaseApp({
                     network={errorTracking?.network}
                     onError={errorTracking?.onError}
                   >
+                    {monitor && <MonitorProvider {...monitor} />}
                     {children}
                     <NextTopLoader
                       color="hsl(var(--primary))"

package/src/layouts/types/layout.types.ts

@@ -14,6 +14,7 @@ import type { ErrorBoundaryConfig, ErrorTrackingConfig } from '../../components/
 
 // Import local provider configs
 import type { ThemeConfig, SWRConfigOptions, McpChatConfig, CentrifugoConfig } from './providers.types';
+import type { MonitorConfig } from '@djangocfg/monitor';
 
 // ============================================================================
 // Base Layout Props
@@ -54,4 +55,7 @@ export interface BaseLayoutProps {
 
   /** PWA Install configuration (from snippets/PWAInstall) */
   pwaInstall?: PwaInstallConfig;
+
+  /** Monitor configuration — initialises window.monitor + auto-captures JS errors & console */
+  monitor?: MonitorConfig;
 }