From e201b1cd8a8c215bf6474b120f28e2fb0efe0b69 Mon Sep 17 00:00:00 2001
From: mouazkh <mouazalkhatib2013@gmail.com>
Date: Tue, 26 May 2026 21:28:14 +0300
Subject: [PATCH] added the descption

---
 app/reservations/page.js | 37 +++++++++++++++++++------------------
 1 file changed, 19 insertions(+), 18 deletions(-)

diff --git a/app/reservations/page.js b/app/reservations/page.js
index 41bf3da..b6389ac 100644
--- a/app/reservations/page.js
+++ b/app/reservations/page.js
@@ -9,7 +9,7 @@ import {
 } from 'lucide-react';
 import toast, { Toaster } from 'react-hot-toast';
 import AuthService from '../services/AuthService';
-import { getRentProperty, getUserReservations, payDeposit } from '../utils/api';
+import { getUserReservations, payDeposit } from '../utils/api';
 
 const API_BASE = process.env.NEXT_PUBLIC_API_URL || 'https://45.93.137.91.nip.io/api';
 
@@ -39,17 +39,18 @@ function StatusBadge({ code }) {
 
 async function enrich(reservation) {
   if (!reservation.propertyId) return reservation;
-  try {
-    const prop = await getRentProperty(reservation.propertyId);
-    reservation._prop = prop?.propertyInformation ?? prop ?? null;
-  } catch { /* skip */ }
+  reservation._prop = reservation.property ?? null;
   return reservation;
 }
 
-const propAddr = (p) => p?.address ?? '';
-const propImages = (p) => Array.isArray(p?.images) ? p.images : [];
-const propBeds = (p) => p?.numberOfBedRooms ?? 0;
-const propBaths = (p) => p?.numberOfBathRooms ?? 0;
+const propAddr = (p, r) => p?.address ?? r?.propertyAddress ?? '';
+const propImages = (p, r) => {
+  if (p?.images && Array.isArray(p.images)) return p.images;
+  if (r?.property?.images && Array.isArray(r.property.images)) return r.property.images;
+  return [];
+};
+const propBeds = (p, r) => p?.numberOfBedRooms ?? r?.property?.numberOfBedRooms ?? 0;
+const propBaths = (p, r) => p?.numberOfBathRooms ?? r?.property?.numberOfBathRooms ?? 0;
 
 function parseTimeSpan(str) {
   if (!str) return 0;
@@ -105,11 +106,11 @@ function CountdownTimer({ deadline }) {
 
 function ReservationCard({ r, onViewDetails, onPay, payingId }) {
   const p = r._prop;
-  const imgs = propImages(p);
+  const imgs = propImages(p, r);
   const img = imgs.length > 0 ? `${API_BASE}${imgs[0]}` : null;
-  const addr = propAddr(p);
-  const beds = propBeds(p);
-  const baths = propBaths(p);
+  const addr = propAddr(p, r);
+  const beds = propBeds(p, r);
+  const baths = propBaths(p, r);
   const isOwnerConfirmed = STATUS_MAP[r.status] === 'ownerConfirmed';
   const hasTimeWindow = r.ownerApprovalDate && r.allowedPaymentPeriod;
   const deadline = hasTimeWindow
@@ -192,10 +193,10 @@ function DetailsModal({ r, isOpen, onClose, onPay, payingId }) {
         <div className="p-6 space-y-6">
           {p && <div className="bg-gray-50 p-4 rounded-xl">
             <h3 className="font-bold text-gray-900 mb-3 flex items-center gap-2"><Home className="w-5 h-5 text-amber-500"/> معلومات العقار</h3>
-            <p><span className="text-gray-500">العنوان:</span> {propAddr(p)||'—'}</p>
-            {(propBeds(p)||propBaths(p)) && <div className="flex gap-3 mt-2">
-              {propBeds(p)>0&&<span className="text-sm bg-white px-2 py-1 rounded-lg">{propBeds(p)} غرف</span>}
-              {propBaths(p)>0&&<span className="text-sm bg-white px-2 py-1 rounded-lg">{propBaths(p)} حمامات</span>}
+            <p><span className="text-gray-500">العنوان:</span> {propAddr(p, r)||'—'}</p>
+            {(propBeds(p, r)||propBaths(p, r)) && <div className="flex gap-3 mt-2">
+              {propBeds(p, r)>0&&<span className="text-sm bg-white px-2 py-1 rounded-lg">{propBeds(p, r)} غرف</span>}
+              {propBaths(p, r)>0&&<span className="text-sm bg-white px-2 py-1 rounded-lg">{propBaths(p, r)} حمامات</span>}
             </div>}
           </div>}
           <div className="bg-gray-50 p-4 rounded-xl">
@@ -259,7 +260,7 @@ export default function UserReservationsPage() {
   useEffect(() => {
     let r = reservations;
     if (filterStatus !== 'all') r = r.filter(x => STATUS_MAP[x.status] === filterStatus);
-    if (searchTerm) { const q = searchTerm.toLowerCase(); r = r.filter(x => propAddr(x._prop).toLowerCase().includes(q) || String(x.id).includes(q)); }
+    if (searchTerm) { const q = searchTerm.toLowerCase(); r = r.filter(x => propAddr(x._prop, x).toLowerCase().includes(q) || String(x.id).includes(q)); }
     setFiltered(r);
   }, [reservations, filterStatus, searchTerm]);