feat: Store original profile data to enable reset functionality on cancel and update after save.

src/components/settings/ProfileSettingsForm.tsx

@@ -52,6 +52,8 @@ export function ProfileSettingsForm({
   const [isSaving, setIsSaving] = useState(false);
   const [error, setError] = useState<string | null>(null);
   const [successMessage, setSuccessMessage] = useState<string | null>(null);
+  // Store original data for cancel/reset functionality
+  const [originalData, setOriginalData] = useState<typeof formData | null>(null);
 
   // Fetch profile data on mount based on user role
   useEffect(() => {
@@ -62,14 +64,16 @@ export function ProfileSettingsForm({
 
         if (role === 'AGENT') {
           const profile = await agentsService.getMyProfile();
-          setFormData({
+          const profileData = {
             firstName: profile.firstName || '',
             lastName: profile.lastName || '',
             career: profile.agentType?.name || 'Real Estate Agent',
             email: profile.email || session?.user?.email || '',
             phone: profile.phone || '',
             location: profile.serviceAreas?.[0] || '',
-          });
+          };
+          setFormData(profileData);
+          setOriginalData(profileData); // Store original for cancel
 
           if (profile.avatar) {
             try {
@@ -81,14 +85,16 @@ export function ProfileSettingsForm({
           }
         } else if (role === 'USER') {
           const profile = await usersService.getMyProfile();
-          setFormData({
+          const profileData = {
             firstName: profile.firstName || '',
             lastName: profile.lastName || '',
             career: '', // Users don't have career/agent type
             email: profile.email || session?.user?.email || '',
             phone: profile.phone || '',
             location: [profile.city, profile.state, profile.country].filter(Boolean).join(', '),
-          });
+          };
+          setFormData(profileData);
+          setOriginalData(profileData); // Store original for cancel
 
           if (profile.avatar) {
             try {
@@ -304,6 +310,8 @@ export function ProfileSettingsForm({
         onSave(formData);
       }
 
+      // Update original data so Cancel will reset to the newly saved values
+      setOriginalData(formData);
       setSuccessMessage('Profile settings saved successfully!');
     } catch (err) {
       console.error('Save failed:', err);
@@ -314,8 +322,11 @@ export function ProfileSettingsForm({
   };
 
   const handleCancel = () => {
-    // Reset to initial data or session data
-    if (session?.user) {
+    // Reset to original fetched data (including phone)
+    if (originalData) {
+      setFormData(originalData);
+    } else if (session?.user) {
+      // Fallback to session data if original not available
       const nameParts = (session.user?.name || '').split(' ');
       setFormData(prev => ({
         ...prev,