95 lines
4.3 KiB
TypeScript
95 lines
4.3 KiB
TypeScript
// src/main.tsx
|
|
import React from 'react';
|
|
import ReactDOM from 'react-dom/client';
|
|
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
|
|
|
|
import { BancasWidget } from './components/BancasWidget'
|
|
import { CongresoWidget } from './components/CongresoWidget'
|
|
import MapaBsAs from './components/MapaBsAs'
|
|
import { DipSenTickerWidget } from './components/DipSenTickerWidget'
|
|
import { TelegramaWidget } from './components/TelegramaWidget'
|
|
import { ConcejalesWidget } from './components/ConcejalesWidget'
|
|
import MapaBsAsSecciones from './components/MapaBsAsSecciones'
|
|
import { SenadoresWidget } from './components/SenadoresWidget'
|
|
import { DiputadosWidget } from './components/DiputadosWidget'
|
|
import { ResumenGeneralWidget } from './components/ResumenGeneralWidget'
|
|
import { SenadoresTickerWidget } from './components/SenadoresTickerWidget'
|
|
import { DiputadosTickerWidget } from './components/DiputadosTickerWidget'
|
|
import { ConcejalesTickerWidget } from './components/ConcejalesTickerWidget'
|
|
import { DiputadosPorSeccionWidget } from './components/DiputadosPorSeccionWidget'
|
|
import { SenadoresPorSeccionWidget } from './components/SenadoresPorSeccionWidget'
|
|
import { ConcejalesPorSeccionWidget } from './components/ConcejalesPorSeccionWidget'
|
|
import { ResultadosTablaDetalladaWidget } from './components/ResultadosTablaDetalladaWidget';
|
|
import { ResultadosRankingMunicipioWidget } from './components/ResultadosRankingMunicipioWidget';
|
|
import { DevApp } from './components/DevApp';
|
|
import './index.css';
|
|
|
|
|
|
const queryClient = new QueryClient();
|
|
|
|
// Mapeamos el nombre del widget (del atributo data) al componente de React
|
|
const WIDGET_MAP: Record<string, React.ElementType> = {
|
|
'resumen-senadores': SenadoresWidget,
|
|
'resumen-diputados': DiputadosWidget,
|
|
'resumen-concejales': ConcejalesWidget,
|
|
'congreso-provincial': CongresoWidget,
|
|
'distribucion-bancas': BancasWidget,
|
|
'mapa-municipios': MapaBsAs,
|
|
'mapa-secciones': MapaBsAsSecciones,
|
|
'consulta-telegramas': TelegramaWidget,
|
|
'ticker-senadores': SenadoresTickerWidget,
|
|
'ticker-diputados': DiputadosTickerWidget,
|
|
'ticker-concejales': ConcejalesTickerWidget,
|
|
'ticker-dip-sen': DipSenTickerWidget,
|
|
'resumen-general': ResumenGeneralWidget,
|
|
'diputados-por-seccion': DiputadosPorSeccionWidget,
|
|
'senadores-por-seccion': SenadoresPorSeccionWidget,
|
|
'concejales-por-seccion': ConcejalesPorSeccionWidget,
|
|
'resultados-tabla-detallada-por-seccion' : ResultadosTablaDetalladaWidget,
|
|
'resultados-tabla-detallada-por-municipio' : ResultadosRankingMunicipioWidget,
|
|
};
|
|
|
|
// Vite establece `import.meta.env.DEV` a `true` cuando ejecutamos 'npm run dev'
|
|
if (import.meta.env.DEV) {
|
|
// --- MODO DESARROLLO ---
|
|
// Renderizamos nuestra página de showcase en el div#root
|
|
ReactDOM.createRoot(document.getElementById('root')!).render(
|
|
<React.StrictMode>
|
|
<QueryClientProvider client={queryClient}>
|
|
<DevApp />
|
|
</QueryClientProvider>
|
|
</React.StrictMode>
|
|
);
|
|
} else {
|
|
// --- MODO PRODUCCIÓN ---
|
|
// Exponemos la función de renderizado para el bootstrap.js
|
|
const renderWidgets = () => {
|
|
const widgetContainers = document.querySelectorAll('[data-elecciones-widget]');
|
|
|
|
if (widgetContainers.length === 0) {
|
|
console.warn('React: ADVERTENCIA - No se encontró ningún elemento en el DOM para renderizar un widget. Verifica que el HTML contenga <div data-elecciones-widget="...">.');
|
|
}
|
|
|
|
widgetContainers.forEach(container => {
|
|
const widgetName = (container as HTMLElement).dataset.eleccionesWidget;
|
|
|
|
if (widgetName && WIDGET_MAP[widgetName]) {
|
|
const WidgetComponent = WIDGET_MAP[widgetName];
|
|
const root = ReactDOM.createRoot(container);
|
|
root.render(
|
|
<React.StrictMode>
|
|
<QueryClientProvider client={queryClient}>
|
|
<WidgetComponent />
|
|
</QueryClientProvider>
|
|
</React.StrictMode>
|
|
);
|
|
} else {
|
|
console.error(`React: ERROR - No se encontró un componente para el nombre de widget: "${widgetName}"`);
|
|
}
|
|
});
|
|
};
|
|
|
|
(window as any).EleccionesWidgets = {
|
|
render: renderWidgets
|
|
};
|
|
} |