@djangocfg/api 2.1.46 → 2.1.48

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@djangocfg/api",
-  "version": "2.1.46",
+  "version": "2.1.48",
   "description": "Auto-generated TypeScript API client with React hooks, SWR integration, and Zod validation for Django REST Framework backends",
   "keywords": [
     "django",
@@ -74,7 +74,7 @@
     "check": "tsc --noEmit"
   },
   "peerDependencies": {
-    "@djangocfg/ui-nextjs": "^2.1.46",
+    "@djangocfg/ui-nextjs": "^2.1.48",
     "consola": "^3.4.2",
     "next": "^14 || ^15",
     "p-retry": "^7.0.0",
@@ -85,7 +85,7 @@
   "devDependencies": {
     "@types/node": "^24.7.2",
     "@types/react": "^19.0.0",
-    "@djangocfg/typescript-config": "^2.1.46",
+    "@djangocfg/typescript-config": "^2.1.48",
     "next": "^15.0.0",
     "react": "^19.0.0",
     "tsup": "^8.5.0",

package/src/auth/context/AuthContext.tsx

@@ -10,6 +10,7 @@ import { useCfgRouter, useLocalStorage, useQueryParams } from '@djangocfg/ui-nex
 
 import { api as apiAccounts, Enums } from '../../';
 import { clearProfileCache, getCachedProfile } from '../hooks/useProfileCache';
+import { useAuthRedirectManager } from '../hooks/useAuthRedirect';
 import { Analytics, AnalyticsCategory, AnalyticsEvent } from '../utils/analytics';
 import { authLogger } from '../utils/logger';
 import { AccountsProvider, useAccountsContext } from './AccountsContext';
@@ -38,6 +39,12 @@ const hasValidTokens = (): boolean => {
 const AuthProviderInternal: React.FC<AuthProviderProps> = ({ children, config }) => {
   const accounts = useAccountsContext();
 
+  // Redirect URL manager for saving URL before auth redirect
+  const redirectManager = useAuthRedirectManager({
+    fallbackUrl: config?.routes?.defaultCallback || defaultRoutes.defaultCallback,
+    clearOnUse: true,
+  });
+
   // Smart initial loading state: only true if we don't have tokens yet
   const [isLoading, setIsLoading] = useState(() => {
     // If we already have tokens and profile, don't show loading
@@ -360,9 +367,11 @@ const AuthProviderInternal: React.FC<AuthProviderProps> = ({ children, config })
           Analytics.setUser(String(result.user.id));
         }
 
-        // Handle redirect logic - use provided redirectUrl or fallback to config
+        // Handle redirect logic - priority: provided redirectUrl > saved redirect > config default
         // Use hardPush for full page reload - ensures all React contexts reinitialize
-        const finalRedirectUrl = redirectUrl || config?.routes?.defaultCallback || defaultRoutes.defaultCallback;
+        const savedRedirect = redirectManager.useAndClearRedirect();
+        const finalRedirectUrl = redirectUrl || savedRedirect || config?.routes?.defaultCallback || defaultRoutes.defaultCallback;
+        authLogger.info('Redirecting after auth to:', finalRedirectUrl);
         router.hardPush(finalRedirectUrl);
 
         return {
@@ -497,6 +506,11 @@ const AuthProviderInternal: React.FC<AuthProviderProps> = ({ children, config })
       verifyOTP,
       refreshToken,
       logout,
+      // Redirect URL methods
+      saveRedirectUrl: redirectManager.setRedirect,
+      getRedirectUrl: redirectManager.getFinalRedirectUrl,
+      clearRedirectUrl: redirectManager.clearRedirect,
+      hasRedirectUrl: redirectManager.hasRedirect,
     }),
     [
       user,
@@ -514,6 +528,7 @@ const AuthProviderInternal: React.FC<AuthProviderProps> = ({ children, config })
       verifyOTP,
       refreshToken,
       logout,
+      redirectManager,
     ],
   );
 

package/src/auth/context/types.ts

@@ -51,6 +51,12 @@ export interface AuthContextType {
   verifyOTP: (identifier: string, otpCode: string, channel?: 'email' | 'phone', sourceUrl?: string, redirectUrl?: string) => Promise<{ success: boolean; message: string; user?: UserProfile }>;
   refreshToken: () => Promise<{ success: boolean; message: string }>;
   logout: () => Promise<void>;
+
+  // Redirect URL Methods - for saving URL before auth redirect
+  saveRedirectUrl: (url: string) => void;
+  getRedirectUrl: () => string;
+  clearRedirectUrl: () => void;
+  hasRedirectUrl: () => boolean;
 }
 
 // Provider props

package/src/auth/hooks/useAuthForm.ts

@@ -43,10 +43,12 @@ export interface UseAuthFormOptions {
   redirectUrl?: string;
   /** If true, user must accept terms before submitting. Default: false */
   requireTermsAcceptance?: boolean;
+  /** Path to auth page for auto-OTP detection. Default: '/auth' */
+  authPath?: string;
 }
 
 export const useAuthForm = (options: UseAuthFormOptions): AuthFormState & AuthFormHandlers => {
-  const { onIdentifierSuccess, onOTPSuccess, onError, sourceUrl, redirectUrl, requireTermsAcceptance = false } = options;
+  const { onIdentifierSuccess, onOTPSuccess, onError, sourceUrl, redirectUrl, requireTermsAcceptance = false, authPath = '/auth' } = options;
   
   // Form state
   const [identifier, setIdentifier] = useState('');
@@ -273,15 +275,16 @@ export const useAuthForm = (options: UseAuthFormOptions): AuthFormState & AuthFo
     setSavedTermsAccepted(checked);
   }, [setSavedTermsAccepted]);
 
-  // Auto-detect OTP from URL query parameters
+  // Auto-detect OTP from URL query parameters (only on auth page)
   useAutoAuth({
+    allowedPaths: [authPath],
     onOTPDetected: (otp: string) => {
       authLogger.info('OTP detected, auto-submitting');
-      
+
       // Get saved identifier from auth context
       const savedEmail = getSavedEmail();
       const savedPhone = getSavedPhone();
-      
+
       // Prioritize phone over email if both exist
       if (savedPhone) {
         setIdentifier(savedPhone);
@@ -290,11 +293,11 @@ export const useAuthForm = (options: UseAuthFormOptions): AuthFormState & AuthFo
         setIdentifier(savedEmail);
         setChannel('email');
       }
-      
+
       // Set OTP and force OTP step
       setOtp(otp);
       setStep('otp');
-      
+
       // Auto-submit after a short delay to ensure state is updated
       setTimeout(() => {
         const fakeEvent = { preventDefault: () => {} } as React.FormEvent;

package/src/auth/hooks/useAuthGuard.ts

@@ -1,6 +1,6 @@
 "use client"
 
-import { useEffect } from 'react';
+import { useEffect, useState } from 'react';
 
 import { useCfgRouter } from '@djangocfg/ui-nextjs/hooks';
 
@@ -9,18 +9,28 @@ import { useAuth } from '../context';
 interface UseAuthGuardOptions {
   redirectTo?: string;
   requireAuth?: boolean;
+  /** Whether to save current URL for redirect after auth (default: true) */
+  saveRedirectUrl?: boolean;
 }
 
 export const useAuthGuard = (options: UseAuthGuardOptions = {}) => {
-  const { redirectTo = '/auth', requireAuth = true } = options;
-  const { isAuthenticated, isLoading } = useAuth();
+  const { redirectTo = '/auth', requireAuth = true, saveRedirectUrl: shouldSaveUrl = true } = options;
+  const { isAuthenticated, isLoading, saveRedirectUrl } = useAuth();
   const router = useCfgRouter();
+  const [isRedirecting, setIsRedirecting] = useState(false);
 
   useEffect(() => {
-    if (!isLoading && requireAuth && !isAuthenticated) {
+    if (!isLoading && requireAuth && !isAuthenticated && !isRedirecting) {
+      // Save current URL before redirecting
+      if (shouldSaveUrl && typeof window !== 'undefined') {
+        const currentUrl = window.location.pathname + window.location.search;
+        saveRedirectUrl(currentUrl);
+      }
+
+      setIsRedirecting(true);
       router.push(redirectTo);
     }
-  }, [isAuthenticated, isLoading, router, redirectTo, requireAuth]);
+  }, [isAuthenticated, isLoading, router, redirectTo, requireAuth, isRedirecting, shouldSaveUrl, saveRedirectUrl]);
 
-  return { isAuthenticated, isLoading };
+  return { isAuthenticated, isLoading, isRedirecting };
 }; 

package/src/auth/hooks/useAutoAuth.ts

@@ -10,6 +10,8 @@ import { authLogger } from '../utils/logger';
 export interface UseAutoAuthOptions {
   onOTPDetected?: (otp: string) => void;
   cleanupUrl?: boolean;
+  /** Paths where auto-auth should be active. Default: ['/auth'] */
+  allowedPaths?: string[];
 }
 
 /**
@@ -17,22 +19,26 @@ export interface UseAutoAuthOptions {
  * Detects OTP from URL and triggers callback
  */
 export const useAutoAuth = (options: UseAutoAuthOptions = {}) => {
-  const { onOTPDetected, cleanupUrl = true } = options;
+  const { onOTPDetected, cleanupUrl = true, allowedPaths = ['/auth'] } = options;
   const queryParams = useQueryParams();
   const pathname = usePathname();
   const router = useCfgRouter();
 
-  const isReady = !!pathname && !!queryParams.get('otp');
+  // Check if current path is in allowed paths
+  const isAllowedPath = allowedPaths.some(path => pathname === path || pathname?.startsWith(path + '/'));
+
   const hasOTP = !!(queryParams.get('otp'));
+  const isReady = !!pathname && hasOTP && isAllowedPath;
 
   useEffect(() => {
     if (!isReady) return;
 
     const queryOtp = queryParams.get('otp') as string;
 
-    // Handle OTP detection
+    // Handle OTP detection - only on allowed paths to avoid conflicts with other pages
+    // (e.g., /dashboard/device uses ?otp= for device authorization, not user auth)
     if (queryOtp && typeof queryOtp === 'string' && queryOtp.length === 6) {
-      authLogger.info('OTP detected in URL:', queryOtp);
+      authLogger.info('OTP detected in URL on auth page:', queryOtp);
       onOTPDetected?.(queryOtp);
     }
 
@@ -40,12 +46,14 @@ export const useAutoAuth = (options: UseAutoAuthOptions = {}) => {
     if (cleanupUrl && queryOtp) {
       const cleanQuery = Object.fromEntries(queryParams.entries());
       delete cleanQuery.otp;
-      router.push(`${pathname}?${new URLSearchParams(cleanQuery).toString()}`);
+      const queryString = new URLSearchParams(cleanQuery).toString();
+      router.push(queryString ? `${pathname}?${queryString}` : pathname);
     }
-  }, [pathname, queryParams, onOTPDetected, cleanupUrl, router]);
+  }, [pathname, queryParams, onOTPDetected, cleanupUrl, router, isReady]);
 
   return {
     isReady,
     hasOTP,
+    isAllowedPath,
   };
 };