fixed my propries page and fixed the sidebar again mouaz is the best in the west

app/property/[id]/PropertyDetail.js

@@ -94,13 +94,25 @@ function mapApiDetail(item) {
   const allRaw = rawImages.length > 0 ? rawImages : photosFallback;
   const images = allRaw.length > 0 ? allRaw.map(buildImageUrl) : [];
 
-  const services = details.services || {};
+  // Normalize services: Flutter sends list of strings or object with boolean values
+  const rawServices = details.services || {};
+  const serviceList = Array.isArray(rawServices) ? rawServices : Object.keys(rawServices).filter(k => rawServices[k]);
+  const serviceDetails = details.serviceDetails || {};
+  const services = {};
+  serviceList.forEach(s => { services[s] = serviceDetails[s] || true; });
+
   const terms = details.terms || {};
-  const proximity = details.proximity || {};
-  const roomDetails = details.roomDetails || {};
+
+  // Try multiple key aliases like Flutter does
+  const floor = details.floorNumber ?? details.floor ?? 0;
+  const salons = details.numberOfSalons ?? details.salonsCount ?? details.salons ?? 0;
+  const balconies = details.numberOfBalconies ?? details.balconiesCount ?? details.balconies ?? 0;
+  const proximity = details.nearbyDistances || details.proximity || {};
+  const roomDetails = details.room || details.roomDetails || {};
 
   return {
     id: item.id,
+    propertyInformationId: info.id,
     title: details.description || info.address || `عقار #${item.id}`,
     description: details.description || info.description || '',
     type: propType,
@@ -118,9 +130,9 @@ function mapApiDetail(item) {
     bedrooms: info.numberOfBedRooms || 0,
     bathrooms: info.numberOfBathRooms || 0,
     area: info.space || 0,
-    floor: details.floor || 0,
-    salons: details.salons || 0,
-    balconies: details.balconies || 0,
+    floor,
+    salons,
+    balconies,
     images,
     status,
     statusLabel,
@@ -499,66 +511,31 @@ export default function PropertyDetailsPage() {
                     تفاصيل الغرفة
                   </h3>
                   <div className="grid grid-cols-2 md:grid-cols-3 gap-3">
-                    {property.roomDetails.areaType && (
-                      <div className="bg-white rounded-lg p-2 text-center">
-                        <div className="text-xs text-gray-500">نوع المساحة</div>
-                        <div className="font-medium text-sm">{property.roomDetails.areaType}</div>
-                      </div>
-                    )}
-                    {property.roomDetails.peopleAllowed && (
-                      <div className="bg-white rounded-lg p-2 text-center">
-                        <div className="text-xs text-gray-500">عدد الأشخاص</div>
-                        <div className="font-medium text-sm">{property.roomDetails.peopleAllowed}</div>
-                      </div>
-                    )}
-                    {property.roomDetails.furniture && (
-                      <div className="bg-white rounded-lg p-2 text-center">
-                        <div className="text-xs text-gray-500">الأثاث</div>
-                        <div className="font-medium text-sm">{property.roomDetails.furniture}</div>
-                      </div>
-                    )}
-                    {property.roomDetails.entranceType && (
-                      <div className="bg-white rounded-lg p-2 text-center">
-                        <div className="text-xs text-gray-500">نوع المدخل</div>
-                        <div className="font-medium text-sm">{property.roomDetails.entranceType}</div>
-                      </div>
-                    )}
-                    {property.roomDetails.bathroomType && (
-                      <div className="bg-white rounded-lg p-2 text-center">
-                        <div className="text-xs text-gray-500">الحمام</div>
-                        <div className="font-medium text-sm">{property.roomDetails.bathroomType}</div>
-                      </div>
-                    )}
-                    {property.roomDetails.kitchenType && (
-                      <div className="bg-white rounded-lg p-2 text-center">
-                        <div className="text-xs text-gray-500">المطبخ</div>
-                        <div className="font-medium text-sm">{property.roomDetails.kitchenType}</div>
-                      </div>
-                    )}
-                    {property.roomDetails.residents && (
-                      <div className="bg-white rounded-lg p-2 text-center">
-                        <div className="text-xs text-gray-500">عدد السكان</div>
-                        <div className="font-medium text-sm">{property.roomDetails.residents}</div>
-                      </div>
-                    )}
-                    {property.roomDetails.dedicatedTo && (
-                      <div className="bg-white rounded-lg p-2 text-center">
-                        <div className="text-xs text-gray-500">مخصص لـ</div>
-                        <div className="font-medium text-sm">{property.roomDetails.dedicatedTo}</div>
-                      </div>
-                    )}
-                    {property.roomDetails.visitors && (
-                      <div className="bg-white rounded-lg p-2 text-center">
-                        <div className="text-xs text-gray-500">الزوار</div>
-                        <div className="font-medium text-sm">{property.roomDetails.visitors ? 'مسموح' : 'ممنوع'}</div>
-                      </div>
-                    )}
-                    {property.roomDetails.quietTimes && (
-                      <div className="bg-white rounded-lg p-2 text-center">
-                        <div className="text-xs text-gray-500">أوقات الهدوء</div>
-                        <div className="font-medium text-sm">{property.roomDetails.quietTimes}</div>
-                      </div>
-                    )}
+                    {(() => {
+                      const rd = property.roomDetails;
+                      const items = [];
+                      if (rd.areaType) items.push({ label: 'نوع المساحة', value: rd.areaType === 'private room' ? 'غرفة خاصة' : rd.areaType === 'shared room' ? 'غرفة مشتركة' : rd.areaType });
+                      if (rd.peopleAllowed) items.push({ label: 'عدد الأشخاص', value: rd.peopleAllowed });
+                      if (rd.furnitureDetails || rd.furniture) items.push({ label: 'الأثاث', value: rd.furnitureDetails || rd.furniture });
+                      if (rd.entranceType) items.push({ label: 'نوع المدخل', value: rd.entranceType === 'shared entrance' ? 'مدخل مشترك' : rd.entranceType === 'independent entrance' ? 'مدخل مستقل' : rd.entranceType });
+                      if (rd.bathroomType) items.push({ label: 'الحمام', value: rd.bathroomType === 'room specific' ? 'خاص بالغرفة' : rd.bathroomType === 'shared' ? 'مشترك' : rd.bathroomType });
+                      if (rd.kitchenType) items.push({ label: 'المطبخ', value: rd.kitchenType === 'shared' ? 'مشترك' : rd.kitchenType === 'not available' ? 'غير متوفر' : rd.kitchenType });
+                      if (rd.homeResidentsCount ?? rd.residents) items.push({ label: 'عدد السكان', value: rd.homeResidentsCount ?? rd.residents });
+                      if (rd.currentPopulationGender) items.push({ label: 'جنس السكان', value: rd.currentPopulationGender === 'men' ? 'رجال' : rd.currentPopulationGender === 'women' ? 'نساء' : rd.currentPopulationGender === 'family' ? 'عائلة' : rd.currentPopulationGender });
+                      if (rd.dedicatedTo) items.push({ label: 'مخصص لـ', value: rd.dedicatedTo === 'men only' ? 'رجال فقط' : rd.dedicatedTo === 'women only' ? 'نساء فقط' : rd.dedicatedTo === 'families only' ? 'عائلات فقط' : rd.dedicatedTo === 'everyone' ? 'الجميع' : rd.dedicatedTo });
+                      if (rd.hasRestrictedOwnerAreas !== undefined) items.push({ label: 'مناطق ممنوعة', value: rd.hasRestrictedOwnerAreas ? 'نعم' : 'لا' });
+                      if (rd.hasChildren !== undefined) items.push({ label: 'أطفال', value: rd.hasChildren ? 'مسموح' : 'غير مسموح' });
+                      if (rd.hasPets !== undefined) items.push({ label: 'حيوانات أليفة', value: rd.hasPets ? 'مسموح' : 'غير مسموح' });
+                      if (rd.languageDialect) items.push({ label: 'اللغة', value: rd.languageDialect });
+                      if (rd.visitorsAllowed !== undefined) items.push({ label: 'الزوار', value: rd.visitorsAllowed ? 'مسموح' : 'ممنوع' });
+                      if (rd.quietTimesEnabled ?? rd.quietTimes) items.push({ label: 'أوقات الهدوء', value: rd.quietTimesDetails || rd.quietTimes || (rd.quietTimesEnabled ? 'مفعلة' : '') });
+                      return items.map((item, i) => (
+                        <div key={i} className="bg-white rounded-lg p-2 text-center">
+                          <div className="text-xs text-gray-500">{item.label}</div>
+                          <div className="font-medium text-sm">{item.value}</div>
+                        </div>
+                      ));
+                    })()}
                   </div>
                 </div>
               )}