From 4d0acd5a4ac8d8879a5618633ef0f456415acbeb Mon Sep 17 00:00:00 2001 From: jennymar Date: Wed, 8 May 2024 11:58:02 -0700 Subject: [PATCH] Added past events feature and removed volunteers from event details schema --- backend/src/models/eventDetails.ts | 1 - frontend/src/api/eventDetails.ts | 28 ----------- frontend/src/api/testimonial.ts | 2 - frontend/src/app/(web app)/involved/page.tsx | 2 +- frontend/src/app/(web app)/page.tsx | 4 +- .../{events => past-events}/page.module.css | 0 .../src/app/(web app)/past-events/page.tsx | 47 +++++++++++++++++++ .../[eventId]/page.module.css | 0 .../[eventId]/page.tsx | 0 .../(web app)/upcoming-events/page.module.css | 19 ++++++++ .../{events => upcoming-events}/page.tsx | 2 +- .../src/app/admin/dashboard/page.module.css | 2 +- frontend/src/app/admin/dashboard/page.tsx | 6 +-- .../page.module.css | 2 +- .../{pageeditor => page-editor}/page.tsx | 0 frontend/src/components/EventsCard.tsx | 21 +++++++-- frontend/src/components/EventsList.tsx | 42 ++++++++++++++--- frontend/src/components/Footer.tsx | 10 ++-- frontend/src/components/HeaderBar.module.css | 2 +- frontend/src/components/HeaderBar.tsx | 3 +- frontend/src/components/NavigationBar.tsx | 12 ++--- 21 files changed, 144 insertions(+), 61 deletions(-) rename frontend/src/app/(web app)/{events => past-events}/page.module.css (100%) create mode 100644 frontend/src/app/(web app)/past-events/page.tsx rename frontend/src/app/(web app)/{events => upcoming-events}/[eventId]/page.module.css (100%) rename frontend/src/app/(web app)/{events => upcoming-events}/[eventId]/page.tsx (100%) create mode 100644 frontend/src/app/(web app)/upcoming-events/page.module.css rename frontend/src/app/(web app)/{events => upcoming-events}/page.tsx (97%) rename frontend/src/app/admin/{pageeditor => page-editor}/page.module.css (93%) rename frontend/src/app/admin/{pageeditor => page-editor}/page.tsx (100%) diff --git a/backend/src/models/eventDetails.ts b/backend/src/models/eventDetails.ts index 0a0be328..e6d47ac7 100644 --- a/backend/src/models/eventDetails.ts +++ b/backend/src/models/eventDetails.ts @@ -7,7 +7,6 @@ const eventDetailsSchema = new Schema({ date: { type: String, required: true }, location: { type: String, required: true }, imageURI: { type: String, required: true }, - volunteers: { type: [String], required: false, default: [] }, }); type EventDetails = InferSchemaType; diff --git a/frontend/src/api/eventDetails.ts b/frontend/src/api/eventDetails.ts index 8c47dd3e..d354d35c 100644 --- a/frontend/src/api/eventDetails.ts +++ b/frontend/src/api/eventDetails.ts @@ -10,7 +10,6 @@ export type EventDetails = { date: string; location: string; imageURI: string; - volunteers: string[]; }; export async function getEventDetails(id: string): Promise> { @@ -40,7 +39,6 @@ type CreateEventDetailsRequest = { date: string; location: string; imageURI: string; - // volunteers: string[]; when creating an event, no volunteers are added }; export async function createEventDetails( @@ -63,7 +61,6 @@ type UpdateEventDetailsRequest = { date: string; location: string; imageURI: string; - volunteers: string[]; }; export async function updateEventDetails( @@ -80,28 +77,3 @@ export async function updateEventDetails( return handleAPIError(error); } } - -// wrap updateEventDetails to push a volunteer ID to an event -export async function addVolunteerToEvent( - eventId: string, - volunteerId: string, -): Promise> { - try { - const result = await getEventDetails(eventId); - if (!result.success) { - // if result is not successful, return the result which is APIError - return result; - } - const oldEvent = result.data; - oldEvent.volunteers.push(volunteerId); - const response = await updateEventDetails(oldEvent); - - if (!response.success) { - // if response is not successful, return the response which is APIError - return response; - } - return { success: true, data: response.data }; - } catch (error) { - return handleAPIError(error); - } -} diff --git a/frontend/src/api/testimonial.ts b/frontend/src/api/testimonial.ts index 6e3343fb..fef271b2 100644 --- a/frontend/src/api/testimonial.ts +++ b/frontend/src/api/testimonial.ts @@ -12,9 +12,7 @@ export type Testimonial = { export async function getAllTestimonials(): Promise> { try { const response = await get(`/api/testimonial/get`); - //console.log(response); const json = (await response.json()) as Testimonial[]; - //console.log(json); return { success: true, data: json }; } catch (error) { return handleAPIError(error); diff --git a/frontend/src/app/(web app)/involved/page.tsx b/frontend/src/app/(web app)/involved/page.tsx index 76dd5fa4..6223c968 100644 --- a/frontend/src/app/(web app)/involved/page.tsx +++ b/frontend/src/app/(web app)/involved/page.tsx @@ -37,7 +37,7 @@ export default function Involved() {
+
([]); + + useEffect(() => { + getBackgroundImages(BackgroundImagePages.TEAM) + .then((result) => { + if (result.success) { + setImages(result.data); + } + }) + .catch((error) => { + alert(error); + }); + }, []); + + return ( +
+ image.imageURI)} + header="GET INVOLVED" + title="Past Events" + description="Lorem ipsum dolor sit amet consectetur. Et vestibulum enim nunc ultrices. Donec blandit sollicitudin vitae integer mauris sed. Mattis duis id viverra suscipit morbi." + /> +
+
+

Explore our Past Events

+

+ Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloremque necessitatibus + asperiores, optio quasi sit tempora in amet aut natus, similique enim explicabo id + expedita minima doloribus repellendus est? Quos, officia? +

+
+ +
+
+ ); +} diff --git a/frontend/src/app/(web app)/events/[eventId]/page.module.css b/frontend/src/app/(web app)/upcoming-events/[eventId]/page.module.css similarity index 100% rename from frontend/src/app/(web app)/events/[eventId]/page.module.css rename to frontend/src/app/(web app)/upcoming-events/[eventId]/page.module.css diff --git a/frontend/src/app/(web app)/events/[eventId]/page.tsx b/frontend/src/app/(web app)/upcoming-events/[eventId]/page.tsx similarity index 100% rename from frontend/src/app/(web app)/events/[eventId]/page.tsx rename to frontend/src/app/(web app)/upcoming-events/[eventId]/page.tsx diff --git a/frontend/src/app/(web app)/upcoming-events/page.module.css b/frontend/src/app/(web app)/upcoming-events/page.module.css new file mode 100644 index 00000000..62332f3a --- /dev/null +++ b/frontend/src/app/(web app)/upcoming-events/page.module.css @@ -0,0 +1,19 @@ +@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wdth,wght@0,75..100,300..800;1,75..100,300..800&family=Roboto+Slab:wght@100..900&display=swap"); + +.body { + max-width: 1440px; + margin: 0 auto; + height: auto; + padding: 0px 98px 136px; + background-color: #f9f9f9; + color: black; +} +.bodyTitle { + margin: 0; + padding: 64px 0; + display: flex; + flex-direction: column; + justify-content: center; + align-items: left; + gap: 24px; +} diff --git a/frontend/src/app/(web app)/events/page.tsx b/frontend/src/app/(web app)/upcoming-events/page.tsx similarity index 97% rename from frontend/src/app/(web app)/events/page.tsx rename to frontend/src/app/(web app)/upcoming-events/page.tsx index 8756c321..d69acf2f 100644 --- a/frontend/src/app/(web app)/events/page.tsx +++ b/frontend/src/app/(web app)/upcoming-events/page.tsx @@ -40,7 +40,7 @@ export default function UpcomingEvents() { expedita minima doloribus repellendus est? Quos, officia?

