From a68ba30716062b265f85c4be078a736c7135d7bc Mon Sep 17 00:00:00 2001
From: Ariel Costas Guerrero <ariel@costas.dev>
Date: Sun, 30 Nov 2025 20:49:48 +0100
Subject: Refactor StopMap and Settings components; replace region config usage
 with REGION_DATA, update StopDataProvider calls, and improve UI elements.
 Remove unused timetable files and add Tailwind CSS support.

---
 .../app/components/SchedulesTableSkeleton.tsx      | 136 ---------------------
 1 file changed, 136 deletions(-)
 delete mode 100644 src/frontend/app/components/SchedulesTableSkeleton.tsx

(limited to 'src/frontend/app/components/SchedulesTableSkeleton.tsx')

diff --git a/src/frontend/app/components/SchedulesTableSkeleton.tsx b/src/frontend/app/components/SchedulesTableSkeleton.tsx
deleted file mode 100644
index 3ae9729..0000000
--- a/src/frontend/app/components/SchedulesTableSkeleton.tsx
+++ /dev/null
@@ -1,136 +0,0 @@
-import React from "react";
-import Skeleton, { SkeletonTheme } from "react-loading-skeleton";
-import "react-loading-skeleton/dist/skeleton.css";
-import { useTranslation } from "react-i18next";
-
-interface EstimatesTableSkeletonProps {
-  rows?: number;
-}
-
-export const SchedulesTableSkeleton: React.FC<EstimatesTableSkeletonProps> = ({
-  rows = 3,
-}) => {
-  const { t } = useTranslation();
-
-  return (
-    <SkeletonTheme baseColor="#f0f0f0" highlightColor="#e0e0e0">
-      <table className="table">
-        <caption>
-          <Skeleton width="250px" />
-        </caption>
-
-        <thead>
-          <tr>
-            <th>{t("estimates.line", "Línea")}</th>
-            <th>{t("estimates.route", "Ruta")}</th>
-            <th>{t("estimates.arrival", "Llegada")}</th>
-            <th>{t("estimates.distance", "Distancia")}</th>
-          </tr>
-        </thead>
-
-        <tbody>
-          {Array.from({ length: rows }, (_, index) => (
-            <tr key={`skeleton-${index}`}>
-              <td>
-                <Skeleton
-                  width="40px"
-                  height="24px"
-                  style={{ borderRadius: "4px" }}
-                />
-              </td>
-              <td>
-                <Skeleton width="120px" />
-              </td>
-              <td>
-                <div
-                  style={{
-                    display: "flex",
-                    flexDirection: "column",
-                    gap: "2px",
-                  }}
-                >
-                  <Skeleton width="60px" />
-                  <Skeleton width="40px" />
-                </div>
-              </td>
-              <td>
-                <Skeleton width="50px" />
-              </td>
-            </tr>
-          ))}
-        </tbody>
-      </table>
-    </SkeletonTheme>
-  );
-};
-
-interface EstimatesGroupedSkeletonProps {
-  groups?: number;
-  rowsPerGroup?: number;
-}
-
-export const EstimatesGroupedSkeleton: React.FC<
-  EstimatesGroupedSkeletonProps
-> = ({ groups = 3, rowsPerGroup = 2 }) => {
-  const { t } = useTranslation();
-
-  return (
-    <SkeletonTheme baseColor="#f0f0f0" highlightColor="#e0e0e0">
-      <table className="table grouped-table">
-        <caption>
-          <Skeleton width="250px" />
-        </caption>
-
-        <thead>
-          <tr>
-            <th>{t("estimates.line", "Línea")}</th>
-            <th>{t("estimates.route", "Ruta")}</th>
-            <th>{t("estimates.arrival", "Llegada")}</th>
-            <th>{t("estimates.distance", "Distancia")}</th>
-          </tr>
-        </thead>
-
-        <tbody>
-          {Array.from({ length: groups }, (_, groupIndex) => (
-            <React.Fragment key={`group-${groupIndex}`}>
-              {Array.from({ length: rowsPerGroup }, (_, rowIndex) => (
-                <tr
-                  key={`skeleton-${groupIndex}-${rowIndex}`}
-                  className={rowIndex === 0 ? "group-start" : ""}
-                >
-                  <td>
-                    {rowIndex === 0 && (
-                      <Skeleton
-                        width="40px"
-                        height="24px"
-                        style={{ borderRadius: "4px" }}
-                      />
-                    )}
-                  </td>
-                  <td>
-                    <Skeleton width="120px" />
-                  </td>
-                  <td>
-                    <div
-                      style={{
-                        display: "flex",
-                        flexDirection: "column",
-                        gap: "2px",
-                      }}
-                    >
-                      <Skeleton width="60px" />
-                      <Skeleton width="40px" />
-                    </div>
-                  </td>
-                  <td>
-                    <Skeleton width="50px" />
-                  </td>
-                </tr>
-              ))}
-            </React.Fragment>
-          ))}
-        </tbody>
-      </table>
-    </SkeletonTheme>
-  );
-};
-- 
cgit v1.3