tiagoandClaude Sonnet 5
323912748f
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>
64 lines
2.0 KiB
TypeScript
64 lines
2.0 KiB
TypeScript
'use client';
|
|
|
|
import * as React from 'react';
|
|
|
|
import { AppShell } from '@/components/layout/app-shell';
|
|
import { UserFooter } from '@/components/layout/user-footer';
|
|
import { useAuth } from '@/lib/auth/auth-context';
|
|
import { MASTER_NAV_ITEMS, MASTER_BOTTOM_HREFS } from '@/lib/layout/nav-items';
|
|
|
|
function MasterBrandSymbol() {
|
|
return (
|
|
<span className="flex size-9 shrink-0 items-center justify-center rounded-lg bg-brand-master text-sm font-bold text-white">
|
|
SV
|
|
</span>
|
|
);
|
|
}
|
|
|
|
/** Identidade fixa do painel master — nunca whitelabel (ver `TenantShell`). */
|
|
function MasterBrand() {
|
|
return (
|
|
<>
|
|
<MasterBrandSymbol />
|
|
<span className="truncate text-sm font-semibold text-neutral-950">SeConectai Vendas</span>
|
|
</>
|
|
);
|
|
}
|
|
|
|
export function MasterShell({
|
|
initialCollapsed,
|
|
children,
|
|
}: {
|
|
initialCollapsed: boolean;
|
|
children: React.ReactNode;
|
|
}) {
|
|
const { logout } = useAuth();
|
|
const handleLogout = React.useCallback(() => {
|
|
void logout();
|
|
}, [logout]);
|
|
|
|
return (
|
|
// `Sidebar`/`BottomTabBar`/`NavList` destacam o item ativo com os tokens
|
|
// `--color-primary(-on-light)` — dinâmicos por tenant (Etapa 13). O
|
|
// master tem identidade fixa (seção 6 da arquitetura), então essa
|
|
// sobrescrita local troca esses tokens por `--brand-master` só dentro
|
|
// desta árvore, sem tocar no `:root` (evitaria vazar pro `/app` do
|
|
// tenant na mesma aba).
|
|
<div
|
|
style={{ '--color-primary': 'var(--brand-master)', '--color-primary-on-light': 'var(--brand-master)' } as React.CSSProperties}
|
|
>
|
|
<AppShell
|
|
brand={<MasterBrand />}
|
|
brandCollapsed={<MasterBrandSymbol />}
|
|
items={MASTER_NAV_ITEMS}
|
|
bottomHrefs={MASTER_BOTTOM_HREFS}
|
|
footer={<UserFooter label="Administrador master" onLogout={handleLogout} />}
|
|
footerCollapsed={<UserFooter label="Administrador master" compact onLogout={handleLogout} />}
|
|
initialCollapsed={initialCollapsed}
|
|
>
|
|
{children}
|
|
</AppShell>
|
|
</div>
|
|
);
|
|
}
|