- + ); diff --git a/frontend/src/app/admin/dashboard/page.module.css b/frontend/src/app/admin/dashboard/page.module.css index 11095c29..472a10cd 100644 --- a/frontend/src/app/admin/dashboard/page.module.css +++ b/frontend/src/app/admin/dashboard/page.module.css @@ -2,7 +2,7 @@ display: flex; justify-content: flex-start; padding-left: 90px; - padding-top: 150px; + padding-top: 50px; } .gridContainer { diff --git a/frontend/src/app/admin/dashboard/page.tsx b/frontend/src/app/admin/dashboard/page.tsx index 97caaf3c..e497cabc 100644 --- a/frontend/src/app/admin/dashboard/page.tsx +++ b/frontend/src/app/admin/dashboard/page.tsx @@ -9,20 +9,20 @@ export default function Dashboard() {
diff --git a/frontend/src/app/admin/pageeditor/page.module.css b/frontend/src/app/admin/page-editor/page.module.css similarity index 93% rename from frontend/src/app/admin/pageeditor/page.module.css rename to frontend/src/app/admin/page-editor/page.module.css index bf5c9adb..c6131f68 100644 --- a/frontend/src/app/admin/pageeditor/page.module.css +++ b/frontend/src/app/admin/page-editor/page.module.css @@ -2,7 +2,7 @@ display: flex; justify-content: center; padding-left: 30px; - padding-top: 140px; + padding-top: 50px; } .gridContainer { diff --git a/frontend/src/app/admin/pageeditor/page.tsx b/frontend/src/app/admin/page-editor/page.tsx similarity index 100% rename from frontend/src/app/admin/pageeditor/page.tsx rename to frontend/src/app/admin/page-editor/page.tsx diff --git a/frontend/src/components/EventsCard.tsx b/frontend/src/components/EventsCard.tsx index 644b34a5..2de65e3d 100644 --- a/frontend/src/components/EventsCard.tsx +++ b/frontend/src/components/EventsCard.tsx @@ -27,13 +27,13 @@ const EventsCard = ({ event, page }: CardProps) => {
{event.name}
{event.description}
- + ); - } else { + } else if (page === "upcoming-events") { return (
@@ -45,12 +45,27 @@ const EventsCard = ({ event, page }: CardProps) => {
{event.name}
{event.description}
- +
); + } else if (page === "past-events") { + return ( +
+
+ image +
+ +
+
+
{event.name}
+
{event.description}
+
+
+
+ ); } }; diff --git a/frontend/src/components/EventsList.tsx b/frontend/src/components/EventsList.tsx index 02f7464d..584187a9 100644 --- a/frontend/src/components/EventsList.tsx +++ b/frontend/src/components/EventsList.tsx @@ -10,14 +10,27 @@ type EventsListProps = { }; export default function EventsList({ page }: EventsListProps) { - const [events, setEvents] = useState([]); + const [pastEvents, setPastEvents] = useState([]); + const [upcomingEvents, setUpcomingEvents] = useState([]); // Fetch events useEffect(() => { getAllEventDetails() .then((response) => { if (response.success) { - setEvents(response.data); + const currentDate = new Date(); + + const filteredPastEvents = response.data.filter((item) => { + const eventDate = new Date(item.date); + return eventDate < currentDate; + }); + setPastEvents(filteredPastEvents); + + const filteredUpcomingEvents = response.data.filter((item) => { + const eventDate = new Date(item.date); + return eventDate >= currentDate; + }); + setUpcomingEvents(filteredUpcomingEvents); } else { alert(response.error); } @@ -33,25 +46,40 @@ export default function EventsList({ page }: EventsListProps) { style={{ display: "flex", flexWrap: "wrap", columnGap: "24px", rowGap: "50px" }} className="events" > - {events.length === 0 ? ( + {upcomingEvents.length === 0 ? ( +

Loading...

+ ) : ( + upcomingEvents.map((event: EventDetails) => ( + + )) + )} + + ); + } else if (page === "upcoming-events") { + return ( +
+ {upcomingEvents.length === 0 ? (

Loading...

) : ( - events.map((event: EventDetails) => ( + upcomingEvents.map((event: EventDetails) => ( )) )}
); - } else { + } else if (page === "past-events") { return (
- {events.length === 0 ? ( + {pastEvents.length === 0 ? (

Loading...

) : ( - events.map((event: EventDetails) => ( + pastEvents.map((event: EventDetails) => ( )) )} diff --git a/frontend/src/components/Footer.tsx b/frontend/src/components/Footer.tsx index b22c9a7e..3fa11b4e 100644 --- a/frontend/src/components/Footer.tsx +++ b/frontend/src/components/Footer.tsx @@ -27,7 +27,8 @@ const Footer = () => { getInvolved: "/involved", ourImpact: "/impact", ourMission: "/mission", - upcomingEvents: "/events", + upcomingEvents: "/upcoming-events", + pastEvents: "/past-events", testimonials: "/testimonials", ourTeam: "/team", contactUs: "/contact", @@ -152,8 +153,8 @@ const Footer = () => { Our Team - - Donate + + Past Events Newsletter @@ -164,6 +165,9 @@ const Footer = () => { Contact Us + + Donate +
diff --git a/frontend/src/components/HeaderBar.module.css b/frontend/src/components/HeaderBar.module.css index eea5f22d..b93c24b6 100644 --- a/frontend/src/components/HeaderBar.module.css +++ b/frontend/src/components/HeaderBar.module.css @@ -131,7 +131,7 @@ box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); z-index: 1; width: 202px; - max-height: 104px; + max-height: 156px; overflow-y: auto; } diff --git a/frontend/src/components/HeaderBar.tsx b/frontend/src/components/HeaderBar.tsx index 6fd65157..fed5fa5b 100644 --- a/frontend/src/components/HeaderBar.tsx +++ b/frontend/src/components/HeaderBar.tsx @@ -43,7 +43,8 @@ const HeaderBar = () => {
Get Involved
- Upcoming Events + Upcoming Events + Past Events Donate
diff --git a/frontend/src/components/NavigationBar.tsx b/frontend/src/components/NavigationBar.tsx index 67113771..ebb88097 100644 --- a/frontend/src/components/NavigationBar.tsx +++ b/frontend/src/components/NavigationBar.tsx @@ -17,11 +17,11 @@ const NavigationBar = () => { if (typeof window !== "undefined") { if (window.location.pathname === "/admin/dashboard") { return "Dashboard"; - } else if (window.location.pathname === "/admin/eventcreator") { + } else if (window.location.pathname === "/admin/event-creator") { return "Event Creator"; - } else if (window.location.pathname === "/admin/pageeditor") { + } else if (window.location.pathname === "/admin/page-editor") { return "Page Editor"; - } else if (window.location.pathname === "/admin/newslettercreator") { + } else if (window.location.pathname === "/admin/newsletter-creator") { return "Newsletter Creator"; } else if (window.location.pathname === "/admin/mailing-list") { return "Mailing List"; @@ -83,7 +83,7 @@ const NavigationBar = () => {
Calendar Icon { handleOnClick("Event Creator"); }} @@ -94,7 +94,7 @@ const NavigationBar = () => {
Page Icon { handleOnClick("Page Editor"); }} @@ -105,7 +105,7 @@ const NavigationBar = () => {
Newsletter Icon { handleOnClick("Newsletter Creator"); }}