feat: Implement cancel functionality in settings forms to revert to the last saved state and disable the cancel button when no changes are made.

src/components/settings/ProfileSettingsForm.tsx

@@ -330,19 +330,15 @@ export function ProfileSettingsForm({
     }
   };
 
+  const hasChanges = originalData
+    ? JSON.stringify(formData) !== JSON.stringify(originalData)
+    : false;
+
   const handleCancel = () => {
-    // Reset to original fetched data (including phone)
+    if (!hasChanges) return;
+    // Reset to last saved data
     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,
-        firstName: nameParts[0] || prev.firstName,
-        lastName: nameParts.slice(1).join(' ') || prev.lastName,
-        email: session.user?.email || prev.email,
-      }));
     }
     setError(null);
     setSuccessMessage(null);
@@ -528,8 +524,8 @@ export function ProfileSettingsForm({
       <div className="mt-8 flex justify-end gap-3">
         <button
           onClick={handleCancel}
-          disabled={isSaving}
-          className="px-8 py-3 border border-[#00293D]/30 text-[#00293D] rounded-[10px] font-serif font-medium text-[14px] hover:bg-[#00293d]/5 transition-colors disabled:opacity-50"
+          disabled={isSaving || !hasChanges}
+          className="px-8 py-3 border border-[#00293D]/30 text-[#00293D] rounded-[10px] font-serif font-medium text-[14px] hover:bg-[#00293d]/5 transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
         >
           Cancel
         </button>