From bd09ebbc2de8cbd8b2bfcea72857a19cef0b49b3 Mon Sep 17 00:00:00 2001 From: Andrew Date: Fri, 14 Mar 2025 20:42:19 +0000 Subject: [PATCH] [frontend]: Create IrishRailTrainPopup --- frontend/src/App.jsx | 37 ++++++++++++------ .../src/components/IrishRailTrainPopup.jsx | 38 +++++++++++++++++++ 2 files changed, 64 insertions(+), 11 deletions(-) create mode 100644 frontend/src/components/IrishRailTrainPopup.jsx diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx index e7af31e..965d430 100644 --- a/frontend/src/App.jsx +++ b/frontend/src/App.jsx @@ -11,6 +11,7 @@ import LoadingOverlay from "./components/LoadingOverlay"; import LuasPopup from "./components/LuasPopup"; import TrainStationPopup from "./components/TrainStationPopup"; +import IrishRailTrainPopup from "./components/IrishRailTrainPopup"; const TRANSIENT_DATA_API = "https://281bc6mcm5.execute-api.us-east-1.amazonaws.com/transient_data"; const PERMANENT_DATA_API = "https://a6y312dpuj.execute-api.us-east-1.amazonaws.com/permanent_data"; @@ -247,18 +248,32 @@ function App() { icon += "NotRunning"; } + // popupContent = ( + //
+ //

{objectTitle}

+ // + //
+ // ); + popupContent = ( -
-

{objectTitle}

- -
+ ); markerText = item.trainPublicMessage + " " + item.trainDirection; diff --git a/frontend/src/components/IrishRailTrainPopup.jsx b/frontend/src/components/IrishRailTrainPopup.jsx new file mode 100644 index 0000000..bdd01f5 --- /dev/null +++ b/frontend/src/components/IrishRailTrainPopup.jsx @@ -0,0 +1,38 @@ +import React, { useState } from "react"; +import { useMap } from "react-leaflet"; + +const IrishRailTrainPopup = ({ item, objectTitle, trainStatus, trainType, latenessMessage, splitMessage, toggleFavourite, favourites }) => { + const [isFavourite, setIsFavourite] = useState(favourites.IrishRailTrain?.includes(item.trainCode)); + + const handleToggleFavourite = () => { + toggleFavourite("IrishRailTrain", item.trainCode); + setIsFavourite((prev) => !prev); + }; + + const map = useMap(); // Access the Leaflet map instance + + return ( +
+
+

{objectTitle}

+ +
+
    +
  • Train Details: {splitMessage[1].split("(")[0]}
  • +
  • Train Type: {trainType}
  • +
  • Status: {trainStatus}
  • +
  • Direction: {item.trainDirection}
  • +
  • Update: {splitMessage[2]}
  • +
  • Punctuality: {latenessMessage}
  • +
+ +
+ ); +}; + +export default IrishRailTrainPopup; \ No newline at end of file