@payez/next-mvp 4.8.1 → 4.8.2

package/src/client/fetchWithSession.ts

@@ -1,21 +1,21 @@
-import { useRef } from 'react';
-
-export async function fetchWithSession(input: RequestInfo | URL, init: RequestInit = {}, opts: { retry?: number } = {}): Promise<Response> {
-  const retry = opts.retry ?? 1;
-  const doFetch = async (): Promise<Response> => {
-    const res = await fetch(input, { ...init, credentials: 'include' });
-    if (res.ok) return res;
-    if (res.status === 401 && retry > 0) {
-      const rf = await fetch('/api/auth/refresh', { method: 'POST', headers: { 'Accept': 'application/json' }, credentials: 'include' });
-      if (rf.ok) return fetchWithSession(input, init, { retry: retry - 1 });
-    }
-    if ((res.status === 409 || res.status === 503) && retry > 0) {
-      const retryAfter = res.headers.get('Retry-After');
-      const waitMs = retryAfter ? parseInt(retryAfter) * 1000 : 1000;
-      await new Promise(r => setTimeout(r, Math.min(waitMs, 3000)));
-      return fetchWithSession(input, init, { retry: retry - 1 });
-    }
-    return res;
-  };
-  return doFetch();
-}
+import { useRef } from 'react';
+
+export async function fetchWithSession(input: RequestInfo | URL, init: RequestInit = {}, opts: { retry?: number } = {}): Promise<Response> {
+  const retry = opts.retry ?? 1;
+  const doFetch = async (): Promise<Response> => {
+    const res = await fetch(input, { ...init, credentials: 'include' });
+    if (res.ok) return res;
+    if (res.status === 401 && retry > 0) {
+      const rf = await fetch('/api/auth/refresh', { method: 'POST', headers: { 'Accept': 'application/json' }, credentials: 'include' });
+      if (rf.ok) return fetchWithSession(input, init, { retry: retry - 1 });
+    }
+    if ((res.status === 409 || res.status === 503) && retry > 0) {
+      const retryAfter = res.headers.get('Retry-After');
+      const waitMs = retryAfter ? parseInt(retryAfter) * 1000 : 1000;
+      await new Promise(r => setTimeout(r, Math.min(waitMs, 3000)));
+      return fetchWithSession(input, init, { retry: retry - 1 });
+    }
+    return res;
+  };
+  return doFetch();
+}

package/src/client/index.ts

@@ -1,13 +1,13 @@
-/**
- * Client-Side Exports
- *
- * This module exports only client-safe code for use in browser environments.
- * Server-only utilities and Node.js dependencies are excluded.
- */
-
-// Client-side fetch utility
-export { fetchWithAuth } from './fetch-with-auth';
-
-// Authentication context and hooks
-export { AuthProvider, useAuthConfig, useAuthMode, useFederatedProviders, useFederatedAuthEnabled, useTraditionalAuthEnabled } from './AuthContext';
-export type { AuthConfig } from '../types/auth';
+/**
+ * Client-Side Exports
+ *
+ * This module exports only client-safe code for use in browser environments.
+ * Server-only utilities and Node.js dependencies are excluded.
+ */
+
+// Client-side fetch utility
+export { fetchWithAuth } from './fetch-with-auth';
+
+// Authentication context and hooks
+export { AuthProvider, useAuthConfig, useAuthMode, useFederatedProviders, useFederatedAuthEnabled, useTraditionalAuthEnabled } from './AuthContext';
+export type { AuthConfig } from '../types/auth';

package/src/client/useAnonSession.ts

