aboutsummaryrefslogtreecommitdiff
path: root/src/frontend/app/components/StopSheet.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/frontend/app/components/StopSheet.tsx')
-rw-r--r--src/frontend/app/components/StopSheet.tsx91
1 files changed, 46 insertions, 45 deletions
diff --git a/src/frontend/app/components/StopSheet.tsx b/src/frontend/app/components/StopSheet.tsx
index 440f283..6977d87 100644
--- a/src/frontend/app/components/StopSheet.tsx
+++ b/src/frontend/app/components/StopSheet.tsx
@@ -1,17 +1,17 @@
+import { Clock, RefreshCw } from "lucide-react";
import React, { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
import { Sheet } from "react-modal-sheet";
import { Link } from "react-router";
-import { useTranslation } from "react-i18next";
-import { Clock, RefreshCw } from "lucide-react";
-import LineIcon from "./LineIcon";
-import { StopSheetSkeleton } from "./StopSheetSkeleton";
+import type { Stop } from "~/data/StopDataProvider";
+import { useApp } from "../AppContext";
+import { REGIONS, type RegionId, getRegionConfig } from "../data/RegionConfig";
+import { type Estimate } from "../routes/estimates-$id";
import { ErrorDisplay } from "./ErrorDisplay";
+import LineIcon from "./LineIcon";
import { StopAlert } from "./StopAlert";
-import { type Estimate } from "../routes/estimates-$id";
-import { REGIONS, type RegionId, getRegionConfig } from "../data/RegionConfig";
-import { useApp } from "../AppContext";
import "./StopSheet.css";
-import type { Stop } from "~/data/StopDataProvider";
+import { StopSheetSkeleton } from "./StopSheetSkeleton";
interface StopSheetProps {
isOpen: boolean;
@@ -50,7 +50,6 @@ export const StopSheet: React.FC<StopSheetProps> = ({
}) => {
const { t } = useTranslation();
const { region } = useApp();
- const regionConfig = getRegionConfig(region);
const [data, setData] = useState<Estimate[] | null>(null);
const [loading, setLoading] = useState(false);
const [error, setError] = useState<ErrorInfo | null>(null);
@@ -206,46 +205,48 @@ export const StopSheet: React.FC<StopSheetProps> = ({
)}
</div>
- <div className="stop-sheet-footer">
- {lastUpdated && (
- <div className="stop-sheet-timestamp">
- {t("estimates.last_updated", "Actualizado a las")}{" "}
- {lastUpdated.toLocaleTimeString(undefined, {
- hour: "2-digit",
- minute: "2-digit",
- second: "2-digit",
- })}
- </div>
- )}
-
- <div className="stop-sheet-actions">
- <button
- className="stop-sheet-reload"
- onClick={loadData}
- disabled={loading}
- title={t("estimates.reload", "Recargar estimaciones")}
- >
- <RefreshCw
- className={`reload-icon ${loading ? "spinning" : ""}`}
- />
- {t("estimates.reload", "Recargar")}
- </button>
- <Link
- to={`/estimates/${stop.stopId}`}
- className="stop-sheet-view-all"
- onClick={onClose}
- >
- {t(
- "map.view_all_estimates",
- "Ver todas las estimaciones",
- )}
- </Link>
- </div>
- </div>
</>
) : null}
</div>
+
+ <div className="stop-sheet-footer">
+ {lastUpdated && (
+ <div className="stop-sheet-timestamp">
+ {t("estimates.last_updated", "Actualizado a las")}{" "}
+ {lastUpdated.toLocaleTimeString(undefined, {
+ hour: "2-digit",
+ minute: "2-digit",
+ second: "2-digit",
+ })}
+ </div>
+ )}
+
+ <div className="stop-sheet-actions">
+ <button
+ className="stop-sheet-reload"
+ onClick={loadData}
+ disabled={loading}
+ title={t("estimates.reload", "Recargar estimaciones")}
+ >
+ <RefreshCw
+ className={`reload-icon ${loading ? "spinning" : ""}`}
+ />
+ {t("estimates.reload", "Recargar")}
+ </button>
+
+ <Link
+ to={`/estimates/${stop.stopId}`}
+ className="stop-sheet-view-all"
+ onClick={onClose}
+ >
+ {t(
+ "map.view_all_estimates",
+ "Ver todas las estimaciones",
+ )}
+ </Link>
+ </div>
+ </div>
</Sheet.Content>
</Sheet.Container>
<Sheet.Backdrop onTap={onClose} />