Implementación de un sistema de anuncios con modales para Filament y páginas públicas
Introducción
Este artículo describe la implementación de un sistema de anuncios que utiliza modales para mostrar información importante a los usuarios tanto en el panel de administración de Filament como en las páginas públicas del sitio.
Funcionalidad
El sistema de anuncios permite a los superadministradores crear, programar y publicar anuncios a través de un recurso de Filament. Solo un anuncio puede estar activo a la vez. Los usuarios verán un modal una vez por anuncio; el cierre del modal se rastrea a través de la base de datos (para usuarios autenticados) o localStorage (para páginas públicas).
Componentes Clave
El sistema incluye varios componentes interrelacionados:
- Recurso de Filament: Permite a los superadministradores crear, programar y gestionar anuncios.
- Comando de Publicación Programada: Un comando que se ejecuta periódicamente para publicar anuncios programados.
- Endpoints de API: Puntos de acceso para obtener el anuncio activo.
- Componentes Livewire + Alpine.js: Componentes para la presentación del modal en el frontend.
- Traducciones (en/es/fr/de): Soporte para múltiples idiomas.
Almacenamiento del estado del anuncio
El sistema utiliza diferentes métodos para almacenar el estado de visualización del anuncio, dependiendo de si el usuario está autenticado o no. Para usuarios autenticados, se utiliza la base de datos. Para usuarios no autenticados, se utiliza localStorage para evitar mostrar el mismo anuncio repetidamente.
localStorage.setItem('announcement_dismissed', 'true');
Este código muestra cómo se puede usar localStorage para guardar un valor indicando que el anuncio fue cerrado por el usuario. Esto evita que el anuncio se muestre de nuevo en la misma sesión del navegador.
Diagrama del flujo del sistema
A continuación, se muestra un diagrama del flujo del sistema:
Resultados
El resultado es un sistema de anuncios robusto y flexible que puede ser utilizado tanto en el panel de administración de Filament como en las páginas públicas. El sistema soporta la programación de anuncios, el seguimiento de la visualización de los mismos, y la traducción a múltiples idiomas.
Próximos Pasos
Considerar la posibilidad de agregar un sistema de priorización de anuncios, en caso de que se desee mostrar más de un anuncio a la vez. Además, se podría implementar un sistema de targeting de anuncios, para mostrar anuncios específicos a diferentes grupos de usuarios.
