From 275954f52d1f83fe33f6276f707185df2fd7bd6f Mon Sep 17 00:00:00 2001
From: Adrien <me@adrien.run>
Date: Thu, 9 Feb 2023 21:14:16 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20Replace=20for=20loop=20with=20a?=
 =?UTF-8?q?=20<For/>=20control=20flow=20for=20PassagesPanel=20component?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/passagesPanel.tsx | 23 +++++++++++------------
 1 file changed, 11 insertions(+), 12 deletions(-)

diff --git a/frontend/src/passagesPanel.tsx b/frontend/src/passagesPanel.tsx
index 100639d..20fc74f 100644
--- a/frontend/src/passagesPanel.tsx
+++ b/frontend/src/passagesPanel.tsx
@@ -1,4 +1,4 @@
-import { VoidComponent, createEffect, createResource, createSignal, ParentComponent, ParentProps, Show, useContext } from 'solid-js';
+import { VoidComponent, createEffect, createResource, createSignal, ParentComponent, ParentProps, Show, useContext, For } from 'solid-js';
 import { createDateNow, getTime } from '@solid-primitives/date';
 import { AnimationOptions } from '@motionone/types';
 import { Motion } from "@motionone/solid";
@@ -123,18 +123,17 @@ export const PassagesPanel: PassagesPanelComponent = (props) => {
 	return (
 		<div classList={{ [styles.passagesContainer]: true, [styles.displayed]: props.show }} >
 			<Show when={lines() !== undefined} >
-				{() => {
-					const ret = [];
-					for (const line of lines()) {
-						const byLinePassages = props.passages[line.id];
-						if (byLinePassages !== undefined) {
-							for (const destination of Object.keys(byLinePassages)) {
-								ret.push(<DestinationPassages passages={byLinePassages[destination]} line={line} destination={destination} />);
-							}
-						}
+				<For each={lines()}>
+					{(line) =>
+						<Show when={props.passages[line.id]}>
+							<For each={Object.keys(props.passages[line.id])}>
+								{(destination) =>
+									<DestinationPassages passages={props.passages[line.id][destination]} line={line} destination={destination} />
+								}
+							</For>
+						</Show>
 					}
-					return ret;
-				}}
+				</For>
 			</Show>
 		</div >
 	);