front: display simulation results only if a train is selected or get …

…data is ready Signed-off-by: Clara Ni <clara.ni@outlook.fr>
OpenRailAssociation · Dec 16, 2024 · f100fb5 · f100fb5
1 parent 70e728e
commit f100fb5
Showing 1 changed file with 75 additions and 68 deletions.
diff --git a/front/src/applications/operationalStudies/views/SimulationResults.tsx b/front/src/applications/operationalStudies/views/SimulationResults.tsx
@@ -116,6 +116,10 @@ const SimulationResults = ({
     }
   }, [extViewport]);
 
+  if (!selectedTrainSchedule && !projectionData) {
+    return null;
+  }
+
   return (
     <div className="simulation-results">
       {/* SIMULATION : STICKY BAR */}
@@ -184,78 +188,81 @@ const SimulationResults = ({
         </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}
+      {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>
+          )}
+
+          {/* 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>
   );
 };