@djangocfg/api 2.1.10 → 2.1.14

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@djangocfg/api",
-  "version": "2.1.10",
+  "version": "2.1.14",
   "description": "Auto-generated TypeScript API client with React hooks, SWR integration, and Zod validation for Django REST Framework backends",
   "keywords": [
     "django",
@@ -40,30 +40,20 @@
       "import": "./dist/index.mjs",
       "require": "./dist/index.cjs"
     },
-    "./cfg/generated": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.cjs"
-    },
-    "./cfg/generated/hooks": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.cjs"
+    "./hooks": {
+      "types": "./dist/hooks.d.ts",
+      "import": "./dist/hooks.mjs",
+      "require": "./dist/hooks.cjs"
     },
-    "./cfg/generated/fetchers": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.cjs"
-    },
-    "./cfg/generated/schemas": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.cjs"
+    "./auth": {
+      "types": "./dist/auth.d.ts",
+      "import": "./dist/auth.mjs",
+      "require": "./dist/auth.cjs"
     },
-    "./server": {
-      "types": "./dist/server.d.ts",
-      "import": "./dist/server.mjs",
-      "require": "./dist/server.cjs"
+    "./auth/server": {
+      "types": "./dist/auth-server.d.ts",
+      "import": "./dist/auth-server.mjs",
+      "require": "./dist/auth-server.cjs"
     }
   },
   "files": [
@@ -79,14 +69,20 @@
     "check": "tsc --noEmit"
   },
   "peerDependencies": {
+    "@djangocfg/ui-nextjs": "^2.1.14",
     "consola": "^3.4.2",
+    "next": "^14 || ^15",
     "p-retry": "^7.0.0",
-    "swr": "^2.3.0",
+    "react": "^18 || ^19",
+    "swr": "^2.3.7",
     "zod": "^4.1.13"
   },
   "devDependencies": {
     "@types/node": "^24.7.2",
-    "@djangocfg/typescript-config": "^2.1.10",
+    "@types/react": "^19.0.0",
+    "@djangocfg/typescript-config": "^2.1.14",
+    "next": "^15.0.0",
+    "react": "^19.0.0",
     "tsup": "^8.5.0",
     "typescript": "^5.9.3"
   }

package/src/auth/context/AccountsContext.tsx

