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, 46 insertions, 37 deletions

diff --git a/src/frontend/app/maps/styleloader.ts b/src/frontend/app/maps/styleloader.ts
index f00aacc..cf285a5 100644
--- a/src/frontend/app/maps/styleloader.ts
+++ b/src/frontend/app/maps/styleloader.ts
@@ -1,49 +1,58 @@
 import type { StyleSpecification } from "react-map-gl/maplibre";
 
-export async function loadStyle(styleName: string, colorScheme: string): Promise<StyleSpecification> {
-    const stylePath = `/maps/styles/${styleName}-${colorScheme}.json`;
-    const resp = await fetch(stylePath);
+export async function loadStyle(
+  styleName: string,
+  colorScheme: string,
+): Promise<StyleSpecification> {
+  const stylePath = `/maps/styles/${styleName}-${colorScheme}.json`;
+  const resp = await fetch(stylePath);
 
-    if (!resp.ok) {
-        throw new Error(`Failed to load style: ${stylePath}`);
-    }
+  if (!resp.ok) {
+    throw new Error(`Failed to load style: ${stylePath}`);
+  }
 
-    const style = await resp.json();
+  const style = await resp.json();
 
-    const baseUrl = window.location.origin;
-    const spritePath = style.sprite;
+  const baseUrl = window.location.origin;
+  const spritePath = style.sprite;
 
-    // Handle both string and array cases for spritePath
-    if (Array.isArray(spritePath)) {
-        // For array format, update each sprite object's URL to be absolute
-        style.sprite = spritePath.map(spriteObj => {
-            const isAbsoluteUrl = spriteObj.url.startsWith("http://") || spriteObj.url.startsWith("https://");
-            if (isAbsoluteUrl) {
-                return spriteObj;
-            }
+  // Handle both string and array cases for spritePath
+  if (Array.isArray(spritePath)) {
+    // For array format, update each sprite object's URL to be absolute
+    style.sprite = spritePath.map((spriteObj) => {
+      const isAbsoluteUrl =
+        spriteObj.url.startsWith("http://") ||
+        spriteObj.url.startsWith("https://");
+      if (isAbsoluteUrl) {
+        return spriteObj;
+      }
 
-            return {
-                ...spriteObj,
-                url: `${baseUrl}${spriteObj.url}`
-            };
-        });
-    } else if (typeof spritePath === "string") {
-        if (!spritePath.startsWith("http://") && !spritePath.startsWith("https://")) {
-            style.sprite = `${baseUrl}${spritePath}`;
-        }
+      return {
+        ...spriteObj,
+        url: `${baseUrl}${spriteObj.url}`,
+      };
+    });
+  } else if (typeof spritePath === "string") {
+    if (
+      !spritePath.startsWith("http://") &&
+      !spritePath.startsWith("https://")
+    ) {
+      style.sprite = `${baseUrl}${spritePath}`;
     }
+  }
 
-    // Detect on each source if it the 'tiles' URLs are relative and convert them to absolute URLs
-    for (const sourceKey in style.sources) {
-        const source = style.sources[sourceKey];
-        for (const tileKey in source.tiles) {
-            const tileUrl = source.tiles[tileKey];
-            const isAbsoluteUrl = tileUrl.startsWith("http://") || tileUrl.startsWith("https://");
-            if (!isAbsoluteUrl) {
-                source.tiles[tileKey] = `${baseUrl}${tileUrl}`;
-            }
-        }
+  // Detect on each source if it the 'tiles' URLs are relative and convert them to absolute URLs
+  for (const sourceKey in style.sources) {
+    const source = style.sources[sourceKey];
+    for (const tileKey in source.tiles) {
+      const tileUrl = source.tiles[tileKey];
+      const isAbsoluteUrl =
+        tileUrl.startsWith("http://") || tileUrl.startsWith("https://");
+      if (!isAbsoluteUrl) {
+        source.tiles[tileKey] = `${baseUrl}${tileUrl}`;
+      }
     }
+  }
 
-    return style as StyleSpecification;
+  return style as StyleSpecification;
 }