front: use Date in TrainScheduleWithDetails

Instead of passing around formatted strings, pass a Date object. That way we don't need to undo the formatting in TimetableTrainCard later on, and we get improved type safety. Signed-off-by: Simon Ser <[email protected]>
OpenRailAssociation · Nov 8, 2024 · 633e09c · 633e09c
1 parent ec33501
commit 633e09c
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 23 deletions.
diff --git a/front/src/applications/operationalStudies/helpers/formatTrainScheduleSummaries.ts b/front/src/applications/operationalStudies/helpers/formatTrainScheduleSummaries.ts
@@ -1,4 +1,3 @@
-import dayjs from 'dayjs';
 import { compact } from 'lodash';
 
 import type {
@@ -7,7 +6,6 @@ import type {
   TrainScheduleResult,
 } from 'common/api/osrdEditoastApi';
 import type { TrainScheduleWithDetails } from 'modules/trainschedule/components/Timetable/types';
-import { formatToIsoDate, isoDateToMs } from 'utils/date';
 import { jouleToKwh } from 'utils/physics';
 import { formatKmValue } from 'utils/strings';
 import { ISO8601Duration2sec } from 'utils/timeManipulation';
@@ -36,21 +34,20 @@ const formatTrainScheduleSummaries = (
         notHonoredReason = 'scheduleNotHonored';
     }
 
+    const startTime = new Date(trainSchedule.start_time);
+
     const otherProps =
       trainSummary.status === 'success'
         ? {
             isValid: true,
-            arrivalTime: formatToIsoDate(
-              isoDateToMs(trainSchedule.start_time) + trainSummary.time,
-              true
-            ),
+            arrivalTime: new Date(startTime.getTime() + trainSummary.time),
             duration: trainSummary.time,
             pathLength: formatKmValue(trainSummary.length, 'millimeters', 1),
             mechanicalEnergyConsumed: jouleToKwh(trainSummary.energy_consumption, true),
           }
         : {
             isValid: false,
-            arrivalTime: '',
+            arrivalTime: null,
             duration: 0,
             pathLength: '',
             mechanicalEnergyConsumed: 0,
@@ -64,7 +61,7 @@ const formatTrainScheduleSummaries = (
     return {
       id: trainSchedule.id,
       trainName: trainSchedule.train_name,
-      startTime: dayjs(trainSchedule.start_time).format('D/MM/YYYY HH:mm:ss'), // format to time
+      startTime,
       stopsCount:
         (trainSchedule.schedule?.filter(
           (step) => step.stop_for && ISO8601Duration2sec(step.stop_for) > 0

diff --git a/front/src/modules/trainschedule/components/Timetable/Timetable.tsx b/front/src/modules/trainschedule/components/Timetable/Timetable.tsx
@@ -32,8 +32,7 @@ type TimetableProps = {
   trainSchedulesWithDetails: TrainScheduleWithDetails[];
 };
 
-const formatDepartureDate = (dateString: string) =>
-  dayjs(dateString, 'D/M/YYYY HH:mm:ss').locale(i18n.language).format('dddd D MMMM YYYY');
+const formatDepartureDate = (d: Date) => dayjs(d).locale(i18n.language).format('dddd D MMMM YYYY');
 
 const Timetable = ({
   setDisplayTrainScheduleManagement,

diff --git a/front/src/modules/trainschedule/components/Timetable/TimetableTrainCard.tsx b/front/src/modules/trainschedule/components/Timetable/TimetableTrainCard.tsx
@@ -34,6 +34,9 @@ type TimetableTrainCardProps = {
   projectionPathIsUsed: boolean;
 };
 
+const formatFullDate = (d: Date) => dayjs(d).format('D/MM/YYYY HH:mm:ss');
+const formatDateHours = (d: Date) => dayjs(d).format('HH:mm');
+
 const TimetableTrainCard = ({
   isInSelection,
   train,
@@ -133,11 +136,7 @@ const TimetableTrainCard = ({
     dispatch(updateTrainIdUsedForProjection(train.id));
   };
 
-  /* TODO: delete the format when the date management PR has been passed */
-  const isAfterMidnight = dayjs(train.arrivalTime, 'D/MM/YYYY').isAfter(
-    dayjs(train.startTime, 'D/MM/YYYY'),
-    'day'
-  );
+  const isAfterMidnight = dayjs(train.arrivalTime).isAfter(train.startTime, 'day');
 
   return (
     <div
@@ -196,9 +195,11 @@ const TimetableTrainCard = ({
             <div className="train-time">
               <div className="status-icon after-midnight">{isAfterMidnight && <Moon />}</div>
               {train.isValid && (
-                <div className="scenario-timetable-train-departure" title={train.startTime}>
-                  {/* TODO: delete the format when the date management `PR` has been passed */}
-                  {dayjs(train.startTime, 'D/MM/YYYY HH:mm:ss').format('HH:mm')}
+                <div
+                  className="scenario-timetable-train-departure"
+                  title={formatFullDate(train.startTime)}
+                >
+                  {formatDateHours(train.startTime)}
                 </div>
               )}
               <div className="status-icon not-honored-or-too-fast">
@@ -209,10 +210,9 @@ const TimetableTrainCard = ({
                 <div
                   data-testid="train-arrival-time"
                   className="scenario-timetable-train-arrival"
-                  title={train.arrivalTime}
+                  title={formatFullDate(train.arrivalTime)}
                 >
-                  {/* TODO: delete the format when the date management `PR` has been passed */}
-                  {dayjs(train.arrivalTime, 'D/MM/YYYY HH:mm:ss').format('HH:mm')}
+                  {formatDateHours(train.arrivalTime)}
                 </div>
               )}
               <div

diff --git a/front/src/modules/trainschedule/components/Timetable/types.ts b/front/src/modules/trainschedule/components/Timetable/types.ts
@@ -12,8 +12,8 @@ export type ScheduledPointsHonoredFilter = 'both' | 'honored' | 'notHonored';
 export type TrainScheduleWithDetails = {
   id: number;
   trainName: string;
-  startTime: string;
-  arrivalTime: string;
+  startTime: Date;
+  arrivalTime: Date | null;
   /** in ms */
   duration: number;
   stopsCount: number;