Files
SeConectai_Vendas/frontend/components/layout/drawer.tsx
T
tiagoandClaude Sonnet 5 323912748f 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

41 lines
1.3 KiB
TypeScript

'use client';
import * as React from 'react';
import { Sheet, SheetContent, SheetHeader, SheetTitle } from '@/components/ui/sheet';
import { Separator } from '@/components/ui/separator';
import { NavList } from '@/components/layout/nav-list';
import type { NavItem } from '@/lib/layout/nav-items';
interface DrawerProps {
open: boolean;
onOpenChange: (open: boolean) => void;
brand: React.ReactNode;
items: NavItem[];
footer: React.ReactNode;
}
/**
* Menu deslizante mobile — réplica do menu completo da sidebar desktop.
* Fecha ao navegar (`NavList.onNavigate`) ou ao tocar fora (comportamento
* padrão do `Sheet`/Radix Dialog).
*/
export function Drawer({ open, onOpenChange, brand, items, footer }: DrawerProps) {
return (
<Sheet open={open} onOpenChange={onOpenChange}>
<SheetContent side="left" className="w-4/5 gap-0 p-0">
<SheetHeader className="h-16 flex-row items-center gap-2 px-4 py-0">
{brand}
<SheetTitle className="sr-only">Menu de navegação</SheetTitle>
</SheetHeader>
<Separator />
<div className="min-h-0 flex-1 overflow-y-auto px-3 py-4">
<NavList items={items} onNavigate={() => onOpenChange(false)} />
</div>
<Separator />
<div className="flex flex-col gap-2 p-3">{footer}</div>
</SheetContent>
</Sheet>
);
}