scalability: replace direct user API calls with usersApi service

- Replaced imports in UserProfilePage.tsx (getProfileByUsername → usersApi.getProfileByUsername)
- Replaced imports in SettingsPage.tsx (getSettings, updateSettings → usersApi.getSettings, usersApi.updateSettings)
- Replaced imports in ProfileForm.tsx (calculateProfileCompletion → usersApi.calculateProfileCompletion)
- Replaced dynamic imports in avatar-upload.tsx (uploadAvatar, deleteAvatar → usersApi.uploadAvatar, usersApi.deleteAvatar)
- All function calls updated to use usersApi methods
- Test files still use direct imports (acceptable - tests can use implementation details)
- No TypeScript errors related to usersApi
- Action 6.1.1.6 complete

EXHAUSTIVE_TODO_LIST.md

@@ -1986,11 +1986,18 @@ Critical path dependencies:
     - Preserves existing token storage logic in login/register/logout
   - **Rollback**: Restore original auth service
 
-- [ ] **Action 6.1.1.6**: Replace direct API calls with services (users)
+- [x] **Action 6.1.1.6**: Replace direct API calls with services (users)
   - **Scope**: All components importing user API functions - Use `usersApi` instead
-  - **Dependencies**: Action 6.1.1.3 complete
+  - **Dependencies**: Action 6.1.1.3 complete ✅
   - **Risk**: MEDIUM
-  - **Validation**: No direct user API imports
+  - **Validation**: ✅ No direct user API imports in feature components:
+    - Replaced imports in `UserProfilePage.tsx` (getProfileByUsername → usersApi.getProfileByUsername)
+    - Replaced imports in `SettingsPage.tsx` (getSettings, updateSettings → usersApi.getSettings, usersApi.updateSettings)
+    - Replaced imports in `ProfileForm.tsx` (calculateProfileCompletion → usersApi.calculateProfileCompletion)
+    - Replaced dynamic imports in `avatar-upload.tsx` (uploadAvatar, deleteAvatar → usersApi.uploadAvatar, usersApi.deleteAvatar)
+    - All function calls updated to use usersApi methods
+    - Test files still use direct imports (acceptable - tests can use implementation details)
+    - No TypeScript errors related to usersApi
   - **Rollback**: Restore direct imports
 
 - [ ] **Action 6.1.1.7**: Replace direct API calls with services (playlists)

apps/web/src/components/ui/avatar-upload.tsx

@@ -149,22 +149,18 @@ export function AvatarUpload({
   const fileInputRef = useRef<HTMLInputElement>(null);
   const { success: showSuccess, error: showError } = useToast();
 
-  // Dynamically import avatarService to avoid circular dependencies
+  // Dynamically import usersApi to avoid circular dependencies
   const uploadAvatar = useCallback(
     async (file: File) => {
-      const { uploadAvatar: upload } = await import(
-        '@/features/profile/services/avatarService'
-      );
-      return upload(String(userId), file);
+      const { usersApi } = await import('@/services/api/users');
+      return usersApi.uploadAvatar(String(userId), file);
     },
     [userId],
   );
 
   const deleteAvatar = useCallback(async () => {
-    const { deleteAvatar: del } = await import(
-      '@/features/profile/services/avatarService'
-    );
-    return del(String(userId));
+    const { usersApi } = await import('@/services/api/users');
+    return usersApi.deleteAvatar(String(userId));
   }, [userId]);
 
   const validateFile = useCallback(

apps/web/src/features/profile/pages/UserProfilePage.tsx

@@ -1,9 +1,6 @@
 import { useParams, Link } from 'react-router-dom';
 import { useQuery } from '@tanstack/react-query';
-import {
-  getProfileByUsername,
-  type UserProfile,
-} from '../services/profileService';
+import { usersApi, type UserProfile } from '@/services/api/users';
 import { tracksApi } from '@/services/api/tracks';
 import { listPlaylists } from '@/features/playlists/services/playlistService';
 import { LoadingSpinner } from '@/components/ui/loading-spinner';
@@ -36,7 +33,7 @@ export function UserProfilePage() {
       if (!username) {
         throw new Error('Username is required');
       }
-      return getProfileByUsername(username);
+      return usersApi.getProfileByUsername(username);
     },
     enabled: !!username,
     retry: false,

apps/web/src/features/settings/pages/SettingsPage.tsx

@@ -1,6 +1,6 @@
 import { useState, useEffect, useRef } from 'react';
 import { useUser } from '@/features/auth/hooks/useUser';
-import { getSettings, updateSettings } from '../services/settingsService';
+import { usersApi } from '@/services/api/users';
 import { UserSettings } from '../types/settings';
 import { SettingsTabs } from '../components/SettingsTabs';
 import { Button, Card } from '@veza/design-system';
@@ -36,7 +36,7 @@ export function SettingsPage() {
     try {
       setIsLoading(true);
       setQueryError(null);
-      const userSettings = await getSettings(user.id);
+      const userSettings = await usersApi.getSettings(user.id);
       setSettings(userSettings);
     } catch (err) {
       const errorMessage =
@@ -70,7 +70,7 @@ export function SettingsPage() {
 
     // Action 3.4.1.3: Store mutation for retry
     const performMutation = async () => {
-      await updateSettings(user.id, settings);
+      await usersApi.updateSettings(user.id, settings);
       toast.success('Paramètres sauvegardés avec succès');
       setMutationError(null);
       setRetryCount(0);

apps/web/src/features/user/components/ProfileForm.tsx

@@ -14,10 +14,10 @@ import { Progress } from '@/components/ui/progress';
 import { useToast } from '@/hooks/useToast';
 import { usernameSchema, emailSchema } from '@/schemas/validation';
 import {
-  calculateProfileCompletion,
+  usersApi,
   type ProfileCompletion,
   type UpdateProfileRequest,
-} from '@/features/profile/services/profileService';
+} from '@/services/api/users';
 import {
   Twitter,
   Instagram,
@@ -101,7 +101,7 @@ export function ProfileForm() {
   // FE-PAGE-003: Load profile completion
   useEffect(() => {
     if (user?.id) {
-      calculateProfileCompletion(user.id)
+      usersApi.calculateProfileCompletion(user.id)
         .then(setCompletion)
         .catch((err) => {
           logger.error('Failed to load profile completion:', err);
@@ -206,7 +206,7 @@ export function ProfileForm() {
 
       // Refresh completion
       if (user.id) {
-        const newCompletion = await calculateProfileCompletion(user.id);
+        const newCompletion = await usersApi.calculateProfileCompletion(user.id);
         setCompletion(newCompletion);
       }