From b9bb62cf0c2af848bf02e2a74d9bd109ef570010 Mon Sep 17 00:00:00 2001 From: Ariel Costas Guerrero Date: Mon, 8 Dec 2025 12:04:25 +0100 Subject: Update formatting --- src/frontend/app/AppContext.tsx | 4 +- src/frontend/app/components/LineIcon.tsx | 9 +- src/frontend/app/components/StopGallery.tsx | 21 +- src/frontend/app/components/StopGalleryItem.tsx | 10 +- src/frontend/app/components/StopHelpModal.tsx | 4 +- src/frontend/app/components/StopMapModal.tsx | 29 +- src/frontend/app/components/StopSummarySheet.tsx | 8 +- .../Stops/ConsolidatedCirculationCard.css | 3 +- .../Stops/ConsolidatedCirculationCard.tsx | 139 +++--- .../Stops/ConsolidatedCirculationList.tsx | 14 +- src/frontend/app/components/ThemeColorManager.tsx | 6 +- src/frontend/app/components/layout/AppShell.tsx | 5 +- src/frontend/app/components/layout/Drawer.css | 4 +- src/frontend/app/components/layout/NavBar.tsx | 9 +- src/frontend/app/config/RegionConfig.ts | 6 +- src/frontend/app/contexts/PageTitleContext.tsx | 4 +- src/frontend/app/data/LineColors.ts | 5 +- src/frontend/app/data/LinesData.ts | 472 +++++++++++---------- src/frontend/app/data/StopDataProvider.ts | 63 +-- src/frontend/app/root.css | 4 +- src/frontend/app/root.tsx | 2 +- src/frontend/app/routes/about.tsx | 23 +- src/frontend/app/routes/home.tsx | 36 +- src/frontend/app/routes/lines.tsx | 57 +-- src/frontend/app/routes/map.tsx | 62 ++- src/frontend/app/routes/settings.tsx | 34 +- src/frontend/app/routes/stops-$id.tsx | 44 +- src/frontend/vite.config.ts | 6 +- 28 files changed, 605 insertions(+), 478 deletions(-) (limited to 'src/frontend') diff --git a/src/frontend/app/AppContext.tsx b/src/frontend/app/AppContext.tsx index 12a54da..2102ad7 100644 --- a/src/frontend/app/AppContext.tsx +++ b/src/frontend/app/AppContext.tsx @@ -23,7 +23,9 @@ export const useApp = () => { ...map, // Mock region support for now since we only have one region region: "vigo" as RegionId, - setRegion: (region: RegionId) => { console.log("Set region", region); }, + setRegion: (region: RegionId) => { + console.log("Set region", region); + }, }; }; diff --git a/src/frontend/app/components/LineIcon.tsx b/src/frontend/app/components/LineIcon.tsx index fc40824..8bbeb20 100644 --- a/src/frontend/app/components/LineIcon.tsx +++ b/src/frontend/app/components/LineIcon.tsx @@ -6,13 +6,10 @@ interface LineIconProps { mode?: "rounded" | "pill" | "default"; } -const LineIcon: React.FC = ({ - line, - mode = "default", -}) => { +const LineIcon: React.FC = ({ line, mode = "default" }) => { const actualLine = useMemo(() => { - return line.trim().replace('510', 'NAD'); - }, [line]) + return line.trim().replace("510", "NAD"); + }, [line]); const formattedLine = useMemo(() => { return /^[a-zA-Z]/.test(actualLine) ? actualLine : `L${actualLine}`; diff --git a/src/frontend/app/components/StopGallery.tsx b/src/frontend/app/components/StopGallery.tsx index a45bfca..8c13aa1 100644 --- a/src/frontend/app/components/StopGallery.tsx +++ b/src/frontend/app/components/StopGallery.tsx @@ -36,7 +36,9 @@ const StopGallery: React.FC = ({ if (stops.length === 0 && emptyMessage) { return (
-

{title}

+

+ {title} +

{emptyMessage} @@ -52,15 +54,17 @@ const StopGallery: React.FC = ({ return (

-

{title}

+

+ {title} +

@@ -73,8 +77,11 @@ const StopGallery: React.FC = ({ {stops.map((_, index) => ( ))}
diff --git a/src/frontend/app/components/StopGalleryItem.tsx b/src/frontend/app/components/StopGalleryItem.tsx index 6c80362..bf60697 100644 --- a/src/frontend/app/components/StopGalleryItem.tsx +++ b/src/frontend/app/components/StopGalleryItem.tsx @@ -22,7 +22,9 @@ const StopGalleryItem: React.FC = ({ stop }) => { to={`/stops/${stop.stopId}`} >
- {stop.favourite && ★} + {stop.favourite && ( + ★ + )} ({stop.stopId}) @@ -30,10 +32,10 @@ const StopGalleryItem: React.FC = ({ stop }) => {
{StopDataProvider.getDisplayName(stop)} diff --git a/src/frontend/app/components/StopHelpModal.tsx b/src/frontend/app/components/StopHelpModal.tsx index 87e02f9..e8157ab 100644 --- a/src/frontend/app/components/StopHelpModal.tsx +++ b/src/frontend/app/components/StopHelpModal.tsx @@ -21,9 +21,7 @@ export const StopHelpModal: React.FC = ({
-

- {t("stop_help.title")} -

+

{t("stop_help.title")}

diff --git a/src/frontend/app/components/StopMapModal.tsx b/src/frontend/app/components/StopMapModal.tsx index 55ad848..1cb6d88 100644 --- a/src/frontend/app/components/StopMapModal.tsx +++ b/src/frontend/app/components/StopMapModal.tsx @@ -1,11 +1,12 @@ import maplibregl from "maplibre-gl"; -import React, { useCallback, useEffect, useMemo, useRef, useState } from "react"; -import Map, { - Layer, - Marker, - Source, - type MapRef -} from "react-map-gl/maplibre"; +import React, { + useCallback, + useEffect, + useMemo, + useRef, + useState, +} from "react"; +import Map, { Layer, Marker, Source, type MapRef } from "react-map-gl/maplibre"; import { Sheet } from "react-modal-sheet"; import { useApp } from "~/AppContext"; import { REGION_DATA } from "~/config/RegionConfig"; @@ -161,7 +162,7 @@ export const StopMapModal: React.FC = ({ maxZoom: 17, } as any); } - } catch { } + } catch {} }, [stop, selectedBus, shapeData, previousShapeData]); // Load style without traffic layers for the stop map @@ -337,11 +338,7 @@ export const StopMapModal: React.FC = ({ } return ( - + @@ -358,7 +355,11 @@ export const StopMapModal: React.FC = ({ }} style={{ width: "100%", height: "50vh" }} mapStyle={styleSpec} - attributionControl={{ compact: false, customAttribution: "Concello de Vigo & Viguesa de Transportes SL" }} + attributionControl={{ + compact: false, + customAttribution: + "Concello de Vigo & Viguesa de Transportes SL", + }} ref={mapRef} interactive={true} onMove={(e) => { diff --git a/src/frontend/app/components/StopSummarySheet.tsx b/src/frontend/app/components/StopSummarySheet.tsx index e85dda3..55cbbd8 100644 --- a/src/frontend/app/components/StopSummarySheet.tsx +++ b/src/frontend/app/components/StopSummarySheet.tsx @@ -102,10 +102,10 @@ export const StopSheet: React.FC = ({ // Show only the next 4 arrivals const sortedData = data ? [...data].sort( - (a, b) => - (a.realTime?.minutes ?? a.schedule?.minutes ?? 999) - - (b.realTime?.minutes ?? b.schedule?.minutes ?? 999) - ) + (a, b) => + (a.realTime?.minutes ?? a.schedule?.minutes ?? 999) - + (b.realTime?.minutes ?? b.schedule?.minutes ?? 999) + ) : []; const limitedEstimates = sortedData.slice(0, 4); diff --git a/src/frontend/app/components/Stops/ConsolidatedCirculationCard.css b/src/frontend/app/components/Stops/ConsolidatedCirculationCard.css index 9922b03..935c06d 100644 --- a/src/frontend/app/components/Stops/ConsolidatedCirculationCard.css +++ b/src/frontend/app/components/Stops/ConsolidatedCirculationCard.css @@ -1,4 +1,4 @@ -@import '../../tailwind.css'; +@import "../../tailwind.css"; .consolidated-circulation-card { all: unset; @@ -40,7 +40,6 @@ pointer-events: none; } - .consolidated-circulation-card .card-row { display: flex; align-items: center; diff --git a/src/frontend/app/components/Stops/ConsolidatedCirculationCard.tsx b/src/frontend/app/components/Stops/ConsolidatedCirculationCard.tsx index 70a9355..3fa984b 100644 --- a/src/frontend/app/components/Stops/ConsolidatedCirculationCard.tsx +++ b/src/frontend/app/components/Stops/ConsolidatedCirculationCard.tsx @@ -1,5 +1,5 @@ import { useEffect, useMemo, useRef, useState } from "react"; -import Marquee from 'react-fast-marquee'; +import Marquee from "react-fast-marquee"; import { useTranslation } from "react-i18next"; import LineIcon from "~components/LineIcon"; import { type ConsolidatedCirculation } from "~routes/stops-$id"; @@ -109,7 +109,10 @@ const AutoMarquee = ({ text }: { text: string }) => { } return ( -
+
{text}
); @@ -175,9 +178,11 @@ export const ConsolidatedCirculationCard: React.FC< const tone = delta <= 2 ? "delay-ok" : delta <= 10 ? "delay-warn" : "delay-critical"; return { - label: reduced ? `R${delta}` : t("estimates.delay_positive", { - minutes: delta, - }), + label: reduced + ? `R${delta}` + : t("estimates.delay_positive", { + minutes: delta, + }), tone, kind: "delay", } as const; @@ -186,22 +191,28 @@ export const ConsolidatedCirculationCard: React.FC< // Early const tone = absDelta <= 2 ? "delay-ok" : "delay-early"; return { - label: reduced ? `A${absDelta}` : t("estimates.delay_negative", { - minutes: absDelta, - }), + label: reduced + ? `A${absDelta}` + : t("estimates.delay_negative", { + minutes: absDelta, + }), tone, kind: "delay", } as const; }, [estimate.schedule, estimate.realTime, t, reduced]); const metaChips = useMemo(() => { - const chips: Array<{ label: string; tone?: string, kind?: "regular" | "gps" | "delay" | "warning" }> = []; + const chips: Array<{ + label: string; + tone?: string; + kind?: "regular" | "gps" | "delay" | "warning"; + }> = []; if (delayChip) { chips.push(delayChip); } - if (estimate.schedule && driver !== 'renfe') { + if (estimate.schedule && driver !== "renfe") { chips.push({ label: `${parseServiceId(estimate.schedule.serviceId)} · ${getTripIdDisplay( estimate.schedule.tripId @@ -211,7 +222,10 @@ export const ConsolidatedCirculationCard: React.FC< } if (estimate.realTime && estimate.realTime.distance >= 0) { - chips.push({ label: formatDistance(estimate.realTime.distance), kind: "regular" }); + chips.push({ + label: formatDistance(estimate.realTime.distance), + kind: "regular", + }); } if (estimate.currentPosition) { @@ -243,7 +257,7 @@ export const ConsolidatedCirculationCard: React.FC< // Check if bus has GPS position (live tracking) const hasGpsPosition = !!estimate.currentPosition; - const isRenfe = driver === 'renfe'; + const isRenfe = driver === "renfe"; const isClickable = hasGpsPosition; const looksDisabled = !isClickable && !isRenfe; @@ -251,10 +265,10 @@ export const ConsolidatedCirculationCard: React.FC< const interactiveProps = readonly ? {} : { - onClick: isClickable ? onMapClick : undefined, - type: "button" as const, - disabled: !isClickable, - }; + onClick: isClickable ? onMapClick : undefined, + type: "button" as const, + disabled: !isClickable, + }; if (reduced) { return ( @@ -263,15 +277,16 @@ export const ConsolidatedCirculationCard: React.FC< flex-none flex items-center gap-2.5 min-h-12 bg-(--message-background-color) border border-(--border-color) rounded-xl px-3 py-2.5 transition-all - ${readonly - ? looksDisabled - ? "opacity-70 cursor-not-allowed" - : "" - : isClickable - ? "cursor-pointer hover:shadow-[0_4px_14px_rgba(0,0,0,0.08)] hover:border-(--button-background-color) hover:bg-[color-mix(in_oklab,var(--button-background-color)_5%,var(--message-background-color))] active:scale-[0.98]" - : looksDisabled + ${ + readonly + ? looksDisabled ? "opacity-70 cursor-not-allowed" : "" + : isClickable + ? "cursor-pointer hover:shadow-[0_4px_14px_rgba(0,0,0,0.08)] hover:border-(--button-background-color) hover:bg-[color-mix(in_oklab,var(--button-background-color)_5%,var(--message-background-color))] active:scale-[0.98]" + : looksDisabled + ? "opacity-70 cursor-not-allowed" + : "" } `.trim()} {...interactiveProps} @@ -281,8 +296,10 @@ export const ConsolidatedCirculationCard: React.FC<
- {driver === 'renfe' && estimate.schedule?.tripId && ( - {estimate.schedule.tripId} + {driver === "renfe" && estimate.schedule?.tripId && ( + + {estimate.schedule.tripId} + )} {estimate.route} @@ -292,22 +309,28 @@ export const ConsolidatedCirculationCard: React.FC< let chipColourClasses = ""; switch (chip.tone) { case "delay-ok": - chipColourClasses = "bg-green-600/20 dark:bg-green-600/30 text-green-700 dark:text-green-300"; + chipColourClasses = + "bg-green-600/20 dark:bg-green-600/30 text-green-700 dark:text-green-300"; break; case "delay-warn": - chipColourClasses = "bg-amber-600/20 dark:bg-yellow-600/30 text-amber-700 dark:text-yellow-300"; + chipColourClasses = + "bg-amber-600/20 dark:bg-yellow-600/30 text-amber-700 dark:text-yellow-300"; break; case "delay-critical": - chipColourClasses = "bg-red-400/20 dark:bg-red-600/30 text-red-600 dark:text-red-300"; + chipColourClasses = + "bg-red-400/20 dark:bg-red-600/30 text-red-600 dark:text-red-300"; break; case "delay-early": - chipColourClasses = "bg-blue-400/20 dark:bg-blue-600/30 text-blue-700 dark:text-blue-300"; + chipColourClasses = + "bg-blue-400/20 dark:bg-blue-600/30 text-blue-700 dark:text-blue-300"; break; case "warning": - chipColourClasses = "bg-orange-400/20 dark:bg-orange-600/30 text-orange-700 dark:text-orange-300"; + chipColourClasses = + "bg-orange-400/20 dark:bg-orange-600/30 text-orange-700 dark:text-orange-300"; break; default: - chipColourClasses = "bg-black/[0.06] dark:bg-white/[0.12] text-[var(--text-color)]"; + chipColourClasses = + "bg-black/[0.06] dark:bg-white/[0.12] text-[var(--text-color)]"; } return ( @@ -315,8 +338,12 @@ export const ConsolidatedCirculationCard: React.FC< key={`${chip.label}-${idx}`} className={`text-xs px-2 py-0.5 rounded-full flex items-center justify-center gap-1 shrink-0 ${chipColourClasses}`} > - {chip.kind === "gps" && ()} - {chip.kind === "warning" && ()} + {chip.kind === "gps" && ( + + )} + {chip.kind === "warning" && ( + + )} {chip.label} ); @@ -327,17 +354,20 @@ export const ConsolidatedCirculationCard: React.FC<
{etaValue} - {etaUnit} + + {etaUnit} +
@@ -346,16 +376,17 @@ export const ConsolidatedCirculationCard: React.FC< return ( <> @@ -365,8 +396,10 @@ export const ConsolidatedCirculationCard: React.FC<
- {driver === 'renfe' && estimate.schedule?.tripId && ( - {estimate.schedule.tripId} + {driver === "renfe" && estimate.schedule?.tripId && ( + + {estimate.schedule.tripId} + )} {estimate.route} @@ -389,8 +422,12 @@ export const ConsolidatedCirculationCard: React.FC< key={`${chip.label}-${idx}`} className={`meta-chip ${chip.tone ?? ""}`.trim()} > - {chip.kind === "gps" && ()} - {chip.kind === "warning" && ()} + {chip.kind === "gps" && ( + + )} + {chip.kind === "warning" && ( + + )} {chip.label} ))} diff --git a/src/frontend/app/components/Stops/ConsolidatedCirculationList.tsx b/src/frontend/app/components/Stops/ConsolidatedCirculationList.tsx index ec79f1c..eea4582 100644 --- a/src/frontend/app/components/Stops/ConsolidatedCirculationList.tsx +++ b/src/frontend/app/components/Stops/ConsolidatedCirculationList.tsx @@ -7,17 +7,17 @@ import "./ConsolidatedCirculationList.css"; interface ConsolidatedCirculationListProps { data: ConsolidatedCirculation[]; - onCirculationClick?: (estimate: ConsolidatedCirculation, index: number) => void; + onCirculationClick?: ( + estimate: ConsolidatedCirculation, + index: number + ) => void; reduced?: boolean; driver?: string; } -export const ConsolidatedCirculationList: React.FC = ({ - data, - onCirculationClick, - reduced, - driver, -}) => { +export const ConsolidatedCirculationList: React.FC< + ConsolidatedCirculationListProps +> = ({ data, onCirculationClick, reduced, driver }) => { const { t } = useTranslation(); const sortedData = [...data].sort( diff --git a/src/frontend/app/components/ThemeColorManager.tsx b/src/frontend/app/components/ThemeColorManager.tsx index c138dc9..eba0471 100644 --- a/src/frontend/app/components/ThemeColorManager.tsx +++ b/src/frontend/app/components/ThemeColorManager.tsx @@ -9,11 +9,11 @@ export const ThemeColorManager = () => { let meta = document.querySelector('meta[name="theme-color"]'); if (!meta) { - meta = document.createElement('meta'); - meta.setAttribute('name', 'theme-color'); + meta = document.createElement("meta"); + meta.setAttribute("name", "theme-color"); document.head.appendChild(meta); } - meta.setAttribute('content', color); + meta.setAttribute("content", color); }, [resolvedTheme]); return null; diff --git a/src/frontend/app/components/layout/AppShell.tsx b/src/frontend/app/components/layout/AppShell.tsx index 91f6c0d..08aee59 100644 --- a/src/frontend/app/components/layout/AppShell.tsx +++ b/src/frontend/app/components/layout/AppShell.tsx @@ -1,6 +1,9 @@ import React, { useState } from "react"; import { Outlet } from "react-router"; -import { PageTitleProvider, usePageTitleContext } from "~/contexts/PageTitleContext"; +import { + PageTitleProvider, + usePageTitleContext, +} from "~/contexts/PageTitleContext"; import { ThemeColorManager } from "../ThemeColorManager"; import "./AppShell.css"; import { Drawer } from "./Drawer"; diff --git a/src/frontend/app/components/layout/Drawer.css b/src/frontend/app/components/layout/Drawer.css index 27ccce6..4f6bd5f 100644 --- a/src/frontend/app/components/layout/Drawer.css +++ b/src/frontend/app/components/layout/Drawer.css @@ -8,7 +8,9 @@ z-index: 99; opacity: 0; visibility: hidden; - transition: opacity 0.3s ease, visibility 0.3s ease; + transition: + opacity 0.3s ease, + visibility 0.3s ease; } .drawer-overlay.open { diff --git a/src/frontend/app/components/layout/NavBar.tsx b/src/frontend/app/components/layout/NavBar.tsx index 0ac6a71..40591c4 100644 --- a/src/frontend/app/components/layout/NavBar.tsx +++ b/src/frontend/app/components/layout/NavBar.tsx @@ -57,7 +57,7 @@ export default function NavBar({ orientation = "horizontal" }: NavBarProps) { updateMapState(coords, 16); } }, - () => { }, + () => {}, { enableHighAccuracy: false, maximumAge: 5 * 60 * 1000, @@ -70,13 +70,14 @@ export default function NavBar({ orientation = "horizontal" }: NavBarProps) { name: t("navbar.lines", "Líneas"), icon: Route, path: "/lines", - } + }, ]; return (
-

- {t("about.thanks_council")} -

+

{t("about.thanks_council")}

@@ -119,8 +119,17 @@ export default function About() { rel="nofollow noreferrer noopener" target="_blank" > -
{userLocation && ( - - - + + + )}

@@ -322,9 +341,10 @@ export default function StopList() { )} {!loading && data - ? (userLocation ? sortedAllStops.slice(0, 6) : sortedAllStops).map( - (stop) => - ) + ? (userLocation + ? sortedAllStops.slice(0, 6) + : sortedAllStops + ).map((stop) => ) : null}

diff --git a/src/frontend/app/routes/lines.tsx b/src/frontend/app/routes/lines.tsx index 658716f..acf8a7f 100644 --- a/src/frontend/app/routes/lines.tsx +++ b/src/frontend/app/routes/lines.tsx @@ -2,36 +2,39 @@ import { useTranslation } from "react-i18next"; import LineIcon from "~/components/LineIcon"; import { usePageTitle } from "~/contexts/PageTitleContext"; import { VIGO_LINES } from "~/data/LinesData"; -import '../tailwind-full.css'; +import "../tailwind-full.css"; export default function LinesPage() { - const { t } = useTranslation(); - usePageTitle(t("navbar.lines", "Líneas")); + const { t } = useTranslation(); + usePageTitle(t("navbar.lines", "Líneas")); - return ( -
-

- {t("lines.description", "A continuación se muestra una lista de las líneas de autobús urbano de Vigo con sus respectivas rutas y enlaces a los horarios oficiales.")} -

+ return ( +
+

+ {t( + "lines.description", + "A continuación se muestra una lista de las líneas de autobús urbano de Vigo con sus respectivas rutas y enlaces a los horarios oficiales." + )} +

-
- {VIGO_LINES.map((line) => ( - - -
-

- {line.routeName} -

-
- - ))} +
+ {VIGO_LINES.map((line) => ( + + +
+

+ {line.routeName} +

-
- ); + + ))} +
+
+ ); } diff --git a/src/frontend/app/routes/map.tsx b/src/frontend/app/routes/map.tsx index 402bf60..187e9f2 100644 --- a/src/frontend/app/routes/map.tsx +++ b/src/frontend/app/routes/map.tsx @@ -12,7 +12,7 @@ import Map, { Source, type MapLayerMouseEvent, type MapRef, - type StyleSpecification + type StyleSpecification, } from "react-map-gl/maplibre"; import { StopSheet } from "~/components/StopSummarySheet"; import { REGION_DATA } from "~/config/RegionConfig"; @@ -35,7 +35,13 @@ export default function StopMap() { const [stops, setStops] = useState< GeoJsonFeature< Point, - { stopId: string; name: string; lines: string[]; cancelled?: boolean, prefix: string } + { + stopId: string; + name: string; + lines: string[]; + cancelled?: boolean; + prefix: string; + } >[] >([]); const [selectedStop, setSelectedStop] = useState(null); @@ -51,7 +57,12 @@ export default function StopMap() { const onMapClick = (e: MapLayerMouseEvent) => { const features = e.features; if (!features || features.length === 0) { - console.debug("No features found on map click. Position:", e.lngLat, "Point:", e.point); + console.debug( + "No features found on map click. Position:", + e.lngLat, + "Point:", + e.point + ); return; } const feature = features[0]; @@ -65,7 +76,13 @@ export default function StopMap() { StopDataProvider.getStops().then((data) => { const features: GeoJsonFeature< Point, - { stopId: string; name: string; lines: string[]; cancelled?: boolean, prefix: string } + { + stopId: string; + name: string; + lines: string[]; + cancelled?: boolean; + prefix: string; + } >[] = data.map((s) => ({ type: "Feature", geometry: { @@ -77,7 +94,11 @@ export default function StopMap() { name: s.name.original, lines: s.lines, cancelled: s.cancelled ?? false, - prefix: s.stopId.startsWith("renfe:") ? "stop-renfe" : (s.cancelled ? "stop-vitrasa-cancelled" : "stop-vitrasa"), + prefix: s.stopId.startsWith("renfe:") + ? "stop-renfe" + : s.cancelled + ? "stop-vitrasa-cancelled" + : "stop-vitrasa", }, })); setStops(features); @@ -190,7 +211,11 @@ export default function StopMap() { maxBounds={[REGION_DATA.bounds.sw, REGION_DATA.bounds.ne]} > - + - { - selectedStop && ( - setIsSheetOpen(false)} - stop={selectedStop} - /> - ) - } - + {selectedStop && ( + setIsSheetOpen(false)} + stop={selectedStop} + /> + )} + ); } diff --git a/src/frontend/app/routes/settings.tsx b/src/frontend/app/routes/settings.tsx index 9b4625f..56df777 100644 --- a/src/frontend/app/routes/settings.tsx +++ b/src/frontend/app/routes/settings.tsx @@ -2,22 +2,29 @@ import { Computer, Moon, Sun } from "lucide-react"; import { useTranslation } from "react-i18next"; import { usePageTitle } from "~/contexts/PageTitleContext"; import { useApp, type Theme } from "../AppContext"; -import '../tailwind-full.css'; +import "../tailwind-full.css"; export default function Settings() { const { t, i18n } = useTranslation(); usePageTitle(t("navbar.settings", "Ajustes")); - const { - theme, - setTheme, - mapPositionMode, - setMapPositionMode - } = useApp(); + const { theme, setTheme, mapPositionMode, setMapPositionMode } = useApp(); const THEMES = [ - { value: "light" as Theme, label: t("about.theme_light", "Claro"), icon: Sun }, - { value: "dark" as Theme, label: t("about.theme_dark", "Oscuro"), icon: Moon }, - { value: "system" as Theme, label: t("about.theme_system", "Sistema"), icon: Computer }, + { + value: "light" as Theme, + label: t("about.theme_light", "Claro"), + icon: Sun, + }, + { + value: "dark" as Theme, + label: t("about.theme_dark", "Oscuro"), + icon: Moon, + }, + { + value: "system" as Theme, + label: t("about.theme_system", "Sistema"), + icon: Computer, + }, ]; return ( @@ -37,9 +44,10 @@ export default function Settings() { rounded-lg border-2 transition-all duration-200 hover:bg-gray-50 dark:hover:bg-gray-800 focus:outline-none focus:ring focus:ring-blue-500 dark:focus:ring-offset-gray-900 - ${value === theme - ? "border-blue-600 bg-blue-50 dark:bg-blue-900/20 text-blue-700 dark:text-blue-400 font-semibold" - : "border-gray-300 dark:border-gray-700 text-gray-700 dark:text-gray-300" + ${ + value === theme + ? "border-blue-600 bg-blue-50 dark:bg-blue-900/20 text-blue-700 dark:text-blue-400 font-semibold" + : "border-gray-300 dark:border-gray-700 text-gray-700 dark:text-gray-300" } `} > diff --git a/src/frontend/app/routes/stops-$id.tsx b/src/frontend/app/routes/stops-$id.tsx index 553b8e7..6d06215 100644 --- a/src/frontend/app/routes/stops-$id.tsx +++ b/src/frontend/app/routes/stops-$id.tsx @@ -198,9 +198,7 @@ export default function Estimates() { loadData(); StopDataProvider.pushRecent(stopId); - setFavourited( - StopDataProvider.isFavourite(stopId) - ); + setFavourited(StopDataProvider.isFavourite(stopId)); setDataLoading(false); }, [stopId, loadData]); @@ -246,34 +244,48 @@ export default function Estimates() {
- setIsHelpModalOpen(true)} /> + setIsHelpModalOpen(true)} + />
- {t("estimates.caption", "Estimaciones de llegadas a las {{time}}", { - time: dataDate?.toLocaleTimeString(), - })} + {t( + "estimates.caption", + "Estimaciones de llegadas a las {{time}}", + { + time: dataDate?.toLocaleTimeString(), + } + )}
{isReducedView ? ( - setIsReducedView(false)} /> + setIsReducedView(false)} + /> ) : ( - setIsReducedView(true)} /> + setIsReducedView(true)} + /> )}
{ setSelectedCirculationId(getCirculationId(estimate)); setIsMapModalOpen(true); @@ -295,8 +307,8 @@ export default function Estimates() { previousTripShapeId: c.previousTripShapeId, schedule: c.schedule ? { - shapeId: c.schedule.shapeId, - } + shapeId: c.schedule.shapeId, + } : undefined, }))} isOpen={isMapModalOpen} diff --git a/src/frontend/vite.config.ts b/src/frontend/vite.config.ts index b827847..042177d 100644 --- a/src/frontend/vite.config.ts +++ b/src/frontend/vite.config.ts @@ -11,11 +11,7 @@ export default defineConfig({ define: { __COMMIT_HASH__: JSON.stringify(commitHash), }, - plugins: [ - reactRouter(), - tsconfigPaths(), - tailwindcss() - ], + plugins: [reactRouter(), tsconfigPaths(), tailwindcss()], server: { proxy: { "^/api": { -- cgit v1.3