dmolinari/Elecciones-2025
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases Wiki Activity

Fix Conversión Categoria en Carousel

Browse Source 
- Se realiza conversión del id de la categoria para que funcione la condición del selector de provincias.
This commit is contained in:
dmolinari
2025-10-24 12:14:12 -03:00
parent ad883257a3
commit 70069d46f7
1 changed files with 7 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
Elecciones-Web/frontend/src/features/legislativas/nacionales/HomeCarouselProvincialWidget.tsx
View File

@@ -18,7 +18,7 @@ import styles from './HomeCarouselWidget.module.css';
interface Props { interface Props {
eleccionId: number; eleccionId: number;
categoriaId: number; categoriaId: number | string;
titulo: string; titulo: string;
} }
@@ -27,11 +27,8 @@ interface OptionType {
label: string; label: string;
} }
// --- LÓGICA DE FILTRADO ---
// 1. Definimos los IDs de distrito de las provincias que renuevan senadores.
const PROVINCIAS_QUE_RENUEVAN_SENADORES = new Set(['01', '06', '08', '15', '16', '17', '22', '24']); const PROVINCIAS_QUE_RENUEVAN_SENADORES = new Set(['01', '06', '08', '15', '16', '17', '22', '24']);
const CATEGORIA_SENADORES = 2; const CATEGORIA_SENADORES = 2;
// --- FIN LÓGICA DE FILTRADO ---
const formatPercent = (num: number | null | undefined) => `${(num || 0).toFixed(2).replace('.', ',')}%`; const formatPercent = (num: number | null | undefined) => `${(num || 0).toFixed(2).replace('.', ',')}%`;
const formatNumber = (num: number) => num.toLocaleString('es-AR'); const formatNumber = (num: number) => num.toLocaleString('es-AR');
@@ -51,7 +48,6 @@ const formatDateTime = (dateString: string | undefined | null) => {
}; };
export const HomeCarouselProvincialWidget = ({ eleccionId, categoriaId, titulo }: Props) => { export const HomeCarouselProvincialWidget = ({ eleccionId, categoriaId, titulo }: Props) => {
// 2. Estado inicial nulo para que el useEffect lo establezca dinámicamente.
const [selectedProvince, setSelectedProvince] = useState<OptionType | null>(null); const [selectedProvince, setSelectedProvince] = useState<OptionType | null>(null);
const { data: provincias = [], isLoading: isLoadingProvincias } = useQuery<CatalogoItem[]>({ const { data: provincias = [], isLoading: isLoadingProvincias } = useQuery<CatalogoItem[]>({
@@ -59,24 +55,21 @@ export const HomeCarouselProvincialWidget = ({ eleccionId, categoriaId, titulo }
queryFn: getProvincias, queryFn: getProvincias,
}); });
// 3. Usamos useMemo para filtrar las opciones solo cuando sea necesario.
const provinceOptions: OptionType[] = useMemo(() => { const provinceOptions: OptionType[] = useMemo(() => {
const allOptions = provincias.map(p => ({ value: p.id, label: p.nombre })); const allOptions = provincias.map(p => ({ value: p.id, label: p.nombre }));
if (categoriaId === CATEGORIA_SENADORES) {
if (Number(categoriaId) === CATEGORIA_SENADORES) {
return allOptions.filter(opt => PROVINCIAS_QUE_RENUEVAN_SENADORES.has(opt.value)); return allOptions.filter(opt => PROVINCIAS_QUE_RENUEVAN_SENADORES.has(opt.value));
} }
return allOptions; return allOptions;
}, [provincias, categoriaId]); }, [provincias, categoriaId]);
// 4. useEffect para establecer y validar la provincia por defecto.
useEffect(() => { useEffect(() => {
if (provinceOptions.length > 0) { if (provinceOptions.length > 0) {
// Si no hay nada seleccionado, establece el default.
if (!selectedProvince) { if (!selectedProvince) {
const defaultOption = provinceOptions.find(opt => opt.value === '01'); // CABA const defaultOption = provinceOptions.find(opt => opt.value === '01');
setSelectedProvince(defaultOption || provinceOptions[0]); // Si CABA no está, usa la primera opción. setSelectedProvince(defaultOption || provinceOptions[0]);
} else { } else {
// Si ya hay algo seleccionado, verifica que siga siendo válido. Si no, lo resetea.
const isSelectedStillValid = provinceOptions.some(opt => opt.value === selectedProvince.value); const isSelectedStillValid = provinceOptions.some(opt => opt.value === selectedProvince.value);
if (!isSelectedStillValid) { if (!isSelectedStillValid) {
setSelectedProvince(provinceOptions[0]); setSelectedProvince(provinceOptions[0]);
@@ -87,8 +80,8 @@ export const HomeCarouselProvincialWidget = ({ eleccionId, categoriaId, titulo }
const { data, isLoading, error } = useQuery({ const { data, isLoading, error } = useQuery({
queryKey: ['homeResumen', eleccionId, selectedProvince?.value, categoriaId], queryKey: ['homeResumen', eleccionId, selectedProvince?.value, categoriaId],
queryFn: () => getHomeResumen(eleccionId, selectedProvince!.value, categoriaId), queryFn: () => getHomeResumen(eleccionId, selectedProvince!.value, Number(categoriaId)),
enabled: !!selectedProvince, // La consulta solo se ejecuta si hay una provincia seleccionada enabled: !!selectedProvince,
refetchInterval: 30000, refetchInterval: 30000,
}); });