feat(shell): mover Calendario editorial y Pipeline RRSS al nivel principal bajo Metricas

src/components/DashboardShell.tsx

@@ -61,6 +61,20 @@ const NAV_ITEMS: NavItem[] = [
     iconClass: 'text-brand-500',
     moduleId: 'kpis',
   },
+  {
+    href: '/dashboard/calendario',
+    label: 'Calendario editorial',
+    icon: CalendarDays,
+    iconClass: 'text-amber-500',
+    moduleId: 'calendario',
+  },
+  {
+    href: '/dashboard/creatives',
+    label: 'Pipeline RRSS',
+    icon: Images,
+    iconClass: 'text-pink-500',
+    moduleId: 'pipeline',
+  },
   {
     href: '/dashboard/marca',
     label: 'Zona de marca',
@@ -229,11 +243,6 @@ export default function DashboardShell({
   const pathname = usePathname();
   const showDateHeader = shouldShowDateHeader(pathname);
 
-  const isSocialRoute =
-    pathname === '/dashboard/social' ||
-    pathname === '/dashboard/calendario' ||
-    pathname === '/dashboard/creatives';
-
   const isAgenciaRoute =
     pathname === '/dashboard/agencia' ||
     (pathname !== null && pathname.startsWith('/dashboard/agencia/'));
@@ -245,24 +254,22 @@ export default function DashboardShell({
     (pathname !== null && pathname.startsWith('/dashboard/crm/')) ||
     pathname === '/dashboard/ad-tracker' ||
     (pathname !== null && pathname.startsWith('/dashboard/ad-tracker/')) ||
-    isSocialRoute ||
+    pathname === '/dashboard/social' ||
+    (pathname !== null && pathname.startsWith('/dashboard/social/')) ||
     pathname === '/dashboard/organico' ||
     (pathname !== null && pathname.startsWith('/dashboard/organico/'));
 
   const [expandedSections, setExpandedSections] = useState<Record<string, boolean>>({});
 
   const isMetricasOpen = expandedSections['metricas'] ?? isMetricasRoute;
-  const isSocialOpen = expandedSections['social'] ?? isSocialRoute;
   const isAgenciaOpen = expandedSections['agencia'] ?? isAgenciaRoute;
 
-  const toggleSection = (key: 'metricas' | 'social' | 'agencia') => {
+  const toggleSection = (key: 'metricas' | 'agencia') => {
     setExpandedSections((prev) => {
       const current =
         key === 'metricas'
           ? (prev['metricas'] ?? isMetricasRoute)
-          : key === 'social'
+          : (prev['agencia'] ?? isAgenciaRoute);
-            ? (prev['social'] ?? isSocialRoute)
-            : (prev['agencia'] ?? isAgenciaRoute);
       return {
         ...prev,
         [key]: !current,
@@ -368,86 +375,20 @@ export default function DashboardShell({
                   ) : null}
 
                   {moduleOn('social') ? (
-                    <div className="space-y-0.5">
+                    <Link
-                      <Link
+                      href="/dashboard/social"
-                        href="/dashboard/social"
+                      onClick={close}
-                        onClick={(e) => {
+                      className={subLinkCls('/dashboard/social')}
-                          if (moduleOn('calendario') || moduleOn('pipeline')) {
+                    >
-                            if (pathname === '/dashboard/social') {
+                      <Share2
-                              e.preventDefault();
+                        className={`h-3.5 w-3.5 shrink-0 ${
-                              toggleSection('social');
+                          isActive(pathname, '/dashboard/social')
-                              return;
+                            ? 'text-fuchsia-400'
-                            } else if (!isSocialOpen) {
+                            : 'text-mist-400 group-hover:text-mist-300'
-                              toggleSection('social');
+                        }`}
-                            }
+                      />
-                          }
+                      <span className="truncate">Social</span>
-                          close();
+                    </Link>
-                        }}
-                        className={`${subLinkCls('/dashboard/social')} justify-between`}
-                      >
-                        <div className="flex items-center gap-2.5 min-w-0">
-                          <Share2
-                            className={`h-3.5 w-3.5 shrink-0 ${
-                              isActive(pathname, '/dashboard/social')
-                                ? 'text-fuchsia-400'
-                                : 'text-mist-400 group-hover:text-mist-300'
-                            }`}
-                          />
-                          <span className="truncate">Social</span>
-                        </div>
-                        {moduleOn('calendario') || moduleOn('pipeline') ? (
-                          <span
-                            role="button"
-                            tabIndex={0}
-                            onClick={(e) => {
-                              e.preventDefault();
-                              e.stopPropagation();
-                              toggleSection('social');
-                            }}
-                            className="p-0.5 rounded hover:bg-white/10 text-mist-400 hover:text-white transition-colors shrink-0"
-                            aria-label={isSocialOpen ? 'Ocultar páginas' : 'Mostrar páginas'}
-                          >
-                            <ChevronDown
-                              className={`h-3 w-3 transition-transform duration-200 ${
-                                isSocialOpen ? 'rotate-0 text-white' : '-rotate-90 text-mist-400'
-                              }`}
-                            />
-                          </span>
-                        ) : null}
-                      </Link>
-                      {isSocialOpen ? (
-                        <div className="space-y-0.5 my-0.5">
-                          {moduleOn('calendario') ? (
-                            <Link
-                              href="/dashboard/calendario"
-                              onClick={close}
-                              className={`ml-11 flex items-center gap-2 rounded-md px-2.5 py-1.5 text-[12px] font-medium transition-colors ${
-                                isActive(pathname, '/dashboard/calendario')
-                                  ? 'bg-white/[0.07] text-white'
-                                  : 'text-mist-400 hover:bg-white/[0.05] hover:text-white'
-                              }`}
-                            >
-                              <CalendarDays className="h-3 w-3 shrink-0" />
-                              <span className="truncate">Calendario editorial</span>
-                            </Link>
-                          ) : null}
-                          {moduleOn('pipeline') ? (
-                            <Link
-                              href="/dashboard/creatives"
-                              onClick={close}
-                              className={`ml-11 flex items-center gap-2 rounded-md px-2.5 py-1.5 text-[12px] font-medium transition-colors ${
-                                isActive(pathname, '/dashboard/creatives')
-                                  ? 'bg-white/[0.07] text-white'
-                                  : 'text-mist-400 hover:bg-white/[0.05] hover:text-white'
-                              }`}
-                            >
-                              <Images className="h-3 w-3 shrink-0" />
-                              <span className="truncate">Pipeline RRSS</span>
-                            </Link>
-                          ) : null}
-                        </div>
-                      ) : null}
-                    </div>
                   ) : null}
 
                   {moduleOn('organico') ? (