@@ -1,131 +1,131 @@
-/**
- * useAnonSession - React hook for anonymous session management
- *
- * Provides access to anonymous session preferences stored in Redis.
- * Works before user logs in, preferences persist across visits.
- */
-
-'use client';
-
-import { useState, useEffect, useCallback } from 'react';
-
-export interface AnonPreferences {
-  theme?: string;
-  locale?: string;
-  [key: string]: any;
-}
-
-export interface AnonMetrics {
-  resumeGenerationCount?: number;
-  firstVisit?: number;
-  lastVisit?: number;
-  visitCount?: number;
-  [key: string]: any;
-}
-
-export interface AnonSession {
-  id: string;
-  preferences: AnonPreferences;
-  metrics: AnonMetrics;
-}
-
-export interface UseAnonSessionReturn {
-  session: AnonSession | null;
-  isLoading: boolean;
-  error: string | null;
-  updatePreferences: (preferences: Partial<AnonPreferences>) => Promise<void>;
-  setTheme: (theme: string) => Promise<void>;
-  refresh: () => Promise<void>;
-}
-
-/**
- * Hook to manage anonymous session state
- */
-export function useAnonSession(): UseAnonSessionReturn {
-  const [session, setSession] = useState<AnonSession | null>(null);
-  const [isLoading, setIsLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
-
-  // Fetch session on mount
-  const fetchSession = useCallback(async () => {
-    try {
-      setIsLoading(true);
-      setError(null);
-
-      const response = await fetch('/api/anon/preferences', {
-        method: 'GET',
-        credentials: 'include', // Important for cookies
-      });
-
-      if (!response.ok) {
-        throw new Error('Failed to fetch preferences');
-      }
-
-      const data = await response.json();
-      if (data.success && data.data) {
-        setSession({
-          id: data.data.id,
-          preferences: data.data.preferences || {},
-          metrics: data.data.metrics || {},
-        });
-      }
-    } catch (err) {
-      console.error('[useAnonSession] Error fetching session:', err);
-      setError(err instanceof Error ? err.message : 'Unknown error');
-    } finally {
-      setIsLoading(false);
-    }
-  }, []);
-
-  useEffect(() => {
-    fetchSession();
-  }, [fetchSession]);
-
-  // Update preferences
-  const updatePreferences = useCallback(async (preferences: Partial<AnonPreferences>) => {
-    try {
-      setError(null);
-
-      const response = await fetch('/api/anon/preferences', {
-        method: 'POST',
-        credentials: 'include',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify({ preferences }),
-      });
-
-      if (!response.ok) {
-        throw new Error('Failed to update preferences');
-      }
-
-      const data = await response.json();
-      if (data.success && data.data) {
-        setSession(prev => prev ? {
-          ...prev,
-          preferences: data.data.preferences,
-        } : null);
-      }
-    } catch (err) {
-      console.error('[useAnonSession] Error updating preferences:', err);
-      setError(err instanceof Error ? err.message : 'Unknown error');
-      throw err;
-    }
-  }, []);
-
-  // Convenience method to set theme
-  const setTheme = useCallback(async (theme: string) => {
-    await updatePreferences({ theme });
-  }, [updatePreferences]);
-
-  return {
-    session,
-    isLoading,
-    error,
-    updatePreferences,
-    setTheme,
-    refresh: fetchSession,
-  };
-}
-
-export default useAnonSession;
+/**
+ * useAnonSession - React hook for anonymous session management
+ *
+ * Provides access to anonymous session preferences stored in Redis.
+ * Works before user logs in, preferences persist across visits.
+ */
+
+'use client';
+
+import { useState, useEffect, useCallback } from 'react';
+
+export interface AnonPreferences {
+  theme?: string;
+  locale?: string;
+  [key: string]: any;
+}
+
+export interface AnonMetrics {
+  resumeGenerationCount?: number;
+  firstVisit?: number;
+  lastVisit?: number;
+  visitCount?: number;
+  [key: string]: any;
+}
+
+export interface AnonSession {
+  id: string;
+  preferences: AnonPreferences;
+  metrics: AnonMetrics;
+}
+
+export interface UseAnonSessionReturn {
+  session: AnonSession | null;
+  isLoading: boolean;
+  error: string | null;
+  updatePreferences: (preferences: Partial<AnonPreferences>) => Promise<void>;
+  setTheme: (theme: string) => Promise<void>;
+  refresh: () => Promise<void>;
+}
+
+/**
+ * Hook to manage anonymous session state
+ */
+export function useAnonSession(): UseAnonSessionReturn {
+  const [session, setSession] = useState<AnonSession | null>(null);
+  const [isLoading, setIsLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+
+  // Fetch session on mount
+  const fetchSession = useCallback(async () => {
+    try {
+      setIsLoading(true);
+      setError(null);
+
+      const response = await fetch('/api/anon/preferences', {
+        method: 'GET',
+        credentials: 'include', // Important for cookies
+      });
+
+      if (!response.ok) {
+        throw new Error('Failed to fetch preferences');
+      }
+
+      const data = await response.json();
+      if (data.success && data.data) {
+        setSession({
+          id: data.data.id,
+          preferences: data.data.preferences || {},
+          metrics: data.data.metrics || {},
+        });
+      }
+    } catch (err) {
+      console.error('[useAnonSession] Error fetching session:', err);
+      setError(err instanceof Error ? err.message : 'Unknown error');
+    } finally {
+      setIsLoading(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    fetchSession();
+  }, [fetchSession]);
+
+  // Update preferences
+  const updatePreferences = useCallback(async (preferences: Partial<AnonPreferences>) => {
+    try {
+      setError(null);
+
+      const response = await fetch('/api/anon/preferences', {
+        method: 'POST',
+        credentials: 'include',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({ preferences }),
+      });
+
+      if (!response.ok) {
+        throw new Error('Failed to update preferences');
+      }
+
+      const data = await response.json();
+      if (data.success && data.data) {
+        setSession(prev => prev ? {
+          ...prev,
+          preferences: data.data.preferences,
+        } : null);
+      }
+    } catch (err) {
+      console.error('[useAnonSession] Error updating preferences:', err);
+      setError(err instanceof Error ? err.message : 'Unknown error');
+      throw err;
+    }
+  }, []);
+
+  // Convenience method to set theme
+  const setTheme = useCallback(async (theme: string) => {
+    await updatePreferences({ theme });
+  }, [updatePreferences]);
+
+  return {
+    session,
+    isLoading,
+    error,
+    updatePreferences,
+    setTheme,
+    refresh: fetchSession,
+  };
+}
+
+export default useAnonSession;

package/src/components/SessionSync.tsx

@@ -1,138 +1,138 @@
-'use client';
-
-import { useEffect, useRef } from 'react';
-import { authClient } from '../client/better-auth-client';
-import { useAuthStore } from '../stores/authStore';
-import { isValidSession } from '../lib/session';
-import {
-  getSecureSessionCookieName,
-  getSecureCsrfCookieName,
-  getCallbackUrlCookieName
-} from '../lib/app-slug';
-
-/**
- * Sanitize sensitive data for logging
- * Never log full user IDs or emails in any environment
- */
-function sanitizeForLog(value: string | undefined, type: 'email' | 'userId'): string {
-  if (!value) return '(empty)';
-  
-  if (type === 'email') {
-    return '***@***'; // Never log emails
-  }
-  
-  if (type === 'userId') {
-    // Only show first 8 chars in development
-    if (process.env.NODE_ENV === 'development') {
-      return value.substring(0, 8) + '...';
-    }
-    return '***'; // Fully redact in production
-  }
-  
-  return '***';
-}
-
-/**
- * SessionSync - Bridges NextAuth session with Zustand auth store
- * 
- * CRITICAL: This component enforces strict session validation. If NextAuth
- * reports an authenticated status but the session data is invalid (empty user ID,
- * empty email, or missing access token), it forces a sign-out to prevent
- * contradictory state like "hasSession: true, userId: ''"
- * 
- * This ensures the app NEVER shows authenticated UI with empty/invalid session data.
- */
-export function SessionSync({ children }: { children: React.ReactNode }) {
-  const { data: sessionData, isPending } = authClient.useSession();
-  const session = sessionData;
-  const status = isPending ? 'loading' : session ? 'authenticated' : 'unauthenticated';
-  const { setSession, clearSession } = useAuthStore();
-  
-  // Guard against duplicate sign-out calls
-  const isSigningOutRef = useRef(false);
-
-  useEffect(() => {
-    let isMounted = true;
-    
-    // Only process when NextAuth has finished loading
-    if (status === 'loading') {
-      return;
-    }
-
-    // Strict validation: Check if session is actually valid
-    const isValid = isValidSession(session);
-
-    // CRITICAL FIX: If NextAuth says "authenticated" but session is invalid,
-    // this is a broken state that must be fixed immediately
-    if (status === 'authenticated' && !isValid) {
-      // GUARD: Prevent duplicate sign-out
-      if (isSigningOutRef.current) {
-        console.warn('[SessionSync] Sign-out already in progress, skipping');
-        return;
-      }
-      isSigningOutRef.current = true;
-      
-      console.error('[SessionSync] CRITICAL: Invalid session detected despite authenticated status!');
-      console.error('[SessionSync] This indicates a session with empty user data - forcing sign-out');
-      
-      // Log diagnostic info with PII redaction
-      // Note: session is typed as Session | null from NextAuth, but may have invalid/partial data
-      const sessionData = session as any; // Explicit cast needed for error logging
-      console.error('[SessionSync] Session data:', {
-        hasSessionObject: !!sessionData,
-        hasUser: !!sessionData?.user,
-        userId: sanitizeForLog(sessionData?.user?.id, 'userId'),
-        userEmail: sanitizeForLog(sessionData?.user?.email, 'email'),
-        hasAccessToken: !!sessionData?.accessToken,
-      });
-      
-      // Clear the auth store immediately
-      clearSession();
-
-      // FIX: Force clear all auth cookies including stale provisional tokens (app-slug prefixed)
-      // This prevents infinite loop when provisional token exists but session is invalid
-      // Root cause: OAuth creates provisional token before Redis session exists
-      try {
-        const secureSession = getSecureSessionCookieName();
-        const secureCsrf = getSecureCsrfCookieName();
-        const callbackUrl = getCallbackUrlCookieName();
-        document.cookie = `${secureSession}=; path=/; expires=Thu, 01 Jan 1970 00:00:00 UTC; Secure; SameSite=Lax`;
-        document.cookie = `${secureCsrf}=; path=/; expires=Thu, 01 Jan 1970 00:00:00 UTC; SameSite=Lax`;
-        document.cookie = `__Secure-${callbackUrl}=; path=/; expires=Thu, 01 Jan 1970 00:00:00 UTC; Secure; SameSite=Lax`;
-      } catch (e) {
-        // Cookie clearing failed - non-critical, continue with signout
-      }
-
-      // Force Better Auth to sign out (this will clear cookies and trigger redirect)
-      authClient.signOut()
-        .then(() => {
-          if (isMounted) {
-            // Use generic error code instead of implementation details
-            window.location.href = '/account-auth/login?error=SessionExpired&code=1001';
-          }
-        })
-        .catch((err) => {
-          console.error('[SessionSync] Error during forced signout:', err);
-          if (isMounted) {
-            window.location.href = '/account-auth/login?error=SessionExpired&code=1001';
-          }
-        });
-      
-      return;
-    }
-
-    // Normal flow: Update store based on valid session status
-    if (status === 'authenticated' && isValid) {
-      setSession(session);
-    } else if (status === 'unauthenticated') {
-      clearSession();
-    }
-    
-    // Cleanup function to prevent post-unmount updates
-    return () => {
-      isMounted = false;
-    };
-  }, [session, status, setSession, clearSession]);
-
-  return <>{children}</>;
-}
+'use client';
+
+import { useEffect, useRef } from 'react';
+import { authClient } from '../client/better-auth-client';
+import { useAuthStore } from '../stores/authStore';
+import { isValidSession } from '../lib/session';
+import {
+  getSecureSessionCookieName,
+  getSecureCsrfCookieName,
+  getCallbackUrlCookieName
+} from '../lib/app-slug';
+
+/**
+ * Sanitize sensitive data for logging
+ * Never log full user IDs or emails in any environment
+ */
+function sanitizeForLog(value: string | undefined, type: 'email' | 'userId'): string {
+  if (!value) return '(empty)';
+  
+  if (type === 'email') {
+    return '***@***'; // Never log emails
+  }
+  
+  if (type === 'userId') {
+    // Only show first 8 chars in development
+    if (process.env.NODE_ENV === 'development') {
+      return value.substring(0, 8) + '...';
+    }
+    return '***'; // Fully redact in production
+  }
+  
+  return '***';
+}
+
+/**
+ * SessionSync - Bridges NextAuth session with Zustand auth store
+ * 
+ * CRITICAL: This component enforces strict session validation. If NextAuth
+ * reports an authenticated status but the session data is invalid (empty user ID,
+ * empty email, or missing access token), it forces a sign-out to prevent
+ * contradictory state like "hasSession: true, userId: ''"
+ * 
+ * This ensures the app NEVER shows authenticated UI with empty/invalid session data.
+ */
+export function SessionSync({ children }: { children: React.ReactNode }) {
+  const { data: sessionData, isPending } = authClient.useSession();
+  const session = sessionData;
+  const status = isPending ? 'loading' : session ? 'authenticated' : 'unauthenticated';
+  const { setSession, clearSession } = useAuthStore();
+  
+  // Guard against duplicate sign-out calls
+  const isSigningOutRef = useRef(false);
+
+  useEffect(() => {
+    let isMounted = true;
+    
+    // Only process when NextAuth has finished loading
+    if (status === 'loading') {
+      return;
+    }
+
+    // Strict validation: Check if session is actually valid
+    const isValid = isValidSession(session);
+
+    // CRITICAL FIX: If NextAuth says "authenticated" but session is invalid,
+    // this is a broken state that must be fixed immediately
+    if (status === 'authenticated' && !isValid) {
+      // GUARD: Prevent duplicate sign-out
+      if (isSigningOutRef.current) {
+        console.warn('[SessionSync] Sign-out already in progress, skipping');
+        return;
+      }
+      isSigningOutRef.current = true;
+      
+      console.error('[SessionSync] CRITICAL: Invalid session detected despite authenticated status!');
+      console.error('[SessionSync] This indicates a session with empty user data - forcing sign-out');
+      
+      // Log diagnostic info with PII redaction
+      // Note: session is typed as Session | null from NextAuth, but may have invalid/partial data
+      const sessionData = session as any; // Explicit cast needed for error logging
+      console.error('[SessionSync] Session data:', {
+        hasSessionObject: !!sessionData,
+        hasUser: !!sessionData?.user,
+        userId: sanitizeForLog(sessionData?.user?.id, 'userId'),
+        userEmail: sanitizeForLog(sessionData?.user?.email, 'email'),
+        hasAccessToken: !!sessionData?.accessToken,
+      });
+      
+      // Clear the auth store immediately
+      clearSession();
+
+      // FIX: Force clear all auth cookies including stale provisional tokens (app-slug prefixed)
+      // This prevents infinite loop when provisional token exists but session is invalid
+      // Root cause: OAuth creates provisional token before Redis session exists
+      try {
+        const secureSession = getSecureSessionCookieName();
+        const secureCsrf = getSecureCsrfCookieName();
+        const callbackUrl = getCallbackUrlCookieName();
+        document.cookie = `${secureSession}=; path=/; expires=Thu, 01 Jan 1970 00:00:00 UTC; Secure; SameSite=Lax`;
+        document.cookie = `${secureCsrf}=; path=/; expires=Thu, 01 Jan 1970 00:00:00 UTC; SameSite=Lax`;
+        document.cookie = `__Secure-${callbackUrl}=; path=/; expires=Thu, 01 Jan 1970 00:00:00 UTC; Secure; SameSite=Lax`;
+      } catch (e) {
+        // Cookie clearing failed - non-critical, continue with signout
+      }
+
+      // Force Better Auth to sign out (this will clear cookies and trigger redirect)
+      authClient.signOut()
+        .then(() => {
+          if (isMounted) {
+            // Use generic error code instead of implementation details
+            window.location.href = '/account-auth/login?error=SessionExpired&code=1001';
+          }
+        })
+        .catch((err) => {
+          console.error('[SessionSync] Error during forced signout:', err);
+          if (isMounted) {
+            window.location.href = '/account-auth/login?error=SessionExpired&code=1001';
+          }
+        });
+      
+      return;
+    }
+
+    // Normal flow: Update store based on valid session status
+    if (status === 'authenticated' && isValid) {
+      setSession(session);
+    } else if (status === 'unauthenticated') {
+      clearSession();
+    }
+    
+    // Cleanup function to prevent post-unmount updates
+    return () => {
+      isMounted = false;
+    };
+  }, [session, status, setSession, clearSession]);
+
+  return <>{children}</>;
+}