Frontend completo (Etapas 11-18) e extensões de backend (Etapas 13 e 18)

Adiciona o frontend Next.js em frontend/ (setup, design system, autenticação/tema, layout/navegação, área master, área tenant completa: clientes, produtos, vendas, recebimentos, whatsapp, e-mail, alertas, equipe e perfil). Estende o backend de forma aditiva e autorizada: cookie httpOnly para refresh token (Etapa 13) e CRUD de equipe + edição de perfil do tenant (Etapa 18, módulo src/modules/equipe/ novo e PUT /tenant/perfil). Detalhes completos em Etapas/V2/*. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-08-16 09:41:13 -03:00
parent f9738e54da
commit 323912748f
179 changed files with 29312 additions and 22 deletions
@@ -0,0 +1,82 @@
+'use client';
+
+import * as React from 'react';
+import Link from 'next/link';
+import { usePathname } from 'next/navigation';
+import { Ellipsis } from 'lucide-react';
+
+import { cn } from '@/lib/utils';
+import { Sheet, SheetContent, SheetHeader, SheetTitle } from '@/components/ui/sheet';
+import { NavList } from '@/components/layout/nav-list';
+import type { NavItem } from '@/lib/layout/nav-items';
+
+function isActive(pathname: string, href: string): boolean {
+  return pathname === href || pathname.startsWith(`${href}/`);
+}
+
+interface BottomTabBarProps {
+  /** Os 4 itens principais, já resolvidos na ordem de exibição. */
+  items: NavItem[];
+  /** Restante do menu, exibido no sheet "Mais". */
+  moreItems: NavItem[];
+}
+
+/** Bottom tab bar mobile (`<md`) — 4 itens fixos + "Mais" com o restante do menu. */
+export function BottomTabBar({ items, moreItems }: BottomTabBarProps) {
+  const pathname = usePathname();
+  const [moreOpen, setMoreOpen] = React.useState(false);
+  const moreActive = moreItems.some(
+    (item) => isActive(pathname, item.href) || item.children?.some((child) => isActive(pathname, child.href)),
+  );
+
+  return (
+    <>
+      <nav
+        aria-label="Navegação principal"
+        className="fixed inset-x-0 bottom-0 z-20 flex h-16 items-stretch border-t border-border bg-surface md:hidden"
+      >
+        {items.map((item) => {
+          const Icon = item.icon;
+          const active = isActive(pathname, item.href);
+          return (
+            <Link
+              key={item.href}
+              href={item.href}
+              aria-current={active ? 'page' : undefined}
+              className={cn(
+                'flex flex-1 flex-col items-center justify-center gap-0.5 text-[11px] font-medium text-neutral-500',
+                active && 'text-primary-on-light',
+              )}
+            >
+              <Icon className="size-5" aria-hidden />
+              {item.label}
+            </Link>
+          );
+        })}
+        <button
+          type="button"
+          onClick={() => setMoreOpen(true)}
+          aria-haspopup="dialog"
+          className={cn(
+            'flex flex-1 flex-col items-center justify-center gap-0.5 text-[11px] font-medium text-neutral-500',
+            moreActive && 'text-primary-on-light',
+          )}
+        >
+          <Ellipsis className="size-5" aria-hidden />
+          Mais
+        </button>
+      </nav>
+
+      <Sheet open={moreOpen} onOpenChange={setMoreOpen}>
+        <SheetContent side="bottom" className="max-h-[70vh] gap-0 p-0">
+          <SheetHeader>
+            <SheetTitle>Mais opções</SheetTitle>
+          </SheetHeader>
+          <div className="overflow-y-auto px-3 pb-4">
+            <NavList items={moreItems} onNavigate={() => setMoreOpen(false)} />
+          </div>
+        </SheetContent>
+      </Sheet>
+    </>
+  );
+}