pull EventDetailPage dev changes to prod

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<EventResponse> }>(
@@ -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<CategoryResponse>) => ({
         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<EligibilityResponse>) => ({
         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 };

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 = () => {
         <BlocksRenderer content={data.description || []} />
       </DetailInfoSection>
 
-      {data.calendar_event?.startdate && (
-        <DetailInfoSection
-          title="Details"
-          data-testid="eventdetailpage-detailinfosection"
-        >
-          <InfoTable<{ title: string; value: string }>
-            rowRenderer={(detail) => (
-              <tr key={detail.title}>
-                <th>{detail.title}</th>
-                <td>
-                  <ReactMarkdown className="rendered-markdown">
-                    {detail.value}
-                  </ReactMarkdown>
-                </td>
-              </tr>
-            )}
-            rows={detailsRows}
-          />
-        </DetailInfoSection>
-      )}
+      <DetailInfoSection
+        title="Details"
+        data-testid="eventdetailpage-detailinfosection"
+      >
+        <InfoTable<{ title: string; value: ReactNode }>
+          rowRenderer={(detail) => (
+            <tr key={detail.title}>
+              <th>{detail.title}</th>
+              <td>{detail.value}</td>
+            </tr>
+          )}
+          rows={detailsRows}
+        />
+      </DetailInfoSection>
 
       <DetailInfoSection
         title="Registration"