nexu-app 2.0.0

package/templates/default/packages/auth/src/providers/AuthContext.tsx

@@ -0,0 +1,435 @@
+'use client';
+
+import React, {
+  createContext,
+  useCallback,
+  useContext,
+  useEffect,
+  useMemo,
+  useReducer,
+  useRef,
+} from 'react';
+
+import type {
+  AuthConfig,
+  AuthError,
+  AuthProvider as AuthProviderType,
+  AuthResponse,
+  AuthSession,
+  AuthState,
+  AuthUser,
+  SignInCredentials,
+  SignUpCredentials,
+  UpdatePasswordRequest,
+  UseAuthReturn,
+} from '../types';
+import { AuthApiClient, createAuthApiClient } from '../utils/api';
+import {
+  clearOAuthState,
+  getProviderConfig,
+  getStoredOAuthState,
+  initiateOAuthFlow,
+  parseOAuthCallback,
+} from '../utils/oauth';
+import { createTokenManager, TokenManager } from '../utils/token';
+
+// ============================================================================
+// State Management
+// ============================================================================
+
+type AuthAction =
+  | { type: 'LOADING' }
+  | { type: 'AUTHENTICATED'; user: AuthUser; session: AuthSession }
+  | { type: 'UNAUTHENTICATED' }
+  | { type: 'ERROR'; error: AuthError }
+  | { type: 'UPDATE_USER'; user: AuthUser }
+  | { type: 'CLEAR_ERROR' };
+
+const initialState: AuthState = {
+  user: null,
+  session: null,
+  isAuthenticated: false,
+  isLoading: true,
+  error: null,
+};
+
+function authReducer(state: AuthState, action: AuthAction): AuthState {
+  switch (action.type) {
+    case 'LOADING':
+      return { ...state, isLoading: true, error: null };
+    case 'AUTHENTICATED':
+      return {
+        user: action.user,
+        session: action.session,
+        isAuthenticated: true,
+        isLoading: false,
+        error: null,
+      };
+    case 'UNAUTHENTICATED':
+      return {
+        user: null,
+        session: null,
+        isAuthenticated: false,
+        isLoading: false,
+        error: null,
+      };
+    case 'ERROR':
+      return { ...state, isLoading: false, error: action.error };
+    case 'UPDATE_USER':
+      return { ...state, user: action.user };
+    case 'CLEAR_ERROR':
+      return { ...state, error: null };
+    default:
+      return state;
+  }
+}
+
+// ============================================================================
+// Context
+// ============================================================================
+
+interface AuthContextValue extends UseAuthReturn {
+  config: AuthConfig;
+  tokenManager: TokenManager;
+  apiClient: AuthApiClient;
+}
+
+const AuthContext = createContext<AuthContextValue | null>(null);
+
+// ============================================================================
+// Provider
+// ============================================================================
+
+interface AuthProviderProps {
+  children: React.ReactNode;
+  config: AuthConfig;
+}
+
+export function AuthProvider({ children, config }: AuthProviderProps) {
+  const [state, dispatch] = useReducer(authReducer, initialState);
+
+  // Create stable instances
+  const tokenManager = useMemo(
+    () => createTokenManager(config),
+    [config.tokenStorage, config.cookieOptions]
+  );
+
+  const apiClient = useMemo(
+    () => createAuthApiClient(config, tokenManager),
+    [config, tokenManager]
+  );
+
+  // Ref for auto-refresh interval
+  const refreshIntervalRef = useRef<NodeJS.Timeout | null>(null);
+
+  // Helper to create session from response
+  const createSession = useCallback(
+    (response: AuthResponse, provider: AuthProviderType = 'email'): AuthSession => {
+      return {
+        user: response.user,
+        accessToken: response.accessToken,
+        refreshToken: response.refreshToken,
+        expiresAt: Date.now() + response.expiresIn * 1000,
+        provider,
+      };
+    },
+    []
+  );
+
+  // Handle successful authentication
+  const handleAuthSuccess = useCallback(
+    async (response: AuthResponse, provider: AuthProviderType = 'email') => {
+      const session = createSession(response, provider);
+
+      tokenManager.setAccessToken(response.accessToken, response.expiresIn);
+      if (response.refreshToken) {
+        tokenManager.setRefreshToken(response.refreshToken);
+      }
+
+      dispatch({ type: 'AUTHENTICATED', user: response.user, session });
+
+      // Call callback if provided
+      if (config.callbacks?.onSignIn) {
+        await config.callbacks.onSignIn(response.user, session);
+      }
+    },
+    [config.callbacks, tokenManager, createSession]
+  );
+
+  // Sign in with credentials
+  const signIn = useCallback(
+    async (credentials: SignInCredentials): Promise<AuthResponse> => {
+      dispatch({ type: 'LOADING' });
+
+      try {
+        const response = await apiClient.signIn(credentials);
+        await handleAuthSuccess(response, 'email');
+        return response;
+      } catch (error) {
+        const authError = error as AuthError;
+        dispatch({ type: 'ERROR', error: authError });
+        config.callbacks?.onError?.(authError);
+        throw error;
+      }
+    },
+    [apiClient, handleAuthSuccess, config.callbacks]
+  );
+
+  // Sign up with credentials
+  const signUp = useCallback(
+    async (credentials: SignUpCredentials): Promise<AuthResponse> => {
+      dispatch({ type: 'LOADING' });
+
+      try {
+        const response = await apiClient.signUp(credentials);
+        await handleAuthSuccess(response, 'email');
+        return response;
+      } catch (error) {
+        const authError = error as AuthError;
+        dispatch({ type: 'ERROR', error: authError });
+        config.callbacks?.onError?.(authError);
+        throw error;
+      }
+    },
+    [apiClient, handleAuthSuccess, config.callbacks]
+  );
+
+  // Sign out
+  const signOut = useCallback(async (): Promise<void> => {
+    try {
+      await apiClient.signOut();
+    } catch {
+      // Ignore sign out errors
+    } finally {
+      tokenManager.clearTokens();
+      dispatch({ type: 'UNAUTHENTICATED' });
+      void config.callbacks?.onSignOut?.();
+    }
+  }, [apiClient, tokenManager, config.callbacks]);
+
+  // Sign in with OAuth provider
+  const signInWithProvider = useCallback(
+    async (provider: AuthProviderType): Promise<void> => {
+      const providerConfig = getProviderConfig(provider, config.providers);
+
+      if (!providerConfig) {
+        throw new Error(`Provider ${provider} is not configured`);
+      }
+
+      await initiateOAuthFlow(provider, providerConfig);
+    },
+    [config.providers]
+  );
+
+  // Refresh session
+  const refreshSession = useCallback(async (): Promise<AuthSession | null> => {
+    try {
+      const response = await apiClient.refreshToken();
+      const session = createSession(response);
+
+      tokenManager.setAccessToken(response.accessToken, response.expiresIn);
+      if (response.refreshToken) {
+        tokenManager.setRefreshToken(response.refreshToken);
+      }
+
+      dispatch({ type: 'AUTHENTICATED', user: response.user, session });
+
+      return session;
+    } catch {
+      tokenManager.clearTokens();
+      dispatch({ type: 'UNAUTHENTICATED' });
+      config.callbacks?.onSessionExpired?.();
+      return null;
+    }
+  }, [apiClient, tokenManager, createSession, config.callbacks]);
+
+  // Reset password
+  const resetPassword = useCallback(
+    async (email: string): Promise<void> => {
+      await apiClient.resetPassword(email);
+    },
+    [apiClient]
+  );
+
+  // Update password
+  const updatePassword = useCallback(
+    async (request: UpdatePasswordRequest): Promise<void> => {
+      await apiClient.updatePassword(request);
+    },
+    [apiClient]
+  );
+
+  // Update user
+  const updateUser = useCallback(
+    async (data: Partial<AuthUser>): Promise<AuthUser> => {
+      const user = await apiClient.updateUser(data);
+      dispatch({ type: 'UPDATE_USER', user });
+      return user;
+    },
+    [apiClient]
+  );
+
+  // Verify email
+  const verifyEmail = useCallback(
+    async (token: string): Promise<void> => {
+      await apiClient.verifyEmail(token);
+    },
+    [apiClient]
+  );
+
+  // Resend verification
+  const resendVerification = useCallback(async (): Promise<void> => {
+    await apiClient.resendVerification();
+  }, [apiClient]);
+
+  // Initialize auth state
+  useEffect(() => {
+    const initializeAuth = async () => {
+      // Check for OAuth callback
+      const callbackParams = parseOAuthCallback();
+      if (callbackParams?.code) {
+        const pathParts = window.location.pathname.split('/');
+        const provider = pathParts[pathParts.length - 1] as AuthProviderType;
+        const storedState = getStoredOAuthState(provider);
+
+        if (storedState && callbackParams.state === storedState.state) {
+          try {
+            const response = await apiClient.exchangeOAuthCode(
+              provider,
+              callbackParams.code,
+              callbackParams.state
+            );
+            await handleAuthSuccess(response, provider);
+            clearOAuthState(provider);
+
+            // Clean URL
+            window.history.replaceState({}, '', window.location.pathname);
+            return;
+          } catch (error) {
+            clearOAuthState(provider);
+            dispatch({ type: 'ERROR', error: error as AuthError });
+            return;
+          }
+        }
+      }
+
+      // Check for existing token
+      const token = tokenManager.getAccessToken();
+
+      if (!token) {
+        dispatch({ type: 'UNAUTHENTICATED' });
+        return;
+      }
+
+      // Validate token and get user
+      if (tokenManager.isTokenExpired(token)) {
+        // Try to refresh
+        const refreshToken = tokenManager.getRefreshToken();
+        if (refreshToken) {
+          await refreshSession();
+        } else {
+          tokenManager.clearTokens();
+          dispatch({ type: 'UNAUTHENTICATED' });
+        }
+        return;
+      }
+
+      // Token is valid, get user
+      try {
+        const user = await apiClient.getUser();
+        const session: AuthSession = {
+          user,
+          accessToken: token,
+          refreshToken: tokenManager.getRefreshToken() || undefined,
+          expiresAt: tokenManager.getTokenExpiration(token) || Date.now() + 3600000,
+          provider: 'email', // Will be updated from token if available
+        };
+
+        dispatch({ type: 'AUTHENTICATED', user, session });
+      } catch {
+        tokenManager.clearTokens();
+        dispatch({ type: 'UNAUTHENTICATED' });
+      }
+    };
+
+    void initializeAuth();
+  }, [apiClient, tokenManager, refreshSession, handleAuthSuccess]);
+
+  // Set up auto-refresh
+  useEffect(() => {
+    if (config.autoRefresh === false) return;
+    if (!state.isAuthenticated) return;
+
+    const threshold = (config.refreshThreshold || 300) * 1000;
+    const checkInterval = Math.min(threshold / 2, 60000); // Check at least every minute
+
+    refreshIntervalRef.current = setInterval(() => {
+      if (tokenManager.shouldRefresh(config.refreshThreshold || 300)) {
+        void refreshSession();
+      }
+    }, checkInterval);
+
+    return () => {
+      if (refreshIntervalRef.current) {
+        clearInterval(refreshIntervalRef.current);
+      }
+    };
+  }, [
+    config.autoRefresh,
+    config.refreshThreshold,
+    state.isAuthenticated,
+    tokenManager,
+    refreshSession,
+  ]);
+
+  const value: AuthContextValue = useMemo(
+    () => ({
+      ...state,
+      config,
+      tokenManager,
+      apiClient,
+      signIn,
+      signUp,
+      signOut,
+      signInWithProvider,
+      refreshSession,
+      resetPassword,
+      updatePassword,
+      updateUser,
+      verifyEmail,
+      resendVerification,
+    }),
+    [
+      state,
+      config,
+      tokenManager,
+      apiClient,
+      signIn,
+      signUp,
+      signOut,
+      signInWithProvider,
+      refreshSession,
+      resetPassword,
+      updatePassword,
+      updateUser,
+      verifyEmail,
+      resendVerification,
+    ]
+  );
+
+  return <AuthContext.Provider value={value}>{children}</AuthContext.Provider>;
+}
+
+// ============================================================================
+// Hook
+// ============================================================================
+
+export function useAuthContext(): AuthContextValue {
+  const context = useContext(AuthContext);
+
+  if (!context) {
+    throw new Error('useAuthContext must be used within an AuthProvider');
+  }
+
+  return context;
+}

