always show episodes heading

diff --git a/resources/js/i18n/de.js b/resources/js/i18n/de.js
index d98854954995da20c6d06a312e7be4648136d6d2..0daccf92ace9bf96cfd240b84601522b9d01f3cc 100644 (file)
--- 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 75b558eb87a527674144f95ffaaf04e0bbbf748b..6ef3cd233da9c0b948eb998c84093662389d2a75 100644 (file)
--- 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 fd97ae5be77877b3402f9eff0269516bcfea14c3..ef52e9fb0a02ece0dcd539c176312640b22e9a47 100644 (file)
--- 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}