RecentRunner/group-2-threaded-project-petshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #306 from RecentRunner/fix-appointment-history

Browse Source 
fix appointment history
This commit was merged in pull request #306.
This commit is contained in:
Harkamal
2026-04-15 07:04:46 -06:00
committed by GitHub
parent 824fea942f c18851fba8
commit 17ae8f95c0
1 changed files with 41 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

88
web/app/appointments/page.js
View File

@@ -961,45 +961,8 @@ const canBookAppointments = user?.role === "CUSTOMER" || user?.role === "ADMIN";
) : null} ) : null}
<div className="appt-history" ref={historyRef}> <div className="appt-history" ref={historyRef}>
<h2 className="appt-form-title"> <h2 className="appt-form-title">{canBookAppointments ? "Your Appointments" : "Appointments"}</h2>
{adoptionMode ? "Your Adoptions" : canBookAppointments ? "Your Appointments" : "Appointments"} {loadingAppointments ? (
</h2>
{adoptionMode ? (
loadingAdoptions ? (
<p className="appt-loading">Loading adoptions...</p>
) : adoptions.length === 0 ? (
<p className="appt-empty">No adoption appointments yet.</p>
) : (
<div className="appt-list">
{adoptions.map((a) => (
<div key={a.adoptionId} className="appt-card">
<div className="appt-card-header">
<span className="appt-card-service">{a.petName}</span>
<span className={`appt-card-status appt-card-status--${a.adoptionStatus?.toLowerCase()}`}>
{a.adoptionStatus}
</span>
</div>
<div className="appt-card-details">
<span>{a.sourceStoreName}</span>
<span>{a.adoptionDate}</span>
</div>
{a.adoptionStatus?.toLowerCase() === "pending" && (
<div className="appt-card-actions">
<button
type="button"
className="appt-cancel-btn"
disabled={cancellingId === a.adoptionId}
onClick={() => handleCancelAdoption(a.adoptionId)}
>
{cancellingId === a.adoptionId ? "Cancelling..." : "Cancel"}
</button>
</div>
)}
</div>
))}
</div>
)
) : loadingAppointments ? (
<p className="appt-loading">Loading appointments...</p> <p className="appt-loading">Loading appointments...</p>
) : appointments.length === 0 ? ( ) : appointments.length === 0 ? (
<p className="appt-empty">No appointments yet.</p> <p className="appt-empty">No appointments yet.</p>
@@ -1009,7 +972,7 @@ const canBookAppointments = user?.role === "CUSTOMER" || user?.role === "ADMIN";
<div key={a.appointmentId} className="appt-card"> <div key={a.appointmentId} className="appt-card">
<div className="appt-card-header"> <div className="appt-card-header">
<span className="appt-card-service">{a.serviceName}</span> <span className="appt-card-service">{a.serviceName}</span>
<span className={`appt-card-status appt-card-status--${a.appointmentStatus.toLowerCase()}`}> <span className={`appt-card-status appt-card-status--${a.appointmentStatus?.toLowerCase()}`}>
{a.appointmentStatus} {a.appointmentStatus}
</span> </span>
</div> </div>
@@ -1017,14 +980,9 @@ const canBookAppointments = user?.role === "CUSTOMER" || user?.role === "ADMIN";
<span>{a.storeName}</span> <span>{a.storeName}</span>
<span>{a.appointmentDate} at {formatTime(a.appointmentTime)}</span> <span>{a.appointmentDate} at {formatTime(a.appointmentTime)}</span>
</div> </div>
{a.petNames && a.petNames.length > 0 && ( {a.petName && (
<div className="appt-card-pets"> <div className="appt-card-pets">
Pets: {a.petNames.join(", ")} Pet: {a.petName}
</div>
)}
{a.customerPetNames && a.customerPetNames.length > 0 && (
<div className="appt-card-pets">
Pets: {a.customerPetNames.join(", ")}
</div> </div>
)} )}
{a.appointmentStatus?.toLowerCase() === "booked" && ( {a.appointmentStatus?.toLowerCase() === "booked" && (
@@ -1043,6 +1001,42 @@ const canBookAppointments = user?.role === "CUSTOMER" || user?.role === "ADMIN";
))} ))}
</div> </div>
)} )}
<h2 className="appt-form-title" style={{ marginTop: "2rem" }}>{canBookAppointments ? "Your Adoptions" : "Adoptions"}</h2>
{loadingAdoptions ? (
<p className="appt-loading">Loading adoptions...</p>
) : adoptions.length === 0 ? (
<p className="appt-empty">No adoption requests yet.</p>
) : (
<div className="appt-list">
{adoptions.map((a) => (
<div key={a.adoptionId} className="appt-card">
<div className="appt-card-header">
<span className="appt-card-service">{a.petName}</span>
<span className={`appt-card-status appt-card-status--${a.adoptionStatus?.toLowerCase()}`}>
{a.adoptionStatus}
</span>
</div>
<div className="appt-card-details">
<span>{a.sourceStoreName}</span>
<span>{a.adoptionDate}</span>
</div>
{a.adoptionStatus?.toLowerCase() === "pending" && (
<div className="appt-card-actions">
<button
type="button"
className="appt-cancel-btn"
disabled={cancellingId === a.adoptionId}
onClick={() => handleCancelAdoption(a.adoptionId)}
>
{cancellingId === a.adoptionId ? "Cancelling..." : "Cancel"}
</button>
</div>
)}
</div>
))}
</div>
)}
</div> </div>
</section> </section>
</main> </main>