Frontend

Next.js con App Router sobre la plantilla Minimal UI Kit v7 (Material UI v7 + Emotion). Que sea una plantilla comprada tiene una consecuencia práctica: hay convenciones que conviene respetar para que las actualizaciones de la plantilla no se conviertan en un infierno de conflictos.

Dónde va cada cosa

Carpeta	Qué contiene
src/app/	Solo rutas. Cada page.tsx debe ser un envoltorio fino que importa una vista de sections/
src/sections/	La interfaz de verdad, agrupada por dominio: bot/, chat/, crm/, health/, scheduling/, contact/
src/components/	Componentes reutilizables sin dominio
src/actions/	Llamadas a datos (Supabase y backend)
src/auth/	Contextos y guards de sesión
src/routes/paths.ts	Constantes de rutas. No escribas rutas a mano en los componentes
src/locales/langs/	Traducciones
src/theme/	Tema de Material UI
src/stores/	Zustand

La regla que más se incumple: una página del App Router no debe contener lógica. Si page.tsx crece, lo que crece tiene que estar en sections/.

El menú es dinámico

Esto es lo que más sorprende al llegar. El menú lateral no está escrito en ningún archivo de configuración: se pide a Supabase en cada carga con la función menus_accessible, y se filtra después por los módulos activos del tenant.

Consecuencias:

• Añadir una pantalla nueva es dos trabajos: crear el page.tsx y dar de alta su entrada de menú con su permiso. Sin lo segundo, la ruta existe pero nadie la ve.
• guardStore (Zustand) solo cachea el resultado de la comprobación. No es la fuente de verdad: la autoridad son las políticas RLS y las funciones de Supabase. No añadas lógica de autorización en el cliente.

Autenticación

Hay soporte para varias estrategias (Supabase, JWT, Firebase, Auth0, Amplify) porque viene de la plantilla, pero la que se usa es Supabase. Las demás son código muerto que conviene no tocar ni tomar como ejemplo.

Variables de entorno

Solo las que empiezan por NEXT_PUBLIC_ llegan al navegador, y se congelan al construir la imagen. Cambiarlas exige reconstruir. Ver Variables de entorno.

i18n

i18next con detección en servidor. Los textos van en src/locales/langs/<idioma>/. Al escribir interfaz nueva, mete las cadenas en el archivo de traducción desde el principio: recuperarlas después de haberlas dejado incrustadas es mucho más trabajo.

Pantallas por sección

CRM

Pantalla	Título	Componente
/dashboard/crm/catalogs	—	dashboard/crm/catalogs/page.tsx
/dashboard/crm/catalogs/:id/edit	—	dashboard/crm/catalogs/[id]/edit/page.tsx
/dashboard/crm/catalogs/new	—	dashboard/crm/catalogs/new/page.tsx
/dashboard/crm/dashboard	—	dashboard/crm/dashboard/page.tsx
/dashboard/crm/leads	—	dashboard/crm/leads/page.tsx
/dashboard/crm/products	—	dashboard/crm/products/page.tsx
/dashboard/crm/products/:id/edit	—	dashboard/crm/products/[id]/edit/page.tsx
/dashboard/crm/products/new	—	dashboard/crm/products/new/page.tsx
/dashboard/crm/tags	—	dashboard/crm/tags/page.tsx
/dashboard/crm/tags/:id/edit	—	dashboard/crm/tags/[id]/edit/page.tsx
/dashboard/crm/tags/new	—	dashboard/crm/tags/new/page.tsx

11 pantallas. Las rutas con :parametro reciben un identificador y no se pueden abrir directamente.

Salud

Pantalla	Título	Componente
/dashboard/health/documents	—	dashboard/health/documents/page.tsx
/dashboard/health/documents/:code	—	dashboard/health/documents/[code]/page.tsx
/dashboard/health/forms	—	dashboard/health/forms/page.tsx
/dashboard/health/records	—	dashboard/health/records/page.tsx
/dashboard/health/records/:contactId	—	dashboard/health/records/[contactId]/page.tsx
/dashboard/health/records/new	—	dashboard/health/records/new/page.tsx
/dashboard/health/reports	—	dashboard/health/reports/page.tsx
/dashboard/health/settings	—	dashboard/health/settings/page.tsx

8 pantallas. Las rutas con :parametro reciben un identificador y no se pueden abrir directamente.

Agenda

Pantalla	Título	Componente
/dashboard/scheduling/appointments	—	dashboard/scheduling/appointments/page.tsx
/dashboard/scheduling/calendar	—	dashboard/scheduling/calendar/page.tsx
/dashboard/scheduling/reports	—	dashboard/scheduling/reports/page.tsx
/dashboard/scheduling/resources	—	dashboard/scheduling/resources/page.tsx
/dashboard/scheduling/settings	—	dashboard/scheduling/settings/page.tsx
/dashboard/scheduling/today	—	dashboard/scheduling/today/page.tsx

6 pantallas. Las rutas con :parametro reciben un identificador y no se pueden abrir directamente.

El inventario completo está en Pantallas.