From ba287adacf2e6de544d6dadb9a05b38137eb3dc3 Mon Sep 17 00:00:00 2001
From: Daniel Karbach <daniel.karbach@localhorst.tv>
Date: Sun, 25 May 2025 11:53:19 +0200
Subject: [PATCH] always show episodes heading

---
 resources/js/i18n/de.js     |  2 ++
 resources/js/i18n/en.js     |  2 ++
 resources/js/pages/Event.js | 48 ++++++++++++++++++++-----------------
 3 files changed, 30 insertions(+), 22 deletions(-)

diff --git a/resources/js/i18n/de.js b/resources/js/i18n/de.js
index d988549..0daccf9 100644
--- a/resources/js/i18n/de.js
+++ b/resources/js/i18n/de.js
@@ -188,6 +188,8 @@ export default {
 			end: 'Ende',
 			evergreen: 'Ständige Veranstaltungen',
 			heading: 'Veranstaltungen',
+			noPastEpisodes: 'Keine vergangenen Rennen gefunden.',
+			noUpcomingEpisodes: 'Keine anstehenden Rennen gefunden.',
 			ongoing: 'Laufende Veranstaltungen',
 			past: 'Vergangene Veranstaltungen',
 			pastEpisodes: 'Vergangene Rennen',
diff --git a/resources/js/i18n/en.js b/resources/js/i18n/en.js
index 75b558e..6ef3cd2 100644
--- a/resources/js/i18n/en.js
+++ b/resources/js/i18n/en.js
@@ -188,6 +188,8 @@ export default {
 			end: 'End',
 			evergreen: 'Evergreen events',
 			heading: 'Events',
+			noPastEpisodes: 'No past races found.',
+			noUpcomingEpisodes: 'No upcoming races found.',
 			ongoing: 'Ongoing events',
 			past: 'Past events',
 			pastEpisodes: 'Past races',
diff --git a/resources/js/pages/Event.js b/resources/js/pages/Event.js
index fd97ae5..ef52e9f 100644
--- a/resources/js/pages/Event.js
+++ b/resources/js/pages/Event.js
@@ -1,7 +1,7 @@
 import axios from 'axios';
 import moment from 'moment';
 import React from 'react';
-import { Button, Container } from 'react-bootstrap';
+import { Alert, Button, Container } from 'react-bootstrap';
 import { Helmet } from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import { useParams } from 'react-router-dom';
@@ -154,29 +154,33 @@ export const Component = () => {
 		<CanonicalLinks base={`/events/${event.name}`} />
 		<Container>
 			<Detail actions={actions} event={event} />
-			{episodes.length ? <>
-				<div className="d-flex align-items-center justify-content-between">
-					<h2 className="mt-4">
-						{t(pastMode || hasConcluded(event)
-							? 'events.pastEpisodes'
-							: 'events.upcomingEpisodes'
-						)}
-					</h2>
-					<div className="button-bar">
-						{!hasConcluded(event) ?
-							<Button
-								className="ms-3"
-								onClick={() => setPastMode(!pastMode)}
-								title={t(pastMode ? 'events.setFutureMode' : 'events.setPastMode')}
-								variant="outline-secondary"
-							>
-								<Icon.TIME_REVERSE title="" />
-							</Button>
-						: null}
-					</div>
+			<div className="d-flex align-items-center justify-content-between">
+				<h2 className="mt-4">
+					{t(pastMode || hasConcluded(event)
+						? 'events.pastEpisodes'
+						: 'events.upcomingEpisodes'
+					)}
+				</h2>
+				<div className="button-bar">
+					{!hasConcluded(event) ?
+						<Button
+							className="ms-3"
+							onClick={() => setPastMode(!pastMode)}
+							title={t(pastMode ? 'events.setFutureMode' : 'events.setPastMode')}
+							variant="outline-secondary"
+						>
+							<Icon.TIME_REVERSE title="" />
+						</Button>
+					: null}
 				</div>
+			</div>
+			{episodes.length ?
 				<EpisodeList episodes={episodes} />
-			</> : null}
+			:
+				<Alert variant="info">
+					{t(pastMode ? 'events.noPastEpisodes' : 'events.noUpcomingEpisodes')}
+				</Alert>
+			}
 		</Container>
 		<Dialog
 			content={editContent}
-- 
2.39.5