Chat interno 1-a-1 entre usuarios de la plataforma (addon skeen_chat + pagina Chat con badge de no leidos)

frontend/src/components/HomeNestLayout.tsx

@@ -31,6 +31,7 @@ import {
   Star,
   Pencil,
   ChevronUp,
+  MessageCircle,
 } from 'lucide-react';
 import { Button, Modal, Input } from './ui';
 import QuickLinksDock, { QuickLinksModePicker } from './QuickLinksDock';
@@ -38,6 +39,7 @@ import GlobalSearch from './GlobalSearch';
 import ThemePicker from './ThemePicker';
 import NotificationBell from './NotificationBell';
 import { useAuth } from '../lib/auth';
+import { useChatUnread } from '../lib/chat';
 import { useQuickLinks } from '../lib/quicklinks';
 import { odooApi } from '../services/odoo';
 
@@ -85,6 +87,7 @@ const menuSections = [
     items: [
       { label: 'Reportes', icon: BarChart3, href: '/reportes' },
       { label: 'Comisiones', icon: Percent, href: '/reportes?tab=comisiones' },
+      { label: 'Chat', icon: MessageCircle, href: '/chat' },
       { label: 'Cumpleañeros', icon: Cake, href: '/cumpleanos' },
       { label: 'Configuración', icon: Settings, href: '/configuracion' },
     ],
@@ -104,6 +107,7 @@ export const HomeNestLayout: FC<LayoutProps> = ({ children, title: _title, subti
   const { user, canSee, hasRole, logout } = useAuth();
   const [menuOpen, setMenuOpen] = useState(false);
   const [expanded, setExpanded] = useState<string[]>(['Clínica']);
+  const chatUnread = useChatUnread();
 
   const visibleSections = useMemo(
     () =>
@@ -287,6 +291,11 @@ export const HomeNestLayout: FC<LayoutProps> = ({ children, title: _title, subti
                           onMouseLeave={(e) => e.currentTarget.style.backgroundColor = 'transparent'}
                         >
                           <Icon size={16} /> {item.label}
+                          {item.href === '/chat' && chatUnread > 0 && (
+                            <span className="ml-auto inline-flex items-center justify-center min-w-[18px] h-[18px] px-1 rounded-full bg-brand-coral text-white text-[10px] font-bold">
+                              {chatUnread}
+                            </span>
+                          )}
                         </Link>
                       );
                     })}
@@ -458,6 +467,11 @@ export const HomeNestLayout: FC<LayoutProps> = ({ children, title: _title, subti
                           >
                             <Icon size={16} />
                             {item.label}
+                            {item.href === '/chat' && chatUnread > 0 && (
+                              <span className="ml-auto inline-flex items-center justify-center min-w-[18px] h-[18px] px-1 rounded-full bg-brand-coral text-white text-[10px] font-bold">
+                                {chatUnread}
+                              </span>
+                            )}
                           </Link>
                           <button
                             type="button"
@@ -556,6 +570,11 @@ export const HomeNestLayout: FC<LayoutProps> = ({ children, title: _title, subti
                     }}
                   >
                     <Icon size={18} /> {item.label}
+                    {item.href === '/chat' && chatUnread > 0 && (
+                      <span className="ml-auto inline-flex items-center justify-center min-w-[18px] h-[18px] px-1 rounded-full bg-brand-coral text-white text-[10px] font-bold">
+                        {chatUnread}
+                      </span>
+                    )}
                   </Link>
                 );
               })}