feat: Add email field to profile edit form

- Add email input field to profile edit form
- Display current email or 'No email address set' message
- Show helpful hint when adding email for the first time
- Update backend to accept email in profile updates
- Add email uniqueness validation
- Allow users to add/update/remove email address
- Support empty string to remove email (converts to null)

Users can now add or update their email address from the profile page, enabling them to receive email notifications.

src/pages/UserProfilePage.tsx

@@ -39,6 +39,7 @@ export function UserProfilePage() {
     firstName: '',
     lastName: '',
     username: '',
+    email: '',
   });
   const [notificationPreferences, setNotificationPreferences] = useState<NotificationPreferences>({
     notificationEmail: true,
@@ -86,6 +87,7 @@ export function UserProfilePage() {
         firstName: profileData.firstName || '',
         lastName: profileData.lastName || '',
         username: profileData.username || '',
+        email: profileData.email || '',
       });
 
       // Set notification preferences from profile
@@ -112,6 +114,7 @@ export function UserProfilePage() {
         firstName: profile.firstName || '',
         lastName: profile.lastName || '',
         username: profile.username || '',
+        email: profile.email || '',
       });
     }
   };
@@ -235,6 +238,20 @@ export function UserProfilePage() {
                       placeholder="Username"
                       className="px-3 py-1 border border-gray-300 rounded-md w-full"
                     />
+                    <div className="relative">
+                      <input
+                        type="email"
+                        value={editForm.email}
+                        onChange={(e) => setEditForm({ ...editForm, email: e.target.value })}
+                        placeholder="Email address (optional)"
+                        className="px-3 py-1 border border-gray-300 rounded-md w-full"
+                      />
+                      {!profile.email && (
+                        <p className="text-xs text-blue-600 mt-1">
+                          💡 Add an email to receive email notifications
+                        </p>
+                      )}
+                    </div>
                   </div>
                 ) : (
                   <>
@@ -244,6 +261,16 @@ export function UserProfilePage() {
                         : profile.username}
                     </h1>
                     <p className="text-gray-600">@{profile.username}</p>
+                    {!profile.email && (
+                      <p className="text-sm text-amber-600 mt-1">
+                        📧 No email address set
+                      </p>
+                    )}
+                    {profile.email && (
+                      <p className="text-sm text-gray-500 mt-1">
+                        📧 {profile.email}
+                      </p>
+                    )}
                   </>
                 )}
               </div>

src/services/userService.ts

@@ -31,6 +31,7 @@ export interface UpdateProfileDTO {
   firstName?: string;
   lastName?: string;
   username?: string;
+  email?: string;
 }
 
 export interface NotificationPreferences {