feat: created student card appointment

[dashaaaa21]

Update UI for students appointments

[Copilot]

Pull request overview

This PR updates the student “My Appointments” page UI by replacing the previous table-based layout with a new card-based appointment presentation, including status styling, teacher avatar display, and a join/past indicator.

Changes:

• Replaced the appointments table view with a list of AppointmentCard components on the student appointments page.
• Added a new appointmentCard component set (card, status bar, avatar, info, join button) plus styling utilities.
• Added client-side teacher profile fetching to display teacher avatars in appointment cards.

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 4 comments.

Show a summary per file

File	Description
client/src/pages/privateStudentsPages/clientsAppointments/ClientsAppointments.tsx	Switches student appointments UI from table to card list; adds teacher data fetching for avatars.
client/src/components/appointmentCard/appointmentCard.utils.ts	Adds status-to-style mapping and internal video-call link helper.
client/src/components/appointmentCard/AppointmentStatusBar.tsx	New status/date/time header bar for appointment cards.
client/src/components/appointmentCard/AppointmentJoinButton.tsx	New “Join”/“Past”/“N/A” rendering for video call access.
client/src/components/appointmentCard/AppointmentInfo.tsx	New card body section for lesson/teacher/price display.
client/src/components/appointmentCard/AppointmentCard.tsx	Composes the card UI and applies status-based styling and join gating logic.
client/src/components/appointmentCard/AppointmentAvatar.tsx	Displays teacher avatar with fallback icon.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.