export default function UpcomingAppointments() {
    const appointments = [
      { date: 'May 5, 2025', time: '10:00 AM', doctor: 'Dr. A. Kofi' },
      { date: 'May 7, 2025', time: '2:00 PM', doctor: 'Dr. L. Oduor' },
    ];
  
    return (
      <div className="bg-white p-4 rounded-lg shadow">
        <h3 className="text-lg font-semibold mb-3">Upcoming Appointments</h3>
        <ul className="space-y-2">
          {appointments.map((appt, idx) => (
            <li key={idx} className="border-b pb-2">
              <p className="text-sm font-medium">{appt.date} at {appt.time}</p>
              <p className="text-xs text-gray-600">with {appt.doctor}</p>
            </li>
          ))}
        </ul>
      </div>
    );
  }
  