From 8d48fcae998b71e75f6429900379f8ae6796c8af Mon Sep 17 00:00:00 2001
From: mouazkh <mouazalkhatib2013@gmail.com>
Date: Mon, 25 May 2026 23:07:29 +0300
Subject: [PATCH] fixed my propries page and fixed the sidebar again mouaz is
 the best in the west

---
 app/owner/properties/page.js        | 26 ++++++++++++++++++++++----
 app/property/[id]/PropertyDetail.js | 10 +++++++++-
 2 files changed, 31 insertions(+), 5 deletions(-)

diff --git a/app/owner/properties/page.js b/app/owner/properties/page.js
index e9594f3..bf831be 100644
--- a/app/owner/properties/page.js
+++ b/app/owner/properties/page.js
@@ -201,7 +201,7 @@ const PropertyViewModal = ({ isOpen, onClose, property }) => {
 
             <div className="bg-gray-50 p-4 rounded-xl">
               <h4 className="font-bold text-gray-700 mb-3">التفاصيل</h4>
-              <div className="grid grid-cols-3 gap-2">
+              <div className="grid grid-cols-4 gap-2">
                 <div className="text-center">
                   <Bed className="w-5 h-5 text-amber-500 mx-auto mb-1" />
                   <span className="text-sm font-bold">{property.bedrooms}</span>
@@ -238,6 +238,13 @@ const PropertyViewModal = ({ isOpen, onClose, property }) => {
                     <span className="text-xs text-gray-500 block">بلكونات</span>
                   </div>
                 )}
+                {property.bookedCount > 0 && (
+                  <div className="text-center">
+                    <Calendar className="w-5 h-5 text-amber-500 mx-auto mb-1" />
+                    <span className="text-sm font-bold">{property.bookedCount}</span>
+                    <span className="text-xs text-gray-500 block">حجوزات</span>
+                  </div>
+                )}
               </div>
             </div>
           </div>
@@ -267,7 +274,7 @@ const PropertyViewModal = ({ isOpen, onClose, property }) => {
                 ) : (
                   Object.entries(property.services).map(([key, value]) => {
                     if (!value) return null;
-                    const detail = typeof value === 'object' && value.detail ? value.detail : null;
+                    const detail = typeof value === 'object' && value.detail ? value.detail : (typeof value === 'string' ? value : null);
                     return (
                       <span key={key} className="inline-flex items-center gap-1 px-3 py-1 bg-green-100 text-green-800 rounded-full text-sm">
                         {serviceLabels[key] || key}
@@ -773,6 +780,15 @@ export default function OwnerPropertiesPage() {
 
       console.log('[OwnerProperties] Rent:', rentList.length, 'Sale:', saleList.length);
 
+      const normalizeServices = (details) => {
+        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; });
+        return services;
+      };
+
       const mappedRent = rentList.map((item) => {
         const info = item.propertyInformation || {};
         const details = (() => { try { return JSON.parse(info.detailsJSON || '{}'); } catch { return {}; } })();
@@ -797,6 +813,7 @@ export default function OwnerPropertiesPage() {
           floor: details.floorNumber ?? details.floor ?? 0,
           salons: details.numberOfSalons ?? details.salonsCount ?? details.salons ?? 0,
           balconies: details.numberOfBalconies ?? details.balconiesCount ?? details.balconies ?? 0,
+          bookedCount: details.bookedCount || 0,
           status: { 0: 'available', 1: 'booked', 2: 'maintenance' }[info.status] || 'available',
           images: raw.length > 0 ? raw.map(img => img.startsWith('http') ? img : `${apiBase}${img.startsWith('/') ? '' : '/Pictures/'}${img}`) : ['/property-placeholder.jpg'],
           createdAt: item.createdAt || new Date().toISOString(),
@@ -805,7 +822,7 @@ export default function OwnerPropertiesPage() {
           address: info.address || '',
           city: '',
           district: '',
-          services: details.services || {},
+          services: normalizeServices(details),
           terms: details.terms || {},
           rating: item.rating || 0,
           currencyId: item.currencyId,
@@ -836,6 +853,7 @@ export default function OwnerPropertiesPage() {
           floor: details.floorNumber ?? details.floor ?? 0,
           salons: details.numberOfSalons ?? details.salonsCount ?? details.salons ?? 0,
           balconies: details.numberOfBalconies ?? details.balconiesCount ?? details.balconies ?? 0,
+          bookedCount: details.bookedCount || 0,
           status: 'available',
           images: raw.length > 0 ? raw.map(img => img.startsWith('http') ? img : `${apiBase}${img.startsWith('/') ? '' : '/Pictures/'}${img}`) : ['/property-placeholder.jpg'],
           createdAt: item.createdAt || new Date().toISOString(),
@@ -844,7 +862,7 @@ export default function OwnerPropertiesPage() {
           address: info.address || '',
           city: '',
           district: '',
-          services: details.services || {},
+          services: normalizeServices(details),
           terms: details.terms || {},
           rating: item.rating || 0,
           currencyId: item.currencyId,
diff --git a/app/property/[id]/PropertyDetail.js b/app/property/[id]/PropertyDetail.js
index 97ba66c..4f12c91 100644
--- a/app/property/[id]/PropertyDetail.js
+++ b/app/property/[id]/PropertyDetail.js
@@ -141,6 +141,7 @@ function mapApiDetail(item) {
     proximity,
     roomDetails,
     details,
+    bookedCount: details.bookedCount || 0,
     deposit: item.deposit || 0,
     currencyId: item.currencyId,
     isSmokeAllow: item.isSmokeAllow,
@@ -464,6 +465,13 @@ export default function PropertyDetailsPage() {
                     <div className="text-[10px] text-gray-500">التقييم</div>
                   </div>
                 )}
+                {property.bookedCount > 0 && (
+                  <div className="bg-gray-50 rounded-lg p-2 text-center">
+                    <Calendar className="w-4 h-4 text-amber-500 mx-auto mb-0.5" />
+                    <div className="font-bold text-gray-900 text-sm">{property.bookedCount}</div>
+                    <div className="text-[10px] text-gray-500">حجوزات</div>
+                  </div>
+                )}
               </div>
 
               {/* Description */}
@@ -496,7 +504,7 @@ export default function PropertyDetailsPage() {
                     ) : (
                       Object.entries(property.services).map(([key, val]) => {
                         if (!val) return null;
-                        const detail = typeof val === 'object' && val.detail ? val.detail : null;
+                        const detail = typeof val === 'object' && val.detail ? val.detail : (typeof val === 'string' ? val : null);
                         return (
                           <span key={key} className="px-3 py-1 bg-green-50 text-green-700 rounded-full text-sm border border-green-200 flex items-center gap-1">
                             {serviceLabels[key] || key}