@payez/next-mvp 4.1.9 → 4.1.11

package/src/hooks/useAuth.ts

@@ -1,117 +1,117 @@
-'use client';
-
-/**
- * ⚠️ WARNING: This hook cannot be used directly from the @payez/next-mvp package!
- *
- * @deprecated Import this hook from your local app instead
- *
- * **Why?** React Context (SessionProvider) cannot cross package boundaries in file:// linked packages.
- *
- * **Solution:** Create a local version in your app (e.g., src/hooks/useAuth.ts) that imports standardizedApi:
- *
- * @example
- * ```typescript
- * // src/hooks/useAuth.ts (YOUR APP)
- * 'use client';
- * import { authClient } from '@payez/next-mvp/client/better-auth-client';
- * import { standardizedApi } from '@payez/next-mvp/lib/standardized-client-api';
- *
- * export function useAuth() {
- *   const { data: session } = useSession(); // Works in your app context
- *   // ... implementation
- * }
- * ```
- *
- * @see {@link https://github.com/payez/next-mvp/blob/main/docs/centralized-auth-api-pattern.md#why-local-hooks-for-auth Complete documentation}
- */
-
-import { authClient } from '../client/better-auth-client';
-import { useCallback } from 'react';
-import { useRouter } from 'next/navigation';
-import { standardizedApi, ApiResult } from '../lib/standardized-client-api';
-
-// Custom session type matching NextAuth structure
-export interface CustomSession {
-  user: {
-    id: string;
-    email: string;
-    roles?: string[];
-    twoFactorMethod?: string;
-    twoFactorSessionVerified?: boolean;
-    requiresTwoFactor?: boolean;
-  };
-  accessToken?: string;
-  refreshToken?: string;
-  expires: string;
-  error?: string;
-}
-
-export interface UseAuthResult {
-  session: CustomSession | null;
-  status: 'loading' | 'authenticated' | 'unauthenticated';
-  isLoading: boolean;
-  isAuthenticated: boolean;
-  // API helper that automatically includes the auth token
-  apiCall: <T>(url: string, method?: 'GET' | 'POST' | 'PUT' | 'DELETE', data?: any) => Promise<ApiResult<T>>;
-}
-
-export function useAuth(): UseAuthResult {
-  const { data: sessionData, isPending } = authClient.useSession();
-  const session = sessionData;
-  const status = isPending ? 'loading' : session ? 'authenticated' : 'unauthenticated';
-  const router = useRouter();
-
-  const isLoading = status === 'loading';
-  const isAuthenticated = status === 'authenticated' && !!(session as any)?.accessToken;
-
-  // Handle sign out with redirect
-  const handleSignOut = useCallback(async () => {
-    await authClient.signOut();
-    router.push('/account-auth/login?error=SessionExpired');
-  }, [router]);
-
-  // API helper that automatically includes the auth token and uses standardized API
-  const apiCall = useCallback(
-    async <T>(url: string, method: 'GET' | 'POST' | 'PUT' | 'DELETE' = 'GET', data?: any): Promise<ApiResult<T>> => {
-      if (!(session as any)?.accessToken) {
-        console.error('[useAuth] No access token available');
-        throw new Error('Not authenticated');
-      }
-
-      try {
-        // Use standardized API which handles token refresh and validates response format
-        switch (method) {
-          case 'GET':
-            return await standardizedApi.get<T>(url, (session as any).accessToken!);
-          case 'POST':
-            return await standardizedApi.post<T>(url, data, (session as any).accessToken!);
-          case 'PUT':
-            return await standardizedApi.put<T>(url, data);
-          case 'DELETE':
-            return await standardizedApi.delete<T>(url);
-          default:
-            throw new Error(`Unsupported method: ${method}`);
-        }
-      } catch (error) {
-        console.error('[useAuth] API call failed:', error);
-
-        // standardizedApi handles token refresh internally, but if we still get auth errors, sign out
-        if (error instanceof Error && error.message.includes('Authentication failed')) {
-          console.warn('[useAuth] Authentication failed, signing out...');
-          await handleSignOut();
-        }
-
-        throw error;
-      }
-    },
-    [(session as any)?.accessToken, handleSignOut]
-  );
-
-  return {
-    session: session as CustomSession | null,
-    status,
-    isLoading,
-    isAuthenticated,
-    apiCall
-  };
-}
+'use client';
+
+/**
+ * ⚠️ WARNING: This hook cannot be used directly from the @payez/next-mvp package!
+ *
+ * @deprecated Import this hook from your local app instead
+ *
+ * **Why?** React Context (SessionProvider) cannot cross package boundaries in file:// linked packages.
+ *
+ * **Solution:** Create a local version in your app (e.g., src/hooks/useAuth.ts) that imports standardizedApi:
+ *
+ * @example
+ * ```typescript
+ * // src/hooks/useAuth.ts (YOUR APP)
+ * 'use client';
+ * import { authClient } from '@payez/next-mvp/client/better-auth-client';
+ * import { standardizedApi } from '@payez/next-mvp/lib/standardized-client-api';
+ *
+ * export function useAuth() {
+ *   const { data: session } = useSession(); // Works in your app context
+ *   // ... implementation
+ * }
+ * ```
+ *
+ * @see {@link https://github.com/payez/next-mvp/blob/main/docs/centralized-auth-api-pattern.md#why-local-hooks-for-auth Complete documentation}
+ */
+
+import { authClient } from '../client/better-auth-client';
+import { useCallback } from 'react';
+import { useRouter } from 'next/navigation';
+import { standardizedApi, ApiResult } from '../lib/standardized-client-api';
+
+// Custom session type matching NextAuth structure
+export interface CustomSession {
+  user: {
+    id: string;
+    email: string;
+    roles?: string[];
+    twoFactorMethod?: string;
+    twoFactorSessionVerified?: boolean;
+    requiresTwoFactor?: boolean;
+  };
+  accessToken?: string;
+  refreshToken?: string;
+  expires: string;
+  error?: string;
+}
+
+export interface UseAuthResult {
+  session: CustomSession | null;
+  status: 'loading' | 'authenticated' | 'unauthenticated';
+  isLoading: boolean;
+  isAuthenticated: boolean;
+  // API helper that automatically includes the auth token
+  apiCall: <T>(url: string, method?: 'GET' | 'POST' | 'PUT' | 'DELETE', data?: any) => Promise<ApiResult<T>>;
+}
+
+export function useAuth(): UseAuthResult {
+  const { data: sessionData, isPending } = authClient.useSession();
+  const session = sessionData;
+  const status = isPending ? 'loading' : session ? 'authenticated' : 'unauthenticated';
+  const router = useRouter();
+
+  const isLoading = status === 'loading';
+  const isAuthenticated = status === 'authenticated' && !!(session as any)?.accessToken;
+
+  // Handle sign out with redirect
+  const handleSignOut = useCallback(async () => {
+    await authClient.signOut();
+    router.push('/account-auth/login?error=SessionExpired');
+  }, [router]);
+
+  // API helper that automatically includes the auth token and uses standardized API
+  const apiCall = useCallback(
+    async <T>(url: string, method: 'GET' | 'POST' | 'PUT' | 'DELETE' = 'GET', data?: any): Promise<ApiResult<T>> => {
+      if (!(session as any)?.accessToken) {
+        console.error('[useAuth] No access token available');
+        throw new Error('Not authenticated');
+      }
+
+      try {
+        // Use standardized API which handles token refresh and validates response format
+        switch (method) {
+          case 'GET':
+            return await standardizedApi.get<T>(url, (session as any).accessToken!);
+          case 'POST':
+            return await standardizedApi.post<T>(url, data, (session as any).accessToken!);
+          case 'PUT':
+            return await standardizedApi.put<T>(url, data);
+          case 'DELETE':
+            return await standardizedApi.delete<T>(url);
+          default:
+            throw new Error(`Unsupported method: ${method}`);
+        }
+      } catch (error) {
+        console.error('[useAuth] API call failed:', error);
+
+        // standardizedApi handles token refresh internally, but if we still get auth errors, sign out
+        if (error instanceof Error && error.message.includes('Authentication failed')) {
+          console.warn('[useAuth] Authentication failed, signing out...');
+          await handleSignOut();
+        }
+
+        throw error;
+      }
+    },
+    [(session as any)?.accessToken, handleSignOut]
+  );
+
+  return {
+    session: session as CustomSession | null,
+    status,
+    isLoading,
+    isAuthenticated,
+    apiCall
+  };
+}

