Fix profile

frontend/src/ui/api/profileApi.ts

@@ -22,7 +22,13 @@ export async function loadProfile(token: string): Promise<ProfileData | null> {
         });
 
         if (response.ok) {
-            return await response.json();
+            const data = await response.json();
+            // Map backend fields to frontend fields
+            return {
+                profile_picture: data.profile_picture,
+                nickname: data.username,
+                description: data.bio
+            };
         }
         
         return null;
@@ -61,10 +67,19 @@ export async function uploadProfilePicture(token: string, file: Blob): Promise<U
  */
 export async function updateProfile(token: string, data: Partial<ProfileData>): Promise<boolean> {
     try {
+        // Map frontend fields to backend fields
+        const backendData = {
+            nickname: data.nickname,
+            description: data.description
+        };
+
         const response = await fetch(`${API_BASE_URL}/user/profile`, {
             method: 'PUT',
-            headers: getAuthHeaders(token),
-            body: JSON.stringify(data)
+            headers: {
+                ...getAuthHeaders(token),
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify(backendData)
         });
 
         return response.ok;

frontend/src/ui/components/profile/ProfileDialog.tsx

@@ -9,8 +9,9 @@ import { MaterialTextField } from "../core/TextField";
 
 export function ProfileDialog({ isOpen, onOpenChange }: DialogProps) {
     const { profileData, isLoading, isUpdating, updateProfileData, uploadProfilePictureData } = useProfile();
-    const [username, setUsername] = useState("");
-    const [description, setDescription] = useState("");
+
+    const [username, setUsername] = useState(profileData?.nickname ?? "");
+    const [description, setDescription] = useState(profileData?.description ?? "");
     const [selectedImage, setSelectedImage] = useState<File | null>(null);
     const [showCropper, setShowCropper] = useState(false);