feat: Implement dynamic city and state retrieval and display for profiles, utilizing new data mapping and updated UI logic.

src/app/(user)/user/profiles/page.tsx

@@ -101,22 +101,63 @@ function ProfileCard({ profile }: ProfileCardProps) {
     }
   };
 
-  // Get location string - prefer city/state/country over serviceAreas
+  // Get location string - check dynamic field values first, then fallback to legacy columns
   const getLocation = () => {
-    if (profile.city && profile.state) {
-      return `${profile.city}, ${profile.state}`;
+    let cityValue: string | null = null;
+    let stateValue: string | null = null;
+
+    // Helper to format snake_case to Title Case
+    const formatValue = (v: string) => v.split('_').map(w => w.charAt(0).toUpperCase() + w.slice(1).toLowerCase()).join(' ');
+
+    // First, check fieldValues for state and city (dynamic profile fields)
+    if (profile.fieldValues && profile.fieldValues.length > 0) {
+      const stateField = profile.fieldValues.find(fv => fv.field.slug === 'state');
+      const cityField = profile.fieldValues.find(fv => fv.field.slug === 'city');
+
+      if (stateField && stateField.jsonValue) {
+        const value = stateField.jsonValue;
+        if (Array.isArray(value) && value.length > 0) {
+          // For multiselect, join all selected values
+          stateValue = value.map(v => formatValue(String(v))).join(', ');
+        } else if (typeof value === 'string' && value.trim()) {
+          stateValue = formatValue(value);
+        }
+      }
+
+      if (cityField && cityField.jsonValue) {
+        const value = cityField.jsonValue;
+        if (Array.isArray(value) && value.length > 0) {
+          // For multiselect, join all selected values
+          cityValue = value.map(v => formatValue(String(v))).join(', ');
+        } else if (typeof value === 'string' && value.trim()) {
+          cityValue = formatValue(value);
+        }
+      }
     }
-    if (profile.city && profile.country) {
-      return `${profile.city}, ${profile.country}`;
+
+    // Fallback to legacy profile columns if dynamic fields not found
+    if (!cityValue && profile.city) {
+      cityValue = profile.city;
     }
-    if (profile.state && profile.country) {
-      return `${profile.state}, ${profile.country}`;
+    if (!stateValue && profile.state) {
+      stateValue = profile.state;
     }
-    if (profile.city) {
-      return profile.city;
+
+    // Build location string
+    if (cityValue && stateValue) {
+      return `${cityValue}, ${stateValue}`;
     }
-    if (profile.state) {
-      return profile.state;
+    if (cityValue && profile.country) {
+      return `${cityValue}, ${profile.country}`;
+    }
+    if (stateValue && profile.country) {
+      return `${stateValue}, ${profile.country}`;
+    }
+    if (cityValue) {
+      return cityValue;
+    }
+    if (stateValue) {
+      return stateValue;
     }
     if (profile.country) {
       return profile.country;
@@ -131,9 +172,17 @@ function ProfileCard({ profile }: ProfileCardProps) {
   const getExpertiseTags = (): string[] => {
     const tags: string[] = [];
 
+    // Fields to exclude from tags (they're displayed elsewhere, e.g., state/city shown in location)
+    const excludedFieldSlugs = ['state', 'city', 'description'];
+
     // Add from fieldValues (dynamic profile fields like client_specialization, property_type, loan_type)
     if (profile.fieldValues && profile.fieldValues.length > 0) {
       profile.fieldValues.forEach((fv) => {
+        // Skip excluded fields
+        if (excludedFieldSlugs.includes(fv.field.slug)) {
+          return;
+        }
+
         const value = fv.jsonValue;
         if (Array.isArray(value)) {
           // For multi-select fields, add all selected values