package/src/hooks/useAuthSettings.ts

@@ -1,97 +1,97 @@
-/**
- * useAuthSettings Hook
- *
- * Client-side hook to access auth settings from the IDP config.
- * Settings are passed through the session from server-side config.
- */
-
-'use client';
-
-import { authClient } from '../client/better-auth-client';
-import type { AuthSettings } from '../lib/idp-client-config';
-
-/**
- * Extended session type that may include authSettings
- */
-interface SessionWithAuthSettings {
-    authSettings?: AuthSettings;
-}
-
-/**
- * Hook to access auth settings from the session.
- *
- * Auth settings are populated from IDP config on the server side
- * and included in the session for client-side access.
- *
- * @returns AuthSettings or null if not available
- *
- * @example
- * ```tsx
- * function MyComponent() {
- *   const authSettings = useAuthSettings();
- *
- *   if (authSettings?.require2FA) {
- *     return <TwoFactorPrompt />;
- *   }
- *
- *   return <Dashboard />;
- * }
- * ```
- */
-export function useAuthSettings(): AuthSettings | null {
-    const { data: session } = authClient.useSession();
-
-    if (!session) {
-        return null;
-    }
-
-    // Auth settings are included in the session from server-side config
-    const sessionWithSettings = session as unknown as SessionWithAuthSettings;
-    return sessionWithSettings.authSettings || null;
-}
-
-/**
- * Hook to check if 2FA is required based on auth settings.
- *
- * @returns boolean indicating if 2FA is required
- */
-export function useRequires2FA(): boolean {
-    const authSettings = useAuthSettings();
-    return authSettings?.require2FA ?? true; // Default to true for security
-}
-
-/**
- * Hook to get allowed 2FA methods.
- *
- * @returns Array of allowed 2FA method strings (e.g., ['email', 'sms', 'totp'])
- */
-export function useAllowed2FAMethods(): string[] {
-    const authSettings = useAuthSettings();
-    return authSettings?.allowed2FAMethods ?? ['email', 'sms'];
-}
-
-/**
- * Hook to get session timeout settings.
- *
- * @returns Object with session and idle timeout minutes
- */
-export function useSessionTimeouts(): { sessionTimeoutMinutes: number; idleTimeoutMinutes: number } {
-    const authSettings = useAuthSettings();
-    return {
-        sessionTimeoutMinutes: authSettings?.sessionTimeoutMinutes ?? 60,
-        idleTimeoutMinutes: authSettings?.idleTimeoutMinutes ?? 15,
-    };
-}
-
-/**
- * Hook to check if remember me is allowed.
- *
- * @returns Object with allowRememberMe flag and rememberMeDays
- */
-export function useRememberMeSettings(): { allowRememberMe: boolean; rememberMeDays: number } {
-    const authSettings = useAuthSettings();
-    return {
-        allowRememberMe: authSettings?.allowRememberMe ?? true,
-        rememberMeDays: authSettings?.rememberMeDays ?? 30,
-    };
-}
+/**
+ * useAuthSettings Hook
+ *
+ * Client-side hook to access auth settings from the IDP config.
+ * Settings are passed through the session from server-side config.
+ */
+
+'use client';
+
+import { authClient } from '../client/better-auth-client';
+import type { AuthSettings } from '../lib/idp-client-config';
+
+/**
+ * Extended session type that may include authSettings
+ */
+interface SessionWithAuthSettings {
+    authSettings?: AuthSettings;
+}
+
+/**
+ * Hook to access auth settings from the session.
+ *
+ * Auth settings are populated from IDP config on the server side
+ * and included in the session for client-side access.
+ *
+ * @returns AuthSettings or null if not available
+ *
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const authSettings = useAuthSettings();
+ *
+ *   if (authSettings?.require2FA) {
+ *     return <TwoFactorPrompt />;
+ *   }
+ *
+ *   return <Dashboard />;
+ * }
+ * ```
+ */
+export function useAuthSettings(): AuthSettings | null {
+    const { data: session } = authClient.useSession();
+
+    if (!session) {
+        return null;
+    }
+
+    // Auth settings are included in the session from server-side config
+    const sessionWithSettings = session as unknown as SessionWithAuthSettings;
+    return sessionWithSettings.authSettings || null;
+}
+
+/**
+ * Hook to check if 2FA is required based on auth settings.
+ *
+ * @returns boolean indicating if 2FA is required
+ */
+export function useRequires2FA(): boolean {
+    const authSettings = useAuthSettings();
+    return authSettings?.require2FA ?? true; // Default to true for security
+}
+
+/**
+ * Hook to get allowed 2FA methods.
+ *
+ * @returns Array of allowed 2FA method strings (e.g., ['email', 'sms', 'totp'])
+ */
+export function useAllowed2FAMethods(): string[] {
+    const authSettings = useAuthSettings();
+    return authSettings?.allowed2FAMethods ?? ['email', 'sms'];
+}
+
+/**
+ * Hook to get session timeout settings.
+ *
+ * @returns Object with session and idle timeout minutes
+ */
+export function useSessionTimeouts(): { sessionTimeoutMinutes: number; idleTimeoutMinutes: number } {
+    const authSettings = useAuthSettings();
+    return {
+        sessionTimeoutMinutes: authSettings?.sessionTimeoutMinutes ?? 60,
+        idleTimeoutMinutes: authSettings?.idleTimeoutMinutes ?? 15,
+    };
+}
+
+/**
+ * Hook to check if remember me is allowed.
+ *
+ * @returns Object with allowRememberMe flag and rememberMeDays
+ */
+export function useRememberMeSettings(): { allowRememberMe: boolean; rememberMeDays: number } {
+    const authSettings = useAuthSettings();
+    return {
+        allowRememberMe: authSettings?.allowRememberMe ?? true,
+        rememberMeDays: authSettings?.rememberMeDays ?? 30,
+    };
+}

