@djangocfg/layouts 2.1.241 → 2.1.243

package/README.md

@@ -69,7 +69,7 @@ export default function RootLayout({ children }) {
 
 **Included automatically:**
 - ThemeProvider, TooltipProvider, SWRConfig, DialogProvider
-- AuthProvider + AuthDialog
+- AuthProvider + AuthDialog (via zustand `dialogStore`, triggered by `window.dialog.auth()`)
 - AnalyticsProvider, CentrifugoProvider
 - PwaProvider (from `@djangocfg/ui-nextjs/pwa`)
 - ErrorTrackingProvider, ErrorBoundary

package/package.json

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

package/src/snippets/AuthDialog/AuthDialog.tsx

@@ -1,22 +1,14 @@
 'use client';
 
 import { LogIn } from 'lucide-react';
-import React, { useMemo, useState } from 'react';
+import React, { useMemo } from 'react';
 
 import { useCfgRouter } from '@djangocfg/api/auth';
 import { useAppT } from '@djangocfg/i18n';
 import {
     Button, Dialog, DialogContent, DialogHeader, DialogTitle
 } from '@djangocfg/ui-core/components';
-import { useEventListener } from '@djangocfg/ui-core';
-
-// Re-export events for backwards compatibility
-export const DIALOG_EVENTS = {
-  OPEN_AUTH_DIALOG: 'OPEN_AUTH_DIALOG',
-  CLOSE_AUTH_DIALOG: 'CLOSE_AUTH_DIALOG',
-  AUTH_SUCCESS: 'AUTH_SUCCESS',
-  AUTH_FAILURE: 'AUTH_FAILURE',
-} as const;
+import { useDialogStore } from '@djangocfg/ui-core/lib/dialog-service';
 
 interface AuthDialogProps {
   onAuthRequired?: () => void;
@@ -27,7 +19,9 @@ export const AuthDialog: React.FC<AuthDialogProps> = ({
   onAuthRequired,
   authPath = '/auth'
 }) => {
-  const [open, setOpen] = useState(false);
+  const open = useDialogStore((s) => s.authOpen);
+  const authOptions = useDialogStore((s) => s.authOptions);
+  const resolveAuth = useDialogStore((s) => s.resolveAuth);
   const t = useAppT();
 
   const labels = useMemo(() => ({
@@ -36,31 +30,17 @@ export const AuthDialog: React.FC<AuthDialogProps> = ({
     goToSignIn: t('layouts.auth.goToSignIn'),
   }), [t]);
 
-  const [message, setMessage] = useState<string>(labels.pleaseSignIn);
+  const message = authOptions?.message || labels.pleaseSignIn;
   const router = useCfgRouter();
 
-  // Listen for open auth dialog event
-  useEventListener(DIALOG_EVENTS.OPEN_AUTH_DIALOG, (payload: any) => {
-    if (payload?.message) {
-      setMessage(payload.message);
-    }
-    setOpen(true);
-  });
-
-  // Listen for close auth dialog event
-  useEventListener(DIALOG_EVENTS.CLOSE_AUTH_DIALOG, () => {
-    setOpen(false);
-  });
-
   const handleClose = () => {
-    setMessage(labels.pleaseSignIn);
-    setOpen(false);
+    resolveAuth(false);
   };
 
   const handleGoToAuth = () => {
-    // Save current URL for redirect after successful auth
     if (typeof window !== 'undefined') {
-      sessionStorage.setItem('redirectAfterAuth', window.location.pathname);
+      const redirect = authOptions?.redirectUrl || window.location.pathname;
+      sessionStorage.setItem('redirectAfterAuth', redirect);
     }
 
     if (onAuthRequired) {
@@ -69,11 +49,11 @@ export const AuthDialog: React.FC<AuthDialogProps> = ({
       router.push(authPath);
     }
 
-    handleClose();
+    resolveAuth(true);
   };
 
   return (
-    <Dialog open={open} onOpenChange={handleClose}>
+    <Dialog open={open} onOpenChange={(isOpen) => { if (!isOpen) handleClose(); }}>
       <DialogContent className="max-w-sm">
         <DialogHeader>
           <DialogTitle>{labels.authRequired}</DialogTitle>

package/src/snippets/AuthDialog/events.ts

@@ -1,21 +1 @@
-export const AUTH_EVENTS = {
-  OPEN_AUTH_DIALOG: 'OPEN_AUTH_DIALOG',
-  CLOSE_AUTH_DIALOG: 'CLOSE_AUTH_DIALOG',
-  AUTH_SUCCESS: 'AUTH_SUCCESS',
-  AUTH_FAILURE: 'AUTH_FAILURE',
-} as const;
-
-export type AuthEventType = typeof AUTH_EVENTS[keyof typeof AUTH_EVENTS];
-
-export interface OpenAuthDialogPayload {
-  message?: string;
-  redirectUrl?: string;
-}
-
-export interface AuthSuccessPayload {
-  user?: any;
-}
-
-export interface AuthFailurePayload {
-  error?: string;
-}
+export type { AuthDialogOptions } from '@djangocfg/ui-core/lib/dialog-service';

package/src/snippets/AuthDialog/index.ts

@@ -1,3 +1,3 @@
-export { AuthDialog, DIALOG_EVENTS } from './AuthDialog';
+export { AuthDialog } from './AuthDialog';
 export * from './events';
-export { useAuthDialog } from './useAuthDialog';
+export { useAuthDialog } from './useAuthDialog';

package/src/snippets/AuthDialog/useAuthDialog.ts

@@ -1,26 +1,30 @@
-"use client"
+'use client';
 
 import { useCallback } from 'react';
-
-import { events } from '@djangocfg/ui-core/hooks';
-
-import { AUTH_EVENTS, OpenAuthDialogPayload } from './events';
+import { dialogStore } from '@djangocfg/ui-core/lib/dialog-service';
+import type { AuthDialogOptions } from '@djangocfg/ui-core/lib/dialog-service';
 
 /**
  * Hook to control auth dialog from anywhere in the app
+ *
+ * @example
+ * ```tsx
+ * const { openAuthDialog, closeAuthDialog } = useAuthDialog();
+ *
+ * // Opens auth dialog and waits for result
+ * const didAuth = await openAuthDialog({ message: 'Session expired' });
+ *
+ * // Or fire-and-forget
+ * openAuthDialog();
+ * ```
  */
 export function useAuthDialog() {
-  const openAuthDialog = useCallback((options?: OpenAuthDialogPayload) => {
-    events.publish({
-      type: AUTH_EVENTS.OPEN_AUTH_DIALOG,
-      payload: options,
-    });
+  const openAuthDialog = useCallback((options?: AuthDialogOptions) => {
+    return dialogStore.getState().openAuth(options);
   }, []);
 
   const closeAuthDialog = useCallback(() => {
-    events.publish({
-      type: AUTH_EVENTS.CLOSE_AUTH_DIALOG,
-    });
+    dialogStore.getState().resolveAuth(false);
   }, []);
 
   return {