Implement Event Details Page

Task: Implement Event Details Page

Objective: Create a page where users can view the full details of a specific event. This page will allow users to see event information, such as the name, description, date, time, location, number of attendees, and any additional details.

Requirements:

Display the following details for the event:
- Event Name
- Event Description
- Date and Time of the event
- Location (integrate Google Maps to display the location)
- Number of attendees
Include options for the user to:
- Edit the event (for event organizers only)
- Invite more participants (for event organizers only)
- View the list of attendees
- RSVP for the event (for invited participants)
Display RSVP status (e.g., Confirmed, Declined, or Pending)
Provide a map view of the event location using Google Maps API.
Include a "Back to Dashboard" button to return the user to the Dashboard Page.
Show a list of event-related comments and allow users to add new comments.

Additional Features:

Display a countdown timer until the event date.
Provide the ability to download event details as a PDF.
Use real-time updates to reflect any changes made to event details or RSVPs.

Design Considerations:

Create a responsive layout to support both desktop and mobile devices.
Ensure event details are clearly displayed and easy to read.
Use consistent design language with the rest of the application.

Dependencies:

Backend API to retrieve event details.
Google Maps API for displaying event location.
Frontend framework for handling RSVPs and displaying attendee information.

Checklist:

[ ] Create a layout for displaying event details
[ ] Fetch event data from the backend
[ ] Integrate Google Maps API for displaying event location
[ ] Add buttons for editing, inviting participants, and returning to the dashboard
[ ] Display list of attendees and RSVP status
[ ] Implement a comment section for event participants
[ ] Ensure responsive design for both mobile and desktop

beqa200 / colab-team4