moved ConfigProvider up in the hierarchy (to main.jsx) to wrap the whole App

frontend/src/components/App.jsx

@@ -3,16 +3,13 @@ import 'leaflet/dist/leaflet.css'
 import 'bootstrap/dist/css/bootstrap.min.css'
 import 'bootstrap/dist/js/bootstrap.bundle.min.js'
 
-import { ThemeProvider } from '../contexts/ThemeContext.jsx'
-
 import Home from '../pages/Home.jsx'
 
 const App = () => {
   return (
     <>
-      <ThemeProvider>
-          <Home />
-      </ThemeProvider>
+      {/* Planeo añadir un React Router */}
+      <Home />
     </>
   );
 }

frontend/src/components/HistoryCharts.jsx

@@ -6,16 +6,28 @@ import PropTypes from "prop-types";
 
 import { useTheme } from "../contexts/ThemeContext.jsx";
 import { DataProvider, useData } from "../contexts/DataContext.jsx";
-import { ConfigProvider, useConfig } from "../contexts/ConfigContext.jsx";
+import { useConfig } from "../contexts/ConfigContext.jsx";
 
 ChartJS.register(LineElement, PointElement, LinearScale, CategoryScale, Filler);
 
 const HistoryCharts = () => {
+  const { config, configLoading, configError } = useConfig();
+  
+  if (configLoading) return <p>Cargando configuración...</p>;
+  if (configError) return <p>Error al cargar configuración: {configError}</p>;
+  if (!config) return <p>Configuración no disponible.</p>;
+
+  const BASE = config.appConfig.endpoints.baseUrl;
+  const ENDPOINT = config.appConfig.endpoints.sensors;
+
+  const reqConfig = {
+      baseUrl: `${BASE}/${ENDPOINT}`,
+      params: {}
+  }
+
   return (
-    <DataProvider apiUrl="https://contaminus.miarma.net/api/v1/sensors">
-      <ConfigProvider>
-        <HistoryChartsContent />
-      </ConfigProvider>
+    <DataProvider config={reqConfig}>
+      <HistoryChartsContent />
     </DataProvider>
   );
 };

frontend/src/components/PollutionMap.jsx

@@ -1,7 +1,5 @@
 import { MapContainer, TileLayer, Circle, Popup } from 'react-leaflet';
 
-
-import { ConfigProvider } from '../contexts/ConfigContext.jsx';
 import { useConfig } from '../contexts/ConfigContext.jsx';
 
 import { DataProvider } from '../contexts/DataContext.jsx';
@@ -41,23 +39,41 @@ const PollutionCircles = ({ data }) => {
 };
 
 const PollutionMap = () => {
+  const { config, configLoading, configError } = useConfig();
+  
+  if (configLoading) return <p>Cargando configuración...</p>;
+  if (configError) return <p>Error al cargar configuración: {configError}</p>;
+  if (!config) return <p>Configuración no disponible.</p>;
+
+  const BASE = config.appConfig.endpoints.baseUrl;
+  const ENDPOINT = config.appConfig.endpoints.sensors;
+
+  const reqConfig = {
+      baseUrl: `${BASE}/${ENDPOINT}`,
+      params: {}
+  }
+
   return (
-    <DataProvider apiUrl="https://contaminus.miarma.net/api/v1/sensors">
-      <ConfigProvider>
-        <PollutionMapContent />
-      </ConfigProvider>
+    <DataProvider config={reqConfig}>
+      <PollutionMapContent />
     </DataProvider>
   );
 };
 
 const PollutionMapContent = () => {
-  const { config } = useConfig();
+  const { config, configLoading, configError } = useConfig();
+  const { data, dataLoading, dataError } = useData();
+
+  if (configLoading) return <p>Cargando configuración...</p>;
+  if (configError) return <p>Error al cargar configuración: {configError}</p>;
+  if (!config) return <p>Configuración no disponible.</p>;
+
+  if (dataLoading) return <p>Cargando datos...</p>;
+  if (dataError) return <p>Error al cargar datos: {configError}</p>;
+  if (!data) return <p>Datos no disponibles.</p>;
+
   const SEVILLA = config?.userConfig.city;
 
-  const { data, loading } = useData();
-
-  if (loading) return <p>Cargando datos...</p>;
-
   const pollutionData = data.map((sensor) => ({
     lat: sensor.lat,
     lng: sensor.lon,

frontend/src/components/SummaryCards.jsx

@@ -4,9 +4,28 @@ import CardContainer from './CardContainer';
 import { DataProvider } from '../contexts/DataContext';
 import { useData } from '../contexts/DataContext';
 
+import { useConfig } from '../contexts/ConfigContext';
+
 const SummaryCards = () => {
+    const { config, configLoading, configError } = useConfig();
+
+    if (configLoading) return <p>Cargando configuración...</p>;
+    if (configError) return <p>Error al cargar configuración: {configError}</p>;
+    if (!config) return <p>Configuración no disponible.</p>;
+
+    const BASE = config.appConfig.endpoints.baseUrl;
+    const ENDPOINT = config.appConfig.endpoints.sensors;
+
+    const reqConfig = {
+        baseUrl: `${BASE}/${ENDPOINT}`,
+        params: {
+            _sort: 'timestamp',
+            _order: 'desc'
+        }
+    }
+
     return (
-        <DataProvider apiUrl="https://contaminus.miarma.net/api/v1/sensors?_sort=timestamp&_order=desc">
+        <DataProvider config={reqConfig}>
             <SummaryCardsContent />
         </DataProvider>
     );