diff --git a/client/src/components/ui/EventDateDisplay.tsx b/client/src/components/ui/EventDateDisplay.tsx index d7b97c8..c8172b8 100644 --- a/client/src/components/ui/EventDateDisplay.tsx +++ b/client/src/components/ui/EventDateDisplay.tsx @@ -32,6 +32,20 @@ export function getEventDateParts(dateString: string): EventDateParts | null { } } +const getOrdinal = (d: number) => { + if (d > 3 && d < 21) return `${d}th`; + switch (d % 10) { + case 1: + return `${d}st`; + case 2: + return `${d}nd`; + case 3: + return `${d}rd`; + default: + return `${d}th`; + } +}; + type EventDateDisplayProps = { date: string }; /** Renders event date as: weekday・ day month・ time. */ @@ -39,13 +53,10 @@ export function EventDateDisplay({ date }: EventDateDisplayProps) { const parts = getEventDateParts(date); if (!parts) return null; return ( -
- - {parts.weekday} - {"・"} - - - {parts.day} {parts.month} +
+ {parts.weekday}, + + {getOrdinal(parseInt(parts.day))} {parts.month} {"・"} {parts.time} diff --git a/client/src/hooks/useEvent.ts b/client/src/hooks/useEvent.ts index 27794c6..f5cd607 100644 --- a/client/src/hooks/useEvent.ts +++ b/client/src/hooks/useEvent.ts @@ -11,10 +11,11 @@ type ApiEvent = { date: string; startTime: string | null; location: string; - cover_image: string | null; + coverImage: string | null; + workshopLink: string; }; -type UiEvent = Omit & { +type UiEvent = Omit & { coverImage: string; }; @@ -32,7 +33,7 @@ function normalizeEventId( function transformApiEventToUiEvent(data: ApiEvent): UiEvent { return { ...data, - coverImage: data.cover_image ?? "/game_dev_club_logo.svg", + coverImage: data.coverImage ?? "/game_dev_club_logo.svg", }; } diff --git a/client/src/hooks/useEvents.ts b/client/src/hooks/useEvents.ts index 7778b69..f97cb7f 100644 --- a/client/src/hooks/useEvents.ts +++ b/client/src/hooks/useEvents.ts @@ -10,17 +10,19 @@ type ApiEvent = { publicationDate: string; date: string; location: string; - cover_image: string | null; + coverImage: string | null; + workshopLink: string; }; -export type UiEvent = Omit & { +export type UiEvent = Omit & { coverImage: string; + workshopLink: string; }; function transformApiEventToUiEvent(data: ApiEvent): UiEvent { return { ...data, - coverImage: data.cover_image ?? "/game_dev_club_logo.svg", + coverImage: data.coverImage ?? "/game_dev_club_logo.svg", }; } diff --git a/client/src/pages/events/[id].tsx b/client/src/pages/events/[id].tsx index 186a263..ec53f25 100644 --- a/client/src/pages/events/[id].tsx +++ b/client/src/pages/events/[id].tsx @@ -58,10 +58,25 @@ export default function EventPage() {

-
{event.location}
+
+ {event.location}{" "} +

{event.description}

+ {event.workshopLink && ( +

+ Workshop link:{" "} + + {event.workshopLink} + +

+ )}