From 25af9c5014a49e31a51cc6812005033a13f76121 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20de=20Vasconcelos?= <johnyvasconcelos@icloud.com>
Date: Wed, 6 Dec 2023 21:31:08 +0000
Subject: [PATCH] Use luxon

---
 .../LinesExplorerContentPatternPathStopRealtime.js  | 13 +++++++------
 .../components/LinesExplorerMap/LinesExplorerMap.js |  2 +-
 frontend/package.json                               |  7 ++++---
 3 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/frontend/components/LinesExplorerContentPatternPathStopRealtime/LinesExplorerContentPatternPathStopRealtime.js b/frontend/components/LinesExplorerContentPatternPathStopRealtime/LinesExplorerContentPatternPathStopRealtime.js
index 9116b314..6694d439 100644
--- a/frontend/components/LinesExplorerContentPatternPathStopRealtime/LinesExplorerContentPatternPathStopRealtime.js
+++ b/frontend/components/LinesExplorerContentPatternPathStopRealtime/LinesExplorerContentPatternPathStopRealtime.js
@@ -8,6 +8,7 @@ import { useTranslations } from 'next-intl';
 import styles from './LinesExplorerContentPatternPathStopRealtime.module.css';
 import LiveIcon from '@/components/LiveIcon/LiveIcon';
 import { IconClock } from '@tabler/icons-react';
+import { DateTime } from 'luxon';
 
 /* * */
 
@@ -51,11 +52,11 @@ export default function LinesExplorerContentPatternPathStopRealtime({ patternId,
       return Math.floor(timeDifferenceBetweenEstimateAndNow / 1000 / 60);
     });
     // Limit array to the max amount of items
-    const limitedNextEstimatedArrivals = formattedNextEstimatedArrivals.slice(0, 3);
+    const limitedNextEstimatedArrivals = formattedNextEstimatedArrivals.slice(0, maxEstimatedArrivals);
     // Return result
     return limitedNextEstimatedArrivals;
     //
-  }, [realtimeData, patternId, stopSequence]);
+  }, [realtimeData, maxEstimatedArrivals, patternId, stopSequence]);
 
   const nextScheduledArrivals = useMemo(() => {
     // Return early if no data is available
@@ -79,15 +80,15 @@ export default function LinesExplorerContentPatternPathStopRealtime({ patternId,
     const sortedNextScheduledArrivals = filteredNextScheduledArrivals.sort((a, b) => a.scheduled_arrival_unix - b.scheduled_arrival_unix);
     // Format the arrival times
     const formattedNextScheduledArrivals = sortedNextScheduledArrivals.map((item) => {
-      const dateObject = new Date(item.scheduled_arrival_unix * 1000);
-      return `${dateObject.getHours()}:${dateObject.getMinutes()}`;
+      const dateTimeObject = DateTime.fromSeconds(item.scheduled_arrival_unix, { zone: 'UTC' });
+      return `${dateTimeObject.toFormat('HH', { zone: 'Europe/Lisbon' })}:${dateTimeObject.toFormat('mm', { zone: 'Europe/Lisbon' })}`;
     });
     // Limit array to the max amount of items
-    const limitedNextScheduledArrivals = formattedNextScheduledArrivals.slice(0, 3);
+    const limitedNextScheduledArrivals = formattedNextScheduledArrivals.slice(0, maxScheduledArrivals);
     // Return result
     return limitedNextScheduledArrivals;
     //
-  }, [realtimeData, patternId, stopSequence]);
+  }, [realtimeData, maxScheduledArrivals, patternId, stopSequence]);
 
   //
   // D. Render components
diff --git a/frontend/components/LinesExplorerMap/LinesExplorerMap.js b/frontend/components/LinesExplorerMap/LinesExplorerMap.js
index 036b2ff8..5f1f6bb8 100644
--- a/frontend/components/LinesExplorerMap/LinesExplorerMap.js
+++ b/frontend/components/LinesExplorerMap/LinesExplorerMap.js
@@ -214,7 +214,7 @@ export default function LinesExplorerMap() {
 
   useEffect(() => {
     // Check if map is ready
-    if (linesExplorerMap?.getSource('all-stops') === undefined) return;
+    if (linesExplorerMap && linesExplorerMap?.getSource('all-stops') === undefined) return;
     // Check if auto zoom is enabled
     if (!linesExplorerContext.map.auto_zoom) return;
     // Check if there is a selected map feature
diff --git a/frontend/package.json b/frontend/package.json
index ee9dac15..a56e22be 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -20,9 +20,10 @@
         "@turf/turf": "6.5.0",
         "dayjs": "1.11.10",
         "inflected": "2.1.0",
+        "luxon": "3.4.4",
         "maplibre-gl": "3.6.2",
         "next": "14.0.3",
-        "next-intl": "3.2.2",
+        "next-intl": "3.3.0",
         "react": "18.2.0",
         "react-dom": "18.2.0",
         "react-map-gl": "7.1.6",
@@ -32,13 +33,13 @@
     },
     "devDependencies": {
         "@types/node": "20.10.3",
-        "@types/react": "18.2.41",
+        "@types/react": "18.2.42",
         "@types/react-dom": "18.2.17",
         "eslint": "8.55.0",
         "eslint-config-next": "14.0.3",
         "postcss": "8.4.32",
         "postcss-preset-mantine": "1.11.1",
         "postcss-simple-vars": "7.0.1",
-        "typescript": "5.3.2"
+        "typescript": "5.3.3"
     }
 }
\ No newline at end of file