package/src/hooks/useAvailableProviders.ts

@@ -1,120 +1,120 @@
-/**
- * useAvailableProviders Hook
- *
- * Returns the list of OAuth providers configured for this client.
- * Ensures UI only shows buttons for providers that are enabled in IDP.
- */
-
-'use client';
-
-import { useState, useEffect } from 'react';
-import type { FederatedProvider } from '../types/auth';
-
-// Map provider IDs to our FederatedProvider type
-const PROVIDER_MAP: Record<string, FederatedProvider> = {
-    'google': 'google',
-    'apple': 'apple',
-    'facebook': 'facebook',
-    'github': 'github',
-    'azure-ad': 'microsoft',
-    'microsoft-entra-id': 'microsoft',
-};
-
-// Providers we support in UI (excludes credentials)
-const OAUTH_PROVIDERS = ['google', 'apple', 'facebook', 'github', 'azure-ad', 'microsoft-entra-id'];
-
-export interface UseAvailableProvidersResult {
-    providers: FederatedProvider[];
-    isLoading: boolean;
-    error: Error | null;
-    rawProviders: Record<string, any> | null;
-}
-
-/**
- * Hook to get available federated OAuth providers.
- *
- * Returns only the providers that are enabled in IDP config.
- *
- * @example
- * ```tsx
- * function SignupPage() {
- *   const { providers, isLoading } = useAvailableProviders();
- *
- *   if (isLoading) return <Spinner />;
- *
- *   return (
- *     <FederatedAuthSection
- *       providers={providers}
- *       onProviderClick={handleClick}
- *     />
- *   );
- * }
- * ```
- */
-export function useAvailableProviders(): UseAvailableProvidersResult {
-    const [providers, setProviders] = useState<FederatedProvider[]>([]);
-    const [rawProviders, setRawProviders] = useState<Record<string, any> | null>(null);
-    const [isLoading, setIsLoading] = useState(true);
-    const [error, setError] = useState<Error | null>(null);
-
-    useEffect(() => {
-        let mounted = true;
-
-        async function fetchProviders() {
-            try {
-                // Fetch available providers from Better Auth
-                // Better Auth doesn't have a getProviders equivalent, so we use a static list
-                // based on configured social providers
-                const result: Record<string, { id: string; name: string }> = {
-                    google: { id: 'google', name: 'Google' },
-                };
-
-                if (!mounted) return;
-
-                setRawProviders(result);
-
-                if (result) {
-                    // Filter to OAuth providers only (exclude credentials)
-                    // Map to our FederatedProvider type
-                    const oauthProviders = Object.keys(result)
-                        .filter(id => OAUTH_PROVIDERS.includes(id))
-                        .map(id => PROVIDER_MAP[id])
-                        .filter((p): p is FederatedProvider => p !== undefined);
-
-                    setProviders(oauthProviders);
-                } else {
-                    setProviders([]);
-                }
-
-                setError(null);
-            } catch (err) {
-                if (!mounted) return;
-                setError(err instanceof Error ? err : new Error(String(err)));
-                setProviders([]);
-            } finally {
-                if (mounted) {
-                    setIsLoading(false);
-                }
-            }
-        }
-
-        fetchProviders();
-
-        return () => {
-            mounted = false;
-        };
-    }, []);
-
-    return { providers, isLoading, error, rawProviders };
-}
-
-/**
- * Check if a specific provider is available.
- *
- * @param provider The provider to check
- * @returns boolean indicating if provider is configured
- */
-export function useIsProviderAvailable(provider: FederatedProvider): boolean {
-    const { providers } = useAvailableProviders();
-    return providers.includes(provider);
-}
+/**
+ * useAvailableProviders Hook
+ *
+ * Returns the list of OAuth providers configured for this client.
+ * Ensures UI only shows buttons for providers that are enabled in IDP.
+ */
+
+'use client';
+
+import { useState, useEffect } from 'react';
+import type { FederatedProvider } from '../types/auth';
+
+// Map provider IDs to our FederatedProvider type
+const PROVIDER_MAP: Record<string, FederatedProvider> = {
+    'google': 'google',
+    'apple': 'apple',
+    'facebook': 'facebook',
+    'github': 'github',
+    'azure-ad': 'microsoft',
+    'microsoft-entra-id': 'microsoft',
+};
+
+// Providers we support in UI (excludes credentials)
+const OAUTH_PROVIDERS = ['google', 'apple', 'facebook', 'github', 'azure-ad', 'microsoft-entra-id'];
+
+export interface UseAvailableProvidersResult {
+    providers: FederatedProvider[];
+    isLoading: boolean;
+    error: Error | null;
+    rawProviders: Record<string, any> | null;
+}
+
+/**
+ * Hook to get available federated OAuth providers.
+ *
+ * Returns only the providers that are enabled in IDP config.
+ *
+ * @example
+ * ```tsx
+ * function SignupPage() {
+ *   const { providers, isLoading } = useAvailableProviders();
+ *
+ *   if (isLoading) return <Spinner />;
+ *
+ *   return (
+ *     <FederatedAuthSection
+ *       providers={providers}
+ *       onProviderClick={handleClick}
+ *     />
+ *   );
+ * }
+ * ```
+ */
+export function useAvailableProviders(): UseAvailableProvidersResult {
+    const [providers, setProviders] = useState<FederatedProvider[]>([]);
+    const [rawProviders, setRawProviders] = useState<Record<string, any> | null>(null);
+    const [isLoading, setIsLoading] = useState(true);
+    const [error, setError] = useState<Error | null>(null);
+
+    useEffect(() => {
+        let mounted = true;
+
+        async function fetchProviders() {
+            try {
+                // Fetch available providers from Better Auth
+                // Better Auth doesn't have a getProviders equivalent, so we use a static list
+                // based on configured social providers
+                const result: Record<string, { id: string; name: string }> = {
+                    google: { id: 'google', name: 'Google' },
+                };
+
+                if (!mounted) return;
+
+                setRawProviders(result);
+
+                if (result) {
+                    // Filter to OAuth providers only (exclude credentials)
+                    // Map to our FederatedProvider type
+                    const oauthProviders = Object.keys(result)
+                        .filter(id => OAUTH_PROVIDERS.includes(id))
+                        .map(id => PROVIDER_MAP[id])
+                        .filter((p): p is FederatedProvider => p !== undefined);
+
+                    setProviders(oauthProviders);
+                } else {
+                    setProviders([]);
+                }
+
+                setError(null);
+            } catch (err) {
+                if (!mounted) return;
+                setError(err instanceof Error ? err : new Error(String(err)));
+                setProviders([]);
+            } finally {
+                if (mounted) {
+                    setIsLoading(false);
+                }
+            }
+        }
+
+        fetchProviders();
+
+        return () => {
+            mounted = false;
+        };
+    }, []);
+
+    return { providers, isLoading, error, rawProviders };
+}
+
+/**
+ * Check if a specific provider is available.
+ *
+ * @param provider The provider to check
+ * @returns boolean indicating if provider is configured
+ */
+export function useIsProviderAvailable(provider: FederatedProvider): boolean {
+    const { providers } = useAvailableProviders();
+    return providers.includes(provider);
+}