package/templates/default/packages/auth/src/providers/index.ts

@@ -0,0 +1 @@
+export { AuthProvider, useAuthContext } from './AuthContext';

package/templates/default/packages/auth/src/types/index.ts

@@ -0,0 +1,284 @@
+// ============================================================================
+// User Types
+// ============================================================================
+
+export interface AuthUser {
+  id: string;
+  email: string;
+  name?: string;
+  avatar?: string;
+  emailVerified?: boolean;
+  provider?: AuthProvider;
+  metadata?: Record<string, unknown>;
+  createdAt?: string;
+  updatedAt?: string;
+}
+
+// ============================================================================
+// Provider Types
+// ============================================================================
+
+export type AuthProvider =
+  | 'email'
+  | 'google'
+  | 'github'
+  | 'facebook'
+  | 'apple'
+  | 'twitter'
+  | 'custom';
+
+export interface OAuthProviderConfig {
+  clientId: string;
+  redirectUri?: string;
+  scope?: string[];
+}
+
+export interface AuthProviderConfig {
+  google?: OAuthProviderConfig;
+  github?: OAuthProviderConfig;
+  facebook?: OAuthProviderConfig;
+  apple?: OAuthProviderConfig;
+  twitter?: OAuthProviderConfig;
+  custom?: {
+    name: string;
+    authorizationUrl: string;
+    tokenUrl: string;
+    clientId: string;
+    redirectUri?: string;
+    scope?: string[];
+  };
+}
+
+// ============================================================================
+// Session & Token Types
+// ============================================================================
+
+export interface AuthSession {
+  user: AuthUser;
+  accessToken: string;
+  refreshToken?: string;
+  expiresAt: number;
+  provider: AuthProvider;
+}
+
+export interface TokenPayload {
+  sub: string;
+  email?: string;
+  name?: string;
+  exp: number;
+  iat: number;
+  [key: string]: unknown;
+}
+
+export type TokenStorage = 'localStorage' | 'cookie' | 'memory';
+
+// ============================================================================
+// Auth State Types
+// ============================================================================
+
+export interface AuthState {
+  user: AuthUser | null;
+  session: AuthSession | null;
+  isAuthenticated: boolean;
+  isLoading: boolean;
+  error: AuthError | null;
+}
+
+export interface AuthError {
+  code: AuthErrorCode;
+  message: string;
+  details?: unknown;
+}
+
+export type AuthErrorCode =
+  | 'INVALID_CREDENTIALS'
+  | 'USER_NOT_FOUND'
+  | 'USER_ALREADY_EXISTS'
+  | 'EMAIL_NOT_VERIFIED'
+  | 'INVALID_TOKEN'
+  | 'TOKEN_EXPIRED'
+  | 'NETWORK_ERROR'
+  | 'PROVIDER_ERROR'
+  | 'UNAUTHORIZED'
+  | 'FORBIDDEN'
+  | 'UNKNOWN_ERROR';
+
+// ============================================================================
+// Auth Config Types
+// ============================================================================
+
+export interface AuthConfig {
+  /**
+   * Base URL for API requests (e.g., '/api/auth' or 'https://api.example.com/auth')
+   */
+  apiBaseUrl: string;
+
+  /**
+   * OAuth providers configuration
+   */
+  providers?: AuthProviderConfig;
+
+  /**
+   * Token storage method
+   * @default 'cookie'
+   */
+  tokenStorage?: TokenStorage;
+
+  /**
+   * Cookie options (only used when tokenStorage is 'cookie')
+   */
+  cookieOptions?: {
+    secure?: boolean;
+    sameSite?: 'strict' | 'lax' | 'none';
+    domain?: string;
+    path?: string;
+  };
+
+  /**
+   * Auto refresh token before expiration
+   * @default true
+   */
+  autoRefresh?: boolean;
+
+  /**
+   * Refresh token before this many seconds before expiration
+   * @default 300 (5 minutes)
+   */
+  refreshThreshold?: number;
+
+  /**
+   * Callback URLs
+   */
+  callbacks?: {
+    onSignIn?: (user: AuthUser, session: AuthSession) => void | Promise<void>;
+    onSignOut?: () => void | Promise<void>;
+    onError?: (error: AuthError) => void;
+    onSessionExpired?: () => void;
+  };
+
+  /**
+   * Custom headers to include in API requests
+   */
+  headers?: Record<string, string>;
+
+  /**
+   * Enable debug mode
+   * @default false
+   */
+  debug?: boolean;
+}
+
+// ============================================================================
+// API Request/Response Types
+// ============================================================================
+
+export interface SignInCredentials {
+  email: string;
+  password: string;
+  remember?: boolean;
+}
+
+export interface SignUpCredentials {
+  email: string;
+  password: string;
+  name?: string;
+  metadata?: Record<string, unknown>;
+}
+
+export interface ResetPasswordRequest {
+  email: string;
+}
+
+export interface UpdatePasswordRequest {
+  currentPassword?: string;
+  newPassword: string;
+  token?: string;
+}
+
+export interface AuthResponse {
+  user: AuthUser;
+  accessToken: string;
+  refreshToken?: string;
+  expiresIn: number;
+}
+
+export interface OAuthCallbackParams {
+  code: string;
+  state?: string;
+  error?: string;
+  errorDescription?: string;
+}
+
+// ============================================================================
+// Hook Return Types
+// ============================================================================
+
+export interface UseAuthReturn extends AuthState {
+  signIn: (credentials: SignInCredentials) => Promise<AuthResponse>;
+  signUp: (credentials: SignUpCredentials) => Promise<AuthResponse>;
+  signOut: () => Promise<void>;
+  signInWithProvider: (provider: AuthProvider) => Promise<void>;
+  refreshSession: () => Promise<AuthSession | null>;
+  resetPassword: (email: string) => Promise<void>;
+  updatePassword: (request: UpdatePasswordRequest) => Promise<void>;
+  updateUser: (data: Partial<AuthUser>) => Promise<AuthUser>;
+  verifyEmail: (token: string) => Promise<void>;
+  resendVerification: () => Promise<void>;
+}
+
+export interface UseSessionReturn {
+  session: AuthSession | null;
+  isLoading: boolean;
+  refresh: () => Promise<AuthSession | null>;
+  isValid: () => boolean;
+  getToken: () => string | null;
+}
+
+export interface UseUserReturn {
+  user: AuthUser | null;
+  isLoading: boolean;
+  update: (data: Partial<AuthUser>) => Promise<AuthUser>;
+  refresh: () => Promise<AuthUser | null>;
+}
+
+// ============================================================================
+// Component Props Types
+// ============================================================================
+
+export interface SignInFormProps {
+  onSuccess?: (response: AuthResponse) => void;
+  onError?: (error: AuthError) => void;
+  providers?: AuthProvider[];
+  showRememberMe?: boolean;
+  showForgotPassword?: boolean;
+  forgotPasswordUrl?: string;
+  signUpUrl?: string;
+  redirectUrl?: string;
+  className?: string;
+}
+
+export interface SignUpFormProps {
+  onSuccess?: (response: AuthResponse) => void;
+  onError?: (error: AuthError) => void;
+  providers?: AuthProvider[];
+  showName?: boolean;
+  signInUrl?: string;
+  redirectUrl?: string;
+  className?: string;
+}
+
+export interface SocialButtonsProps {
+  providers: AuthProvider[];
+  onSuccess?: (provider: AuthProvider) => void;
+  onError?: (error: AuthError) => void;
+  mode?: 'signin' | 'signup';
+  className?: string;
+}
+
+export interface ProtectedRouteProps {
+  children: React.ReactNode;
+  fallback?: React.ReactNode;
+  redirectTo?: string;
+  roles?: string[];
+  permissions?: string[];
+}