diff --git a/src/panels/Fahrplan/FahrplanPanel.tsx b/src/panels/Fahrplan/FahrplanPanel.tsx index 1b57af804135627396a20c4c2d95d4f60a493e29..a603ea28f767a71a004e4b462941ad77aa0bb709 100644 --- a/src/panels/Fahrplan/FahrplanPanel.tsx +++ b/src/panels/Fahrplan/FahrplanPanel.tsx @@ -42,7 +42,8 @@ const FahrplanPanel = (props: {definition: FahrplanPanelDefinition}) => { // Determine stop data from the departures for(let departure of departures) { // First throw away all data that belongs to a filtered category - if((props.definition.filter.types ?? []).includes(departure.type)) { + const filterTypes = props.definition.filter.types ?? []; + if(filterTypes.includes(departure.type)) { continue; } @@ -83,7 +84,8 @@ const FahrplanPanel = (props: {definition: FahrplanPanelDefinition}) => { countdown: parseInt(departure.countdown) }) - newRoutes[existing_ind].stops = newRoutes[existing_ind].stops.sort((a, b) => a.countdown - b.countdown) + newRoutes[existing_ind].stops = newRoutes[existing_ind].stops + .sort((a, b) => a.countdown - b.countdown) } } diff --git a/src/panels/Fahrplan/components/PlanElement.tsx b/src/panels/Fahrplan/components/PlanElement.tsx index 0ff768b0f85b636ad62c195921e682aed58e720f..d4d3f8e4c2a74e039790aa15e5aadd0d46e920b8 100644 --- a/src/panels/Fahrplan/components/PlanElement.tsx +++ b/src/panels/Fahrplan/components/PlanElement.tsx @@ -81,6 +81,7 @@ const PlanElement = (props: { { props.stops.map((stop, index) => ( <ProgressIndicator + key={stop.name} first={index === 0} id={stop.name} name={deDortmund(stop.name)} diff --git a/src/panels/Fahrplan/components/ProgressIndicator.tsx b/src/panels/Fahrplan/components/ProgressIndicator.tsx index c05dcbfd54c5802bcddffd101c861c0bf5ab215e..80bac0382789ba2a658201e0566adc8deab361fb 100644 --- a/src/panels/Fahrplan/components/ProgressIndicator.tsx +++ b/src/panels/Fahrplan/components/ProgressIndicator.tsx @@ -1,25 +1,14 @@ -// import TimeAgo from 'javascript-time-ago' -// import de from 'javascript-time-ago/locale/de' -// import {useEffect, useState} from "react"; - import classNames from "../../../util/classNames"; -export default function ProgressIndicator(props: {first?: boolean, id: string, name: string, arrival: Date, delay?: number}) { - // const [timeUntil, setTimeUntil] = useState<string>(""); - // - // useEffect(() => { - // // Setup TimeAgo - // TimeAgo.addDefaultLocale(de); - // const timeAgo = new TimeAgo('de-DE') - // - // const update = () => { - // setTimeUntil(timeAgo.format(new Date(), {future: true})); - // } - // - // setInterval(update, 1000); - // update(); - // }, []); +type ProgressIndicatorProps = { + first?: boolean, + id: string, + name: string, + arrival: Date, + delay?: number +} +export default function ProgressIndicator(props: Readonly<ProgressIndicatorProps>) { return ( <li className={`relative ${!(props.first ?? false) ? "-mt-3.5" : "-mt-2"} text-sm text-zinc-300`} key={props.id}> <div className={"flex flex-row gap-4"}> diff --git a/src/panels/Mensaplan/MensaplanPanel.tsx b/src/panels/Mensaplan/MensaplanPanel.tsx index 28545b370db3bcdd05cbeaeb8dc08726510a2074..88335a38bf68eb9c770b38ef8b4a80652cf9a519 100644 --- a/src/panels/Mensaplan/MensaplanPanel.tsx +++ b/src/panels/Mensaplan/MensaplanPanel.tsx @@ -53,7 +53,7 @@ const MensaplanPanel = (props: {definition: MensaPanelDefinition}) => { // Request the API const request = await fetch(`/canteen-menu/v3/canteens/${props.definition.canteenId}/${fetchFor}`); - if (!(request.status === 200)) { + if (request.status !== 200) { menus.current = []; specials.current = []; return; @@ -157,11 +157,11 @@ const MensaplanPanel = (props: {definition: MensaPanelDefinition}) => { <PanelContent> <div className={"flex flex-col gap-4"}> {dishes.map(dish => ( - <div className={"flex flex-row items-center gap-4"}> + <div key={dish.name} className={"flex flex-row items-center gap-4"}> {/* Fixme: This shifts the name out of line if there is more than one */} <div className={"flex flex-row gap-2 mr-2"}> - {dish.typeIcons.map(Icon => ( - <Icon size={32} className={"text-zinc-400"}/> + {dish.typeIcons.map((Icon, index) => ( + <Icon key={Icon.name + index} size={32} className={"text-zinc-400"}/> ))} </div>