Feat Botón Map URL Parámetro Widget Carousel

Elecciones-Web/frontend/src/features/legislativas/nacionales/HomeCarouselNacionalWidget.tsx

@@ -6,6 +6,7 @@ import { ImageWithFallback } from '../../../components/common/ImageWithFallback'
 import { assetBaseUrl } from '../../../apiService';
 import { Swiper, SwiperSlide } from 'swiper/react';
 import { Navigation, A11y } from 'swiper/modules';
+import { FiMap } from 'react-icons/fi';
 
 // @ts-ignore
 import 'swiper/css';
@@ -17,6 +18,7 @@ interface Props {
   eleccionId: number;
   categoriaId: number;
   titulo: string;
+  mapLinkUrl: string;
 }
 
 const formatPercent = (num: number | null | undefined) => `${(num || 0).toFixed(2).replace('.', ',')}%`;
@@ -39,7 +41,7 @@ const formatDateTime = (dateString: string | undefined | null) => {
   }
 };
 
-export const HomeCarouselNacionalWidget = ({ eleccionId, categoriaId, titulo }: Props) => {
+export const HomeCarouselNacionalWidget = ({ eleccionId, categoriaId, titulo, mapLinkUrl }: Props) => {
   const uniqueId = `swiper-${Math.random().toString(36).substring(2, 9)}`;
   const prevButtonClass = `prev-${uniqueId}`;
   const nextButtonClass = `next-${uniqueId}`;
@@ -55,7 +57,13 @@ export const HomeCarouselNacionalWidget = ({ eleccionId, categoriaId, titulo }:
 
   return (
     <div className={styles.homeCarouselWidget}>
-      <h2 className={styles.widgetTitle}>{titulo}</h2>
+      <div className={styles.widgetHeader}>
+        <h2 className={styles.widgetTitle}>{titulo}</h2>
+        <a href={mapLinkUrl} className={styles.mapLinkButton}>
+          <FiMap />
+          <span className={styles.buttonText}>Ver Mapa</span>
+        </a>
+      </div>
 
       <div className={styles.carouselContainer}>
         <Swiper