30 lines
1.1 KiB
TypeScript
30 lines
1.1 KiB
TypeScript
|
// src/features/legislativas/nacionales/ResultadosNacionalesCardsWidget.tsx
|
||
|
|
import { useQuery } from '@tanstack/react-query';
|
||
|
|
import { getResumenPorProvincia } from '../../../apiService';
|
||
|
|
import { ProvinciaCard } from './components/ProvinciaCard';
|
||
|
|
import './ResultadosNacionalesCardsWidget.css';
|
||
|
|
|
||
|
|
interface Props {
|
||
|
|
eleccionId: number;
|
||
|
|
}
|
||
|
|
|
||
|
|
export const ResultadosNacionalesCardsWidget = ({ eleccionId }: Props) => {
|
||
|
|
const { data, isLoading, error } = useQuery({
|
||
|
|
queryKey: ['resumenPorProvincia', eleccionId],
|
||
|
|
queryFn: () => getResumenPorProvincia(eleccionId),
|
||
|
|
});
|
||
|
|
|
||
|
|
if (isLoading) return <div>Cargando resultados por provincia...</div>;
|
||
|
|
if (error) return <div>Error al cargar los datos.</div>;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<section className="cards-widget-container">
|
||
|
|
<h2>Resultados elecciones nacionales 2025</h2>
|
||
|
|
<div className="cards-grid">
|
||
|
|
{data?.map(provinciaData => (
|
||
|
|
<ProvinciaCard key={provinciaData.provinciaId} data={provinciaData} />
|
||
|
|
))}
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
);
|
||
|
|
};
|