chore(frontend): reorganizar sidebar en secciones + quitar items disabled #61

dmolinari · 2026-04-21T16:38:11Z

dmolinari commented

2026-04-21 16:38:11 +00:00

Motivación

El sidebar estaba creciendo y se volvió incómodo:

4 items top-level marcados con badge "Próx." (disabled) generan ruido visual sin ofrecer funcionalidad.
12 items de administración en lista plana, difícil de escanear.

Cambios

1. Eliminación de items fantasma (disabled)

Removidos: Ventas, Tasación (top-level), Integraciones, Administración (como link top-level). Esas features emergerán dentro de las subsecciones cuando estén implementadas, no como placeholders vacíos.

2. Agrupación en 4 secciones (orden del modelo del proyecto)

🏠 Dashboard
────────────
SEGURIDAD
  👥 Usuarios
  ➕ Crear Usuario
  🛡️ Roles
  🔑 Permisos
  📋 Auditoría
────────────
MAESTROS
  📰 Medios
  📑 Secciones
  🏪 Puntos de Venta
────────────
CATÁLOGO
  🏷️ Rubros
  📚 Tipos de Producto
  📦 Productos
────────────
TASACIÓN
  #️⃣ Caracteres Tasables

3. Sección auto-oculta cuando no hay permisos

Si un usuario tiene rol admin pero no tiene ningún permiso de una categoría completa (ej: ningún catalogo:*), la sección entera se oculta — incluido su header. Evita headers vacíos.

Tests

Nuevo archivo src/components/layout/__tests__/AppSidebar.test.tsx con 10 escenarios:

Dashboard visible para cualquier usuario
Items disabled "Próx." ya NO aparecen
Las 4 secciones se muestran para admin con todos los permisos
Cada item vive en su sección correcta
Secciones sin items permitidos se ocultan (user con permisos parciales)
Usuario no-admin NO ve ninguna sección adminOnly
Ruta activa marca aria-current="page"
Dashboard activo solo en raíz exacta /
Header "SIG-CM 2.0" visible en modo expandido
Orden de secciones: Seguridad → Maestros → Catálogo → Tasación

Verify

vitest: 520/520 green (+10 nuevos)
tsc --noEmit: 0 errors, 0 warnings
Sin cambios de backend/BD — refactor frontend-only.

## Motivación El sidebar estaba creciendo y se volvió incómodo: - 4 items top-level marcados con badge "Próx." (disabled) generan ruido visual sin ofrecer funcionalidad. - 12 items de administración en lista plana, difícil de escanear. ## Cambios ### 1. Eliminación de items fantasma (disabled) Removidos: **Ventas**, **Tasación** (top-level), **Integraciones**, **Administración** (como link top-level). Esas features emergerán dentro de las subsecciones cuando estén implementadas, no como placeholders vacíos. ### 2. Agrupación en 4 secciones (orden del modelo del proyecto) ``` 🏠 Dashboard ──────────── SEGURIDAD 👥 Usuarios ➕ Crear Usuario 🛡️ Roles 🔑 Permisos 📋 Auditoría ──────────── MAESTROS 📰 Medios 📑 Secciones 🏪 Puntos de Venta ──────────── CATÁLOGO 🏷️ Rubros 📚 Tipos de Producto 📦 Productos ──────────── TASACIÓN #️⃣ Caracteres Tasables ``` ### 3. Sección auto-oculta cuando no hay permisos Si un usuario tiene rol admin pero no tiene ningún permiso de una categoría completa (ej: ningún `catalogo:*`), la sección entera se oculta — incluido su header. Evita headers vacíos. ## Tests Nuevo archivo `src/components/layout/__tests__/AppSidebar.test.tsx` con **10 escenarios**: 1. Dashboard visible para cualquier usuario 2. Items disabled "Próx." ya NO aparecen 3. Las 4 secciones se muestran para admin con todos los permisos 4. Cada item vive en su sección correcta 5. Secciones sin items permitidos se ocultan (user con permisos parciales) 6. Usuario no-admin NO ve ninguna sección adminOnly 7. Ruta activa marca `aria-current="page"` 8. Dashboard activo solo en raíz exacta `/` 9. Header "SIG-CM 2.0" visible en modo expandido 10. Orden de secciones: Seguridad → Maestros → Catálogo → Tasación ## Verify - `vitest`: **520/520 green** (+10 nuevos) - `tsc --noEmit`: 0 errors, 0 warnings - Sin cambios de backend/BD — refactor frontend-only.

dmolinari added 1 commit 2026-04-21 16:38:11 +00:00

chore(frontend): reorganize sidebar into grouped sections + remove disabled items 3a534f7ad3

Problem: sidebar was growing unwieldy — 4 top-level disabled items marked
'Próx.' acted as visual noise, and 12 admin items sat in a flat list with
no grouping (hard to scan).

Changes:
- Remove the 4 disabled top-level items (Ventas, Tasación, Integraciones,
  Administración-as-link). Those features will surface via the admin
  subsections when actually implemented, not as placeholder ghosts.
- Group the 12 admin items into 4 domain-aligned sections:
  - Seguridad: Usuarios, Crear Usuario, Roles, Permisos, Auditoría
  - Maestros:  Medios, Secciones, Puntos de Venta
  - Catálogo:  Rubros, Tipos de Producto, Productos
  - Tasación:  Caracteres Tasables
- Sections auto-hide when no item passes the permission filter, preventing
  empty headers for users with limited roles.
- Dashboard remains as the single top-level nav item (always visible).

TDD: new AppSidebar.test.tsx covers 10 scenarios — section rendering,
permission filtering, section auto-hide, role gating, active-route marking,
and section ordering.

dmolinari merged commit 2aae873a4b into main

2026-04-21 16:38:17 +00:00

dmolinari deleted branch chore/sidebar-categorization

2026-04-21 16:38:17 +00:00

dmolinari referenced this issue from a commit

2026-04-21 16:38:19 +00:00

Merge pull request 'chore(frontend): reorganizar sidebar en secciones + quitar items disabled' (#61) from chore/sidebar-categorization into main

dmolinari referenced this issue from a commit

2026-04-21 17:07:19 +00:00

feat(frontend): sidebar secciones colapsables + fly-out en modo colapsado

dmolinari referenced this pull request

2026-04-21 17:07:43 +00:00