Voy a investigar el problema del dashboard admin. Primero necesito revisar los archivos relevantes:
Hay dos archivos de dashboard admin. Voy a revisar ambos, el middleware, y la navegacion para entender cómo llega el usuario:
Ahora voy a revisar el componente KPI que importa el dashboard admin y los layouts:
Voy a revisar el ProtectedLayout que importa el admin layout, ya que probablemente ahi esta el problema:
Ya encontre el problema. El ProtectedLayout busca user_session en localStorage, pero el DashboardAccess guarda mock_session. Ademas, el ProtectedLayout verifica expires_at que nunca se establece en la sesion mock. Voy a corregir ambos archivos para que sean compatibles:
Ahora tambien necesito verificar si el AdminRightSidebar existe, ya que es importado por el header:
Existe. El problema principal era que el ProtectedLayout solo buscaba user_session en localStorage con un campo expires_at, pero el sistema de acceso demo del home guarda mock_session con un campo authenticated. Ahora verifica ambas fuentes de sesion. Verifiquemos que no haya otro problema con la ruta duplicada (admin):
El grupo (admin) no tiene layout propio, lo que significa que su dashboard queda huerfano. El que se usa realmente es app/admin/dashboard/page.tsx con app/admin/layout.tsx. Voy a eliminar el duplicado para evitar conflictos:
He corregido el problema del dashboard admin con tres cambios clave:
ProtectedLayout: Ahora verifica tanto user_session (autenticacion real) como mock_session (acceso demo) en localStorage, y tambien comprueba la cookie auth_token como fallback. Antes solo buscaba user_session con expires_at, que el sistema demo nunca establecia.app/(admin)/dashboard/page.tsx que era un dashboard alternativo sin layout propio, dejando solo app/admin/dashboard/page.tsx que funciona correctamente con el AdminLayout.ProtectedLayout reconoce la sesion mock como valida.The code returns the following error:
Encountered a script tag while rendering React component. Scripts inside React components are never executed when rendering on the client. Consider using template tag instead (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/template).
Revise the code to address the error.
I was previewing: /
El error viene de la pagina principal. Voy a revisar el archivo app/page.tsx y buscar donde podria estar el script tag:
Encontre el problema. El componente ChartStyle usa una etiqueta <style> con dangerouslySetInnerHTML, pero esto se esta renderizando en el cliente. Necesito cambiar esto para usar useInsertionEffect o un enfoque diferente. Voy a corregirlo:
He corregido el error cambiando el componente ChartStyle para que en lugar de renderizar una etiqueta <style> directamente en JSX (lo que causa el error de script tag en el cliente), ahora utiliza useEffect para crear e insertar dinámicamente el elemento <style> en el <head> del documento. Esto es el enfoque correcto para inyectar CSS dinámico en componentes cliente de React, y también incluye una función de limpieza que remueve el estilo cuando el componente se desmonta.