feat(shell): mover Zona de marca dentro de la seccion Biblioteca de activos con acordeon
This commit is contained in:
@@ -75,13 +75,6 @@ const NAV_ITEMS: NavItem[] = [
|
|||||||
iconClass: 'text-pink-500',
|
iconClass: 'text-pink-500',
|
||||||
moduleId: 'pipeline',
|
moduleId: 'pipeline',
|
||||||
},
|
},
|
||||||
{
|
|
||||||
href: '/dashboard/marca',
|
|
||||||
label: 'Zona de marca',
|
|
||||||
icon: BookMarked,
|
|
||||||
iconClass: 'text-rose-500',
|
|
||||||
moduleId: 'marca',
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
href: '/dashboard/activos',
|
href: '/dashboard/activos',
|
||||||
label: 'Biblioteca de Activos',
|
label: 'Biblioteca de Activos',
|
||||||
@@ -259,16 +252,25 @@ export default function DashboardShell({
|
|||||||
pathname === '/dashboard/organico' ||
|
pathname === '/dashboard/organico' ||
|
||||||
(pathname !== null && pathname.startsWith('/dashboard/organico/'));
|
(pathname !== null && pathname.startsWith('/dashboard/organico/'));
|
||||||
|
|
||||||
|
const isActivosRoute =
|
||||||
|
pathname === '/dashboard/activos' ||
|
||||||
|
(pathname !== null && pathname.startsWith('/dashboard/activos/')) ||
|
||||||
|
pathname === '/dashboard/marca' ||
|
||||||
|
(pathname !== null && pathname.startsWith('/dashboard/marca/'));
|
||||||
|
|
||||||
const [expandedSections, setExpandedSections] = useState<Record<string, boolean>>({});
|
const [expandedSections, setExpandedSections] = useState<Record<string, boolean>>({});
|
||||||
|
|
||||||
const isMetricasOpen = expandedSections['metricas'] ?? isMetricasRoute;
|
const isMetricasOpen = expandedSections['metricas'] ?? isMetricasRoute;
|
||||||
|
const isActivosOpen = expandedSections['activos'] ?? isActivosRoute;
|
||||||
const isAgenciaOpen = expandedSections['agencia'] ?? isAgenciaRoute;
|
const isAgenciaOpen = expandedSections['agencia'] ?? isAgenciaRoute;
|
||||||
|
|
||||||
const toggleSection = (key: 'metricas' | 'agencia') => {
|
const toggleSection = (key: 'metricas' | 'activos' | 'agencia') => {
|
||||||
setExpandedSections((prev) => {
|
setExpandedSections((prev) => {
|
||||||
const current =
|
const current =
|
||||||
key === 'metricas'
|
key === 'metricas'
|
||||||
? (prev['metricas'] ?? isMetricasRoute)
|
? (prev['metricas'] ?? isMetricasRoute)
|
||||||
|
: key === 'activos'
|
||||||
|
? (prev['activos'] ?? isActivosRoute)
|
||||||
: (prev['agencia'] ?? isAgenciaRoute);
|
: (prev['agencia'] ?? isAgenciaRoute);
|
||||||
return {
|
return {
|
||||||
...prev,
|
...prev,
|
||||||
@@ -293,6 +295,9 @@ export default function DashboardShell({
|
|||||||
moduleOn('organico')
|
moduleOn('organico')
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
if (item.moduleId === 'activos') {
|
||||||
|
return moduleOn('activos') || moduleOn('marca');
|
||||||
|
}
|
||||||
return moduleOn(item.moduleId);
|
return moduleOn(item.moduleId);
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -329,13 +334,22 @@ export default function DashboardShell({
|
|||||||
<nav className="flex-1 min-h-0 space-y-0.5 overflow-y-auto pr-1">
|
<nav className="flex-1 min-h-0 space-y-0.5 overflow-y-auto pr-1">
|
||||||
{visibleNav.map((item) => {
|
{visibleNav.map((item) => {
|
||||||
const underMetricas = item.moduleId === 'kpis';
|
const underMetricas = item.moduleId === 'kpis';
|
||||||
|
const underActivos = item.moduleId === 'activos';
|
||||||
|
const hasSubItems = underMetricas || underActivos;
|
||||||
|
const isOpen = underMetricas ? isMetricasOpen : underActivos ? isActivosOpen : false;
|
||||||
|
const onToggle = underMetricas
|
||||||
|
? () => toggleSection('metricas')
|
||||||
|
: underActivos
|
||||||
|
? () => toggleSection('activos')
|
||||||
|
: undefined;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div key={item.href} className="space-y-0.5">
|
<div key={item.href} className="space-y-0.5">
|
||||||
<NavLink
|
<NavLink
|
||||||
item={item}
|
item={item}
|
||||||
hasSubItems={underMetricas}
|
hasSubItems={hasSubItems}
|
||||||
isOpen={isMetricasOpen}
|
isOpen={isOpen}
|
||||||
onToggle={() => toggleSection('metricas')}
|
onToggle={onToggle}
|
||||||
onNavigate={close}
|
onNavigate={close}
|
||||||
/>
|
/>
|
||||||
{underMetricas && isMetricasOpen ? (
|
{underMetricas && isMetricasOpen ? (
|
||||||
@@ -409,6 +423,27 @@ export default function DashboardShell({
|
|||||||
) : null}
|
) : null}
|
||||||
</div>
|
</div>
|
||||||
) : null}
|
) : null}
|
||||||
|
|
||||||
|
{underActivos && isActivosOpen ? (
|
||||||
|
<div className="space-y-0.5 my-0.5">
|
||||||
|
{moduleOn('marca') ? (
|
||||||
|
<Link
|
||||||
|
href="/dashboard/marca"
|
||||||
|
onClick={close}
|
||||||
|
className={subLinkCls('/dashboard/marca')}
|
||||||
|
>
|
||||||
|
<BookMarked
|
||||||
|
className={`h-3.5 w-3.5 shrink-0 ${
|
||||||
|
isActive(pathname, '/dashboard/marca')
|
||||||
|
? 'text-rose-400'
|
||||||
|
: 'text-mist-400 group-hover:text-mist-300'
|
||||||
|
}`}
|
||||||
|
/>
|
||||||
|
<span className="truncate">Zona de marca</span>
|
||||||
|
</Link>
|
||||||
|
) : null}
|
||||||
|
</div>
|
||||||
|
) : null}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
|
|||||||
Reference in New Issue
Block a user