From 9bca048432c3d833e006c34bcedd7cfe67b65eda Mon Sep 17 00:00:00 2001
From: Clara Ni <clara.ni@outlook.fr>
Date: Fri, 13 Dec 2024 14:09:26 +0100
Subject: [PATCH] fixup! front: display simulation results only if a train is
 selected or get data is ready

---
 .../views/SimulationResults.tsx               | 161 +++++++++---------
 1 file changed, 82 insertions(+), 79 deletions(-)

diff --git a/front/src/applications/operationalStudies/views/SimulationResults.tsx b/front/src/applications/operationalStudies/views/SimulationResults.tsx
index 915d97ffe67..b0549ac6186 100644
--- a/front/src/applications/operationalStudies/views/SimulationResults.tsx
+++ b/front/src/applications/operationalStudies/views/SimulationResults.tsx
@@ -141,16 +141,16 @@ const SimulationResults = ({
       )}
 
       {/* SIMULATION : SPACE TIME CHART */}
-      <ResizableSection
-        height={manchetteWithSpaceTimeChartHeight}
-        setHeight={setManchetteWithSpaceTimeChartHeight}
-        minHeight={MANCHETTE_WITH_SPACE_TIME_CHART_DEFAULT_HEIGHT}
-      >
-        <div
-          className="simulation-warped-map d-flex flex-row align-items-stretch mb-2"
-          style={{ height: manchetteWithSpaceTimeChartHeight }}
+      {projectionData && projectionData.projectedTrains.length > 0 && (
+        <ResizableSection
+          height={manchetteWithSpaceTimeChartHeight}
+          setHeight={setManchetteWithSpaceTimeChartHeight}
+          minHeight={MANCHETTE_WITH_SPACE_TIME_CHART_DEFAULT_HEIGHT}
         >
-          {projectionData && projectionData.projectedTrains.length > 0 && (
+          <div
+            className="simulation-warped-map d-flex flex-row align-items-stretch mb-2"
+            style={{ height: manchetteWithSpaceTimeChartHeight }}
+          >
             <>
               <button
                 type="button"
@@ -184,82 +184,85 @@ const SimulationResults = ({
                 </div>
               </div>
             </>
+          </div>
+        </ResizableSection>
+      )}
+
+      {selectedTrainSchedule && (
+        <>
+          {/* TRAIN : SPACE SPEED CHART */}
+          {selectedTrainRollingStock && trainSimulation && pathProperties && (
+            <div className="osrd-simulation-container speedspacechart-container">
+              <div
+                className="chart-container"
+                style={{
+                  height: `${speedSpaceChartContainerHeight + HANDLE_TAB_RESIZE_HEIGHT}px`,
+                }}
+              >
+                <SpeedSpaceChartContainer
+                  trainSimulation={trainSimulation}
+                  selectedTrainPowerRestrictions={selectedTrainPowerRestrictions}
+                  rollingStock={selectedTrainRollingStock}
+                  pathProperties={pathProperties}
+                  heightOfSpeedSpaceChartContainer={speedSpaceChartContainerHeight}
+                  setHeightOfSpeedSpaceChartContainer={setSpeedSpaceChartContainerHeight}
+                />
+              </div>
+            </div>
           )}
-        </div>
-      </ResizableSection>
 
-      {/* TRAIN : SPACE SPEED CHART */}
-      {selectedTrainRollingStock && trainSimulation && pathProperties && selectedTrainSchedule && (
-        <div className="osrd-simulation-container speedspacechart-container">
-          <div
-            className="chart-container"
-            style={{
-              height: `${speedSpaceChartContainerHeight + HANDLE_TAB_RESIZE_HEIGHT}px`,
-            }}
-          >
-            <SpeedSpaceChartContainer
-              trainSimulation={trainSimulation}
-              selectedTrainPowerRestrictions={selectedTrainPowerRestrictions}
-              rollingStock={selectedTrainRollingStock}
-              pathProperties={pathProperties}
-              heightOfSpeedSpaceChartContainer={speedSpaceChartContainerHeight}
-              setHeightOfSpeedSpaceChartContainer={setSpeedSpaceChartContainerHeight}
+          {/* SIMULATION : MAP */}
+          <div className="simulation-map">
+            <SimulationResultsMap
+              setExtViewport={setExtViewport}
+              geometry={pathProperties?.geometry}
+              trainSimulation={
+                trainSimulation
+                  ? {
+                      ...trainSimulation,
+                      trainId: selectedTrainSchedule.id,
+                      startTime: selectedTrainSchedule.start_time,
+                    }
+                  : undefined
+              }
+              pathItemsCoordinates={pathItemsCoordinates}
+              setMapCanvas={setMapCanvas}
             />
           </div>
-        </div>
-      )}
-
-      {/* SIMULATION : MAP */}
-      <div className="simulation-map">
-        <SimulationResultsMap
-          setExtViewport={setExtViewport}
-          geometry={pathProperties?.geometry}
-          trainSimulation={
-            selectedTrainSchedule && trainSimulation
-              ? {
-                  ...trainSimulation,
-                  trainId: selectedTrainSchedule.id,
-                  startTime: selectedTrainSchedule.start_time,
-                }
-              : undefined
-          }
-          pathItemsCoordinates={pathItemsCoordinates}
-          setMapCanvas={setMapCanvas}
-        />
-      </div>
 
-      {/* TIME STOPS TABLE */}
-      <div className="time-stop-outputs">
-        <p className="mt-2 mb-3 ml-3 font-weight-bold">{t('timetableOutput')}</p>
-        <TimesStopsOutput
-          simulatedTrain={trainSimulation}
-          trainSummary={selectedTrainSummary}
-          operationalPoints={pathProperties?.operationalPoints}
-          selectedTrainSchedule={selectedTrainSchedule}
-          path={path}
-          dataIsLoading={formattedOpPointsLoading}
-        />
-      </div>
+          {/* TIME STOPS TABLE */}
+          <div className="time-stop-outputs">
+            <p className="mt-2 mb-3 ml-3 font-weight-bold">{t('timetableOutput')}</p>
+            <TimesStopsOutput
+              simulatedTrain={trainSimulation}
+              trainSummary={selectedTrainSummary}
+              operationalPoints={pathProperties?.operationalPoints}
+              selectedTrainSchedule={selectedTrainSchedule}
+              path={path}
+              dataIsLoading={formattedOpPointsLoading}
+            />
+          </div>
 
-      {/* SIMULATION EXPORT BUTTONS */}
-      {selectedTrainSchedule &&
-        trainSimulation &&
-        pathProperties &&
-        selectedTrainRollingStock &&
-        operationalPoints &&
-        path &&
-        infraId && (
-          <SimulationResultExport
-            path={path}
-            scenarioData={scenarioData}
-            train={selectedTrainSchedule}
-            simulatedTrain={trainSimulation}
-            pathElectrifications={pathProperties.electrifications}
-            operationalPoints={operationalPoints}
-            rollingStock={selectedTrainRollingStock}
-            mapCanvas={mapCanvas}
-          />
-        )}
+          {/* SIMULATION EXPORT BUTTONS */}
+          {trainSimulation &&
+            pathProperties &&
+            selectedTrainRollingStock &&
+            operationalPoints &&
+            path &&
+            infraId && (
+              <SimulationResultExport
+                path={path}
+                scenarioData={scenarioData}
+                train={selectedTrainSchedule}
+                simulatedTrain={trainSimulation}
+                pathElectrifications={pathProperties.electrifications}
+                operationalPoints={operationalPoints}
+                rollingStock={selectedTrainRollingStock}
+                mapCanvas={mapCanvas}
+              />
+            )}
+        </>
+      )}
     </div>
   );
 };