front: update stdcmEnvironment when selecting a new scenario

Signed-off-by: Clara Ni <clara.ni@outlook.fr>

Author: clarani

front/src/applications/stdcm/components/StdcmSimulationParams.tsx

@@ -1,9 +1,7 @@
 import { useTranslation } from 'react-i18next';
-import { useSelector } from 'react-redux';
 
 import ScenarioExplorer from 'modules/scenario/components/ScenarioExplorer';
 import StdcmAllowances from 'modules/stdcmAllowances/components/StdcmAllowances';
-import { getStdcmTimetableID } from 'reducers/osrdconf/stdcmConf/selectors';
 
 import StdcmCard from './StdcmForm/StdcmCard';
 
@@ -22,8 +20,6 @@ const StdcmSimulationParams = ({
 }: StdcmSimulationParamsProps) => {
   const { t } = useTranslation('stdcm');
 
-  const timetableId = useSelector(getStdcmTimetableID);
-
   return (
     <StdcmCard name={t('debug.simulationSettings')} disabled={disabled}>
       <div className="d-flex stdcm-simulation-params">
@@ -33,7 +29,6 @@ const StdcmSimulationParams = ({
             globalStudyId={studyID}
             globalScenarioId={scenarioID}
             displayImgProject={false}
-            timetableId={timetableId}
           />
         </div>
         <div className="stdcm-allowances ml-2">

front/src/modules/scenario/components/ScenarioExplorer/MiniCards.tsx

@@ -2,33 +2,36 @@ import { useContext } from 'react';
 
 import cx from 'classnames';
 
-import type {
-  ProjectWithStudies,
-  ScenarioWithDetails,
-  StudyWithScenarios,
+import {
+  osrdEditoastApi,
+  type ProjectWithStudies,
+  type ScenarioWithDetails,
+  type StudyWithScenarios,
 } from 'common/api/osrdEditoastApi';
 import { ModalContext } from 'common/BootstrapSNCF/ModalSNCF/ModalProvider';
-import { useOsrdConfActions } from 'common/osrdContext';
+import { getScenarioDatetimeWindow } from 'modules/scenario/helpers/utils';
+import { updateStdcmEnvironment } from 'reducers/osrdconf/stdcmConf';
 import { useAppDispatch } from 'store';
 
 import Project2Image from './ScenarioExplorerProject2Image';
 
 type MiniCardProps = {
   isSelected?: boolean;
-  setSelectedID: (arg0?: number) => void;
 };
 
-interface MiniCardProjectProps extends MiniCardProps {
+type MiniCardProjectProps = MiniCardProps & {
   project: ProjectWithStudies;
-}
-interface MiniCardStudyProps extends MiniCardProps {
+  setSelectedID: (id: number) => void;
+};
+type MiniCardStudyProps = MiniCardProps & {
   study: StudyWithScenarios;
-}
-interface MiniCardScenarioProps extends MiniCardProps {
+  setSelectedID: (id: number) => void;
+};
+type MiniCardScenarioProps = MiniCardProps & {
   scenario: ScenarioWithDetails;
   projectID: number;
   studyID: number;
-}
+};
 
 export const ProjectMiniCard = ({ project, setSelectedID, isSelected }: MiniCardProjectProps) => (
   <div
@@ -71,24 +74,38 @@ export const StudyMiniCard = ({ study, setSelectedID, isSelected }: MiniCardStud
 
 export const ScenarioMiniCard = ({
   scenario,
-  setSelectedID,
   isSelected,
   projectID,
   studyID,
 }: MiniCardScenarioProps) => {
   const dispatch = useAppDispatch();
   const { closeModal } = useContext(ModalContext);
-  const { updateInfraID, updateProjectID, updateScenarioID, updateStudyID, updateTimetableID } =
-    useOsrdConfActions();
-  const selectScenario = () => {
-    setSelectedID(scenario.id);
-    dispatch(updateProjectID(projectID));
-    dispatch(updateStudyID(studyID));
-    dispatch(updateScenarioID(scenario.id));
-    dispatch(updateInfraID(scenario.infra_id));
-    dispatch(updateTimetableID(scenario.timetable_id));
+
+  const [getTimetableTrainSchedules] =
+    osrdEditoastApi.endpoints.getAllTimetableByIdTrainSchedules.useLazyQuery();
+
+  const selectScenario = async () => {
+    const trainSchedules = await getTimetableTrainSchedules({
+      timetableId: scenario.timetable_id,
+    }).unwrap();
+
+    const scenarioDateTimeWindow = getScenarioDatetimeWindow(trainSchedules);
+
+    dispatch(
+      updateStdcmEnvironment({
+        infraID: scenario.infra_id,
+        timetableID: scenario.timetable_id,
+        electricalProfileSetId: scenario.electrical_profile_set_id,
+        searchDatetimeWindow: scenarioDateTimeWindow,
+        projectID,
+        studyID,
+        scenarioID: scenario.id,
+      })
+    );
+
     closeModal();
   };
+
   return (
     <div
       className={cx('minicard', 'scenario', {

front/src/modules/scenario/components/ScenarioExplorer/ScenarioExplorer.tsx

@@ -12,9 +12,6 @@ import { getDocument } from 'common/api/documentApi';
 import { osrdEditoastApi } from 'common/api/osrdEditoastApi';
 import { useModal } from 'common/BootstrapSNCF/ModalSNCF';
 import { LoaderFill } from 'common/Loaders';
-import { getScenarioDatetimeWindow } from 'modules/scenario/helpers/utils';
-import { updateStdcmEnvironment } from 'reducers/osrdconf/stdcmConf';
-import { useAppDispatch } from 'store';
 
 import ScenarioExplorerModal, { type ScenarioExplorerProps } from './ScenarioExplorerModal';
 
@@ -23,13 +20,10 @@ const ScenarioExplorer = ({
   globalStudyId,
   globalScenarioId,
   displayImgProject = true,
-  timetableId,
 }: ScenarioExplorerProps & {
   displayImgProject?: boolean;
-  timetableId: number | undefined;
 }) => {
   const { t } = useTranslation('common/scenarioExplorer');
-  const dispatch = useAppDispatch();
   const { openModal } = useModal();
   const [imageUrl, setImageUrl] = useState<string>();
 
@@ -57,13 +51,6 @@ const ScenarioExplorer = ({
       }
     );
 
-  const { data: timetable } = osrdEditoastApi.endpoints.getAllTimetableByIdTrainSchedules.useQuery(
-    { timetableId: timetableId! },
-    {
-      skip: !timetableId,
-    }
-  );
-
   const getProjectImage = async (imageId: number) => {
     try {
       const blobImage = await getDocument(imageId);
@@ -73,22 +60,6 @@ const ScenarioExplorer = ({
     }
   };
 
-  useEffect(() => {
-    if (scenario && timetable) {
-      const scenarioDateTimeWindow = getScenarioDatetimeWindow(timetable);
-
-      // We also set the stdcm environment in case we select a scenario from the stdcm interface.
-      dispatch(
-        updateStdcmEnvironment({
-          infraID: scenario.infra_id,
-          timetableID: scenario.timetable_id,
-          electricalProfileSetId: scenario.electrical_profile_set_id,
-          searchDatetimeWindow: scenarioDateTimeWindow,
-        })
-      );
-    }
-  }, [timetable]);
-
   useEffect(() => {
     if (projectDetails?.image) {
       getProjectImage(projectDetails?.image);
@@ -161,7 +132,7 @@ const ScenarioExplorer = ({
                 </span>
 
                 <span className="scenario-explorator-card-head-scenario-traincount">
-                  {timetable && timetable.length}
+                  {scenario.trains_count}
                   <MdTrain />
                 </span>
               </div>

front/src/modules/scenario/components/ScenarioExplorer/ScenarioExplorerModal.tsx

@@ -34,9 +34,8 @@ const ScenarioExplorerModal = ({
   const { t } = useTranslation('common/scenarioExplorer');
   const dispatch = useAppDispatch();
 
-  const [projectID, setProjectID] = useState<number | undefined>(globalProjectId);
-  const [studyID, setStudyID] = useState<number | undefined>(globalStudyId);
-  const [scenarioID, setScenarioID] = useState<number | undefined>(globalScenarioId);
+  const [projectID, setProjectID] = useState(globalProjectId);
+  const [studyID, setStudyID] = useState(globalStudyId);
   const [studiesList, setStudiesList] = useState<StudyWithScenarios[]>();
   const [scenariosList, setScenariosList] = useState<ScenarioWithDetails[]>();
 
@@ -173,8 +172,7 @@ const ScenarioExplorerModal = ({
                   scenariosList.map((scenario) => (
                     <ScenarioMiniCard
                       scenario={scenario}
-                      setSelectedID={setScenarioID}
-                      isSelected={scenario.id === scenarioID}
+                      isSelected={scenario.id === globalScenarioId}
                       projectID={projectID}
                       studyID={studyID}
                       key={`scenario-explorator-modal-${scenario.id}`}

front/src/reducers/osrdconf/stdcmConf/index.ts

@@ -145,7 +145,10 @@ export const stdcmConfSlice = createSlice({
           | 'electricalProfileSetId'
           | 'workScheduleGroupId'
           | 'temporarySpeedLimitGroupId'
-          | 'searchDatetimeWindow',
+          | 'searchDatetimeWindow'
+          | 'projectID'
+          | 'studyID'
+          | 'scenarioID',
           'infraID' | 'timetableID'
         >
       >
@@ -158,6 +161,10 @@ export const stdcmConfSlice = createSlice({
       state.workScheduleGroupId = action.payload.workScheduleGroupId;
       state.temporarySpeedLimitGroupId = action.payload.temporarySpeedLimitGroupId;
 
+      state.projectID = action.payload.projectID;
+      state.studyID = action.payload.studyID;
+      state.scenarioID = action.payload.scenarioID;
+
       // check that the arrival dates are in the search time window
       const origin = state.stdcmPathSteps.at(0) as Extract<StdcmPathStep, { isVia: false }>;
       const destination = state.stdcmPathSteps.at(-1) as Extract<StdcmPathStep, { isVia: false }>;