@@ -0,0 +1,245 @@
+/**
+ * Accounts Context
+ *
+ * Manages user authentication and profile operations using generated SWR hooks
+ *
+ * Features:
+ * - OTP-based authentication
+ * - User profile management
+ * - Avatar upload
+ * - Profile updates
+ * - localStorage cache with TTL (1 hour)
+ */
+
+"use client";
+
+import { createContext, useContext, ReactNode, useState, useCallback, useRef, useEffect } from 'react';
+import { getCachedProfile, setCachedProfile, clearProfileCache } from '../hooks/useProfileCache';
+import { authLogger } from '../utils/logger';
+// Import API instance and fetcher
+import { api as apiAccounts, getAccountsProfileRetrieve } from '../../';
+// Import types from generated API
+import type {
+  User,
+  UserProfileUpdateRequest,
+  PatchedUserProfileUpdateRequest,
+  OTPRequestRequest,
+  OTPVerifyRequest,
+  OTPRequestResponse,
+  OTPVerifyResponse,
+  TokenRefresh,
+  API,
+} from '../../generated/cfg_accounts';
+// Import schema
+import { PatchedUserProfileUpdateRequestSchema } from '../../generated/cfg_accounts';
+// Import hooks from generated API hooks
+import {
+  usePartialUpdateAccountsProfilePartialUpdate,
+  useUpdateAccountsProfileUpdateUpdate,
+  useCreateAccountsProfileAvatarCreate,
+  useCreateAccountsOtpRequestCreate,
+  useCreateAccountsOtpVerifyCreate,
+  useCreateAccountsTokenRefreshCreate,
+} from '../../generated/cfg_accounts/_utils/hooks';
+
+// Re-export schemas for external use
+export { PatchedUserProfileUpdateRequestSchema };
+export type { PatchedUserProfileUpdateRequest };
+
+// ─────────────────────────────────────────────────────────────────────────
+// Context Type
+// ─────────────────────────────────────────────────────────────────────────
+
+export interface AccountsContextValue {
+  // Current user profile
+  profile?: User;
+  isLoadingProfile: boolean;
+  profileError: Error | null;
+
+  // Profile operations
+  updateProfile: (data: UserProfileUpdateRequest) => Promise<User>;
+  partialUpdateProfile: (data: PatchedUserProfileUpdateRequest) => Promise<User>;
+  uploadAvatar: (formData: FormData) => Promise<User>;
+  refreshProfile: (callerId?: string) => Promise<User | undefined>;
+
+  // Authentication
+  requestOTP: (data: OTPRequestRequest) => Promise<OTPRequestResponse>;
+  verifyOTP: (data: OTPVerifyRequest) => Promise<OTPVerifyResponse>;
+  refreshToken: (refresh: string) => Promise<TokenRefresh>;
+  logout: () => void;
+}
+
+// ─────────────────────────────────────────────────────────────────────────
+// Context
+// ─────────────────────────────────────────────────────────────────────────
+
+const AccountsContext = createContext<AccountsContextValue | undefined>(undefined);
+
+// ─────────────────────────────────────────────────────────────────────────
+// Provider Component
+// ─────────────────────────────────────────────────────────────────────────
+
+interface AccountsProviderProps {
+  children: ReactNode;
+}
+
+export function AccountsProvider({ children }: AccountsProviderProps) {
+  // State management with localStorage cache
+  const [profile, setProfile] = useState<User | undefined>(() => {
+    // Initialize from cache on mount
+    const cached = getCachedProfile();
+    return cached || undefined;
+  });
+  const [isLoadingProfile, setIsLoadingProfile] = useState(false);
+  const [profileError, setProfileError] = useState<Error | null>(null);
+
+  // Use refs to access current state without adding to dependencies
+  const profileRef = useRef<User | undefined>(profile);
+  const isLoadingRef = useRef(false);
+
+  // Keep refs in sync with state
+  useEffect(() => {
+    profileRef.current = profile;
+  }, [profile]);
+
+  useEffect(() => {
+    isLoadingRef.current = isLoadingProfile;
+  }, [isLoadingProfile]);
+
+  // Mutation hooks
+  const updateMutation = useUpdateAccountsProfileUpdateUpdate();
+  const partialUpdateMutation = usePartialUpdateAccountsProfilePartialUpdate();
+  const avatarMutation = useCreateAccountsProfileAvatarCreate();
+  const otpRequestMutation = useCreateAccountsOtpRequestCreate();
+  const otpVerifyMutation = useCreateAccountsOtpVerifyCreate();
+  const tokenRefreshMutation = useCreateAccountsTokenRefreshCreate();
+
+  // Refresh profile - fetch and cache with stable callback
+  const refreshProfile = useCallback(async (callerId?: string): Promise<User | undefined> => {
+    // Use refs to check current state without creating dependency
+    const currentProfile = profileRef.current;
+    const currentLoading = isLoadingRef.current;
+
+    // Prevent duplicate calls if profile is already loaded and not loading
+    if (currentProfile && !currentLoading) {
+      authLogger.debug(`Profile already loaded, returning cached (caller: ${callerId})`);
+      return currentProfile;
+    }
+
+    setIsLoadingProfile(true);
+    isLoadingRef.current = true;
+    setProfileError(null);
+    try {
+      // Log caller for debugging excessive API calls using consola logger
+      if (callerId) {
+        authLogger.debug(`Profile refresh called by: ${callerId}`);
+      }
+      const result = await getAccountsProfileRetrieve(apiAccounts);
+      setProfile(result);
+      profileRef.current = result;
+      // Save to cache with 1 hour TTL
+      setCachedProfile(result);
+      return result;
+    } catch (error) {
+      const err = error instanceof Error ? error : new Error('Failed to fetch profile');
+      setProfileError(err);
+      throw err;
+    } finally {
+      setIsLoadingProfile(false);
+      isLoadingRef.current = false;
+    }
+  }, []); // Empty dependencies - callback is stable
+
+  // Update profile (full)
+  const updateProfile = async (data: UserProfileUpdateRequest): Promise<User> => {
+    const result = await updateMutation(data, apiAccounts);
+    await refreshProfile('AccountsContext.updateProfile');
+    return result as User;
+  };
+
+  // Partial update profile
+  const partialUpdateProfile = async (data: PatchedUserProfileUpdateRequest): Promise<User> => {
+    const result = await partialUpdateMutation(data, apiAccounts);
+    await refreshProfile('AccountsContext.partialUpdateProfile');
+    return result as User;
+  };
+
+  // Upload avatar
+  const uploadAvatar = async (formData: FormData): Promise<User> => {
+    const result = await avatarMutation(formData, apiAccounts);
+    await refreshProfile('AccountsContext.uploadAvatar');
+    return result as User;
+  };
+
+  // Request OTP
+  const requestOTP = async (data: OTPRequestRequest): Promise<OTPRequestResponse> => {
+    const result = await otpRequestMutation(data, apiAccounts);
+    return result as OTPRequestResponse;
+  };
+
+  // Verify OTP
+  const verifyOTP = async (data: OTPVerifyRequest): Promise<OTPVerifyResponse> => {
+    const result = await otpVerifyMutation(data, apiAccounts);
+
+    // Automatically save tokens after successful verification
+    if (result.access && result.refresh) {
+      apiAccounts.setToken(result.access, result.refresh);
+      // Refresh profile to load user data with new token
+      await refreshProfile('AccountsContext.verifyOTP');
+    }
+
+    return result as OTPVerifyResponse;
+  };
+
+  // Refresh token
+  const refreshToken = async (refresh: string): Promise<TokenRefresh> => {
+    const result = await tokenRefreshMutation({ refresh }, apiAccounts);
+
+    // Automatically save new access token
+    if (result.access) {
+      apiAccounts.setToken(result.access, refresh);
+    }
+
+    return result as TokenRefresh;
+  };
+
+  // Logout - clear tokens, profile state, and cache
+  const logout = useCallback(() => {
+    apiAccounts.clearTokens();
+    setProfile(undefined);
+    setProfileError(null);
+    clearProfileCache();
+  }, []);
+
+  const value: AccountsContextValue = {
+    profile,
+    isLoadingProfile,
+    profileError,
+    updateProfile,
+    partialUpdateProfile,
+    uploadAvatar,
+    refreshProfile,
+    requestOTP,
+    verifyOTP,
+    refreshToken,
+    logout,
+  };
+
+  return (
+    <AccountsContext.Provider value={value}>
+      {children}
+    </AccountsContext.Provider>
+  );
+}
+
+// ─────────────────────────────────────────────────────────────────────────
+// Hook
+// ─────────────────────────────────────────────────────────────────────────
+
+export function useAccountsContext(): AccountsContextValue {
+  const context = useContext(AccountsContext);
+  if (!context) {
+    throw new Error('useAccountsContext must be used within AccountsProvider');
+  }
+  return context;
+}