diff --git a/app/hooks/StrapiAPI.ts b/app/hooks/StrapiAPI.ts index 92fe9bc8d..d94731761 100644 --- a/app/hooks/StrapiAPI.ts +++ b/app/hooks/StrapiAPI.ts @@ -111,7 +111,7 @@ export function useHomePageEventsData() { } export function useEventData(eventId: string) { - const path = `events/${eventId}?populate[address]=*&populate[calendar_event]=*&populate[registration_link]=*&populate[image][populate]=*&populate[event_categories][fields]=label&populate[event_eligibilities][fields]=label`; + const path = `events/${eventId}?populate[address]=*&populate[calendar_event]=*&populate[location_name]=*&populate[Language]=*&populate[registration_link]=*&populate[image][populate]=*&populate[event_categories][fields]=label&populate[event_eligibilities][fields]=label`; const dataFetcher = () => fetcher<{ data: StrapiDatumResponse }>( @@ -140,13 +140,13 @@ export function formatEventData( return { ...data?.data?.attributes, id: data?.data?.id, - categories: data?.data.attributes.event_categories?.data.map( + categories: data?.data?.attributes?.event_categories?.data.map( (category: StrapiDatumResponse) => ({ id: category.id, label: category.attributes.label, }) ), - eligibilities: data?.data.attributes.event_eligibilities?.data.map( + eligibilities: data?.data?.attributes?.event_eligibilities?.data.map( (eligibility: StrapiDatumResponse) => ({ id: eligibility.id, label: eligibility.attributes.label, @@ -375,6 +375,8 @@ export interface EventResponse extends BaseDatumAttributesResponse { title: string; description: RootNode[]; calendar_event: CalendarEventResponse; + location_name: string; + Language: string; address: AddressResponse | { data: null }; image: { data: { id: number; attributes: ImageResponse }; diff --git a/app/pages/EventDetailPage/EventDetailPage.tsx b/app/pages/EventDetailPage/EventDetailPage.tsx index 7f3d07ed4..3a674a76c 100644 --- a/app/pages/EventDetailPage/EventDetailPage.tsx +++ b/app/pages/EventDetailPage/EventDetailPage.tsx @@ -1,18 +1,17 @@ import React, { ReactNode } from "react"; -import ReactMarkdown from "react-markdown"; import { useParams } from "react-router-dom"; import { BlocksRenderer } from "@strapi/blocks-react-renderer"; -import { ActionBarMobile } from "components/DetailPage"; +import { CalendarEvent } from "models/Strapi"; +import { DetailAction } from "../../models"; import { InfoTable } from "components/DetailPage/InfoTable"; -import { Loader } from "components/ui/Loader"; import { DetailInfoSection } from "components/ui/Cards/DetailInfoSection"; -import ListingPageHeader from "components/DetailPage/PageHeader"; +import { formatCalendarEventDisplay } from "components/ui/Cards/FormattedDate"; +import { Loader } from "components/ui/Loader"; import DetailPageWrapper from "components/DetailPage/DetailPageWrapper"; -import { DetailAction } from "../../models"; +import ListingPageHeader from "components/DetailPage/PageHeader"; +import { ActionBarMobile } from "components/DetailPage"; import PageNotFound from "components/ui/PageNotFound"; import { useEventData } from "hooks/StrapiAPI"; -import { formatCalendarEventDisplay } from "components/ui/Cards/FormattedDate"; -import { CalendarEvent } from "models/Strapi"; import { LabelTag } from "components/ui/LabelTag"; type TagRow = { title: string; value: ReactNode[] }; @@ -41,9 +40,20 @@ export const EventDetailPage = () => { const detailsRows = [ { title: "Date & Time", - value: formatCalendarEventDisplay(data.calendar_event as CalendarEvent), + value: + data.calendar_event?.startdate && + formatCalendarEventDisplay(data.calendar_event as CalendarEvent), }, - ]; + { + title: "Location", + value: data.location_name, + }, + { + title: "Language", + value: data.Language, + }, + ].filter((row) => !!row.value); + const registrationRows = [ { title: "Event Link", @@ -113,26 +123,20 @@ export const EventDetailPage = () => { - {data.calendar_event?.startdate && ( - - - rowRenderer={(detail) => ( - - {detail.title} - - - {detail.value} - - - - )} - rows={detailsRows} - /> - - )} + + + rowRenderer={(detail) => ( + + {detail.title} + {detail.value} + + )} + rows={detailsRows} + /> +