front: fix timetable train selection

no train was selected after deleting a train

Author: SharglutDev

front/src/modules/trainschedule/components/Timetable/Timetable.tsx

@@ -130,15 +130,37 @@ export default function Timetable({
     }
   };
 
-  const handleTrainsDelete = async () => {
-    const trainsCount = selectedTrainIds.length;
+  /**
+   * In case we are deleting the selectedTrain, this array prevents an unnecessary api call
+   * firstTwoTrainsIds will be used as props for TimetableTrainCard to avoid passing
+   * an eventual and unnecessary very large array to this component
+   */
+  const [remainingTrains, firstTwoTrainsIds] = useMemo(() => {
+    let undeletedTrains: ScheduledTrain[] = [];
+    let undeletedTrainsIds: number[] = [];
+
+    if (trainsList.length > 0) {
+      if (selectedTrainIds.length === 0) {
+        undeletedTrains = trainsList;
+        if (trainsList.length > 1) undeletedTrainsIds = [trainsList[0].id, trainsList[1].id];
+        else undeletedTrainsIds = [trainsList[0].id];
+      } else {
+        undeletedTrains = trainsList
+          .filter((train) => !selectedTrainIds.includes(train.id))
+          .sort((trainA, trainB) => trainA.departure_time - trainB.departure_time);
 
-    if (selectedTrainId && selectedTrainIds.includes(selectedTrainId)) {
-      // we need to set selectedTrainId to undefined, otherwise just after the delete,
-      // some unvalid rtk calls are dispatched (see rollingstock request in SimulationResults)
-      dispatch(updateSelectedTrainId(undefined));
+        if (undeletedTrains.length > 1)
+          undeletedTrainsIds = [undeletedTrains[0], undeletedTrains[1]].map((train) => train.id);
+        else if (undeletedTrains.length > 0) undeletedTrainsIds = [undeletedTrains[0].id];
+      }
     }
 
+    return [undeletedTrains, undeletedTrainsIds];
+  }, [selectedTrainIds, trainsList]);
+
+  const handleTrainsDelete = async () => {
+    const trainsCount = selectedTrainIds.length;
+
     await deleteTrainSchedules({ body: { ids: selectedTrainIds } })
       .unwrap()
       .then(() => {
@@ -148,6 +170,15 @@ export default function Timetable({
             text: '',
           })
         );
+
+        // The behavior if the selectedTrain is also the projectedTrain is in getSimulationResults
+        if (
+          selectedTrainId &&
+          selectedTrainIds.includes(selectedTrainId) &&
+          selectedTrainId !== selectedProjection?.id
+        ) {
+          dispatch(updateSelectedTrainId(remainingTrains[0]?.id || undefined));
+        }
       })
       .catch((e: unknown) => {
         console.error(e);
@@ -279,6 +310,7 @@ export default function Timetable({
                 isInSelection={selectedTrainIds.includes(train.id)}
                 toggleTrainSelection={toggleTrainSelection}
                 train={train}
+                firstTwoTrainsIds={firstTwoTrainsIds}
                 intervalPosition={valueToInterval(train.duration, trainsDurationsIntervals)}
                 key={`timetable-train-card-${train.id}-${train.path_id}`}
                 isSelected={infraState === 'CACHED' && selectedTrainId === train.id}

front/src/modules/trainschedule/components/Timetable/TimetableTrainCard.tsx

@@ -31,6 +31,7 @@ type Props = {
   isSelectable: boolean;
   isInSelection: boolean;
   train: ScheduledTrain;
+  firstTwoTrainsIds: number[];
   intervalPosition?: number;
   isSelected: boolean;
   isModified?: boolean;
@@ -45,6 +46,7 @@ function TimetableTrainCard({
   isSelectable,
   isInSelection,
   train,
+  firstTwoTrainsIds,
   intervalPosition,
   isSelected,
   isModified,
@@ -77,7 +79,7 @@ function TimetableTrainCard({
 
   const deleteTrain = async () => {
     if (isSelected) {
-      // we need to set selectedTrainId to undefined, otherwise just after the delete,
+      // we need to set selectedTrainId to undefined first, otherwise just after the delete,
       // some unvalid rtk calls are dispatched (see rollingstock request in SimulationResults)
       dispatch(updateSelectedTrainId(undefined));
     }
@@ -90,6 +92,14 @@ function TimetableTrainCard({
             text: '',
           })
         );
+
+        // the behavior if the selectedTrain is also the projectedTrain is in getSimulationResults
+        if (isSelected && !projectionPathIsUsed) {
+          // we check if the train about to be deleted is the first of the timetable
+          if (firstTwoTrainsIds[0] === train.id)
+            dispatch(updateSelectedTrainId(firstTwoTrainsIds[1]));
+          else dispatch(updateSelectedTrainId(firstTwoTrainsIds[0]));
+        }
       })
       .catch((e: unknown) => {
         console.error(e);