Implement stop sheet modal for map stop interactions (#27)

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: arielcostas <94913521+arielcostas@users.noreply.github.com>
Co-authored-by: Ariel Costas Guerrero <ariel@costas.dev>

1 files changed, 7 insertions, 8 deletions

diff --git a/src/frontend/app/components/StopItem.tsx b/src/frontend/app/components/StopItem.tsx
index 29370b7..b781eb9 100644
--- a/src/frontend/app/components/StopItem.tsx
+++ b/src/frontend/app/components/StopItem.tsx
@@ -1,22 +1,21 @@
-import React from 'react';
-import { Link } from 'react-router';
-import StopDataProvider, { type Stop } from '../data/StopDataProvider';
-import LineIcon from './LineIcon';
+import React from "react";
+import { Link } from "react-router";
+import StopDataProvider, { type Stop } from "../data/StopDataProvider";
+import LineIcon from "./LineIcon";
 
 interface StopItemProps {
   stop: Stop;
 }
 
 const StopItem: React.FC<StopItemProps> = ({ stop }) => {
-
   return (
     <li className="list-item">
       <Link className="list-item-link" to={`/estimates/${stop.stopId}`}>
-      {stop.favourite && <span className="favourite-icon">★</span>} ({stop.stopId}) {StopDataProvider.getDisplayName(stop)}
+        {stop.favourite && <span className="favourite-icon">★</span>} (
+        {stop.stopId}) {StopDataProvider.getDisplayName(stop)}
         <div className="line-icons">
-          {stop.lines?.map(line => <LineIcon key={line} line={line} />)}
+          {stop.lines?.map((line) => <LineIcon key={line} line={line} />)}
         </div>
-
       </Link>
     </li>
   );