// App Shell — dark mode v2 with purple-blue accents const AppShell = ({ current, onNavigate, children, page }) => { // Full module tree for Automatiza (all waves registered; wave-1 screens are navigable, others show "em breve") const navGroups = [ { id: 'dashboards', label: 'Dashboards', items: [ { id: 'dashboard', icon: 'dashboard', label: 'Home' }, { id: 'executivo', icon: 'trending-up', label: 'Executivo' }, { id: 'kpis', icon: 'bar-chart', label: 'KPIs históricos' }, { id: 'churn', icon: 'alert', label: 'Churn Monitor', counter: 3 }, { id: 'relatorios', icon: 'file', label: 'Relatórios' }, ] }, { id: 'crm', label: 'Comercial', items: [ { id: 'crm', icon: 'kanban', label: 'Pipeline', counter: 28 }, { id: 'contatos', icon: 'users', label: 'Contatos', counter: 412 }, { id: 'negocios', icon: 'briefcase', label: 'Negócios' }, { id: 'prospeccao', icon: 'map', label: 'Prospecção Maps' }, { id: 'orcamentos', icon: 'calc', label: 'Orçamentos' }, { id: 'estimativas', icon: 'calc', label: 'Estimativas' }, { id: 'propostas', icon: 'doc', label: 'Propostas' }, { id: 'pedidos', icon: 'shopping', label: 'Pedidos' }, { id: 'os', icon: 'wrench', label: 'Ordens de Serviço' }, ] }, { id: 'financeiro', label: 'Financeiro', items: [ { id: 'fluxo', icon: 'trending-up', label: 'Fluxo de Caixa' }, { id: 'lancamentos', icon: 'receipt', label: 'Lançamentos' }, { id: 'bancos', icon: 'wallet', label: 'Contas Bancárias' }, { id: 'conciliacao', icon: 'sync', label: 'Conciliação OFX' }, { id: 'contratos', icon: 'doc', label: 'Contratos' }, { id: 'assinaturas', icon: 'repeat', label: 'Assinaturas' }, { id: 'faturas', icon: 'receipt', label: 'Faturas', counter: 16 }, { id: 'despesas', icon: 'minus-circle', label: 'Despesas' }, { id: 'dre', icon: 'bar-chart', label: 'DRE & Relatórios' }, ] }, { id: 'rh', label: 'RH & Folha CLT', items: [ { id: 'funcionarios', icon: 'users', label: 'Funcionários', counter: 17 }, { id: 'horarios', icon: 'clock', label: 'Horários' }, { id: 'ponto', icon: 'check', label: 'Ponto Eletrônico' }, { id: 'folha', icon: 'wallet', label: 'Folha CLT' }, { id: 'ajustes', icon: 'edit', label: 'Ajustes Salariais' }, { id: 'comissoes', icon: 'award', label: 'Comissões' }, { id: 'ferias', icon: 'palm', label: 'Férias' }, { id: 'licencas', icon: 'doc', label: 'Licenças' }, { id: 'folgas-tipos', icon: 'tag', label: 'Tipos de Folga' }, { id: 'alocacoes', icon: 'calendar', label: 'Alocações de Folga' }, { id: 'rh-relatorios', icon: 'bar-chart', label: 'Relatórios RH' }, ] }, { id: 'marketing', label: 'Marketing', items: [ { id: 'campanhas', icon: 'megaphone', label: 'Campanhas', counter: 4 }, { id: 'criador', icon: 'sparkle', label: 'Criador' }, { id: 'templates', icon: 'mail', label: 'Templates' }, { id: 'listas', icon: 'users', label: 'Listas de envio' }, { id: 'blacklist', icon: 'ban', label: 'Blacklist' }, { id: 'ia-gen', icon: 'cpu', label: 'Gerador IA' }, { id: 'scoring', icon: 'trending-up', label: 'Lead Scoring' }, { id: 'mailing-rel', icon: 'bar-chart', label: 'Relatórios' }, ] }, { id: 'suporte', label: 'Suporte', items: [ { id: 'tickets', icon: 'help', label: 'Tickets', counter: 12 }, { id: 'kb-suporte', icon: 'book', label: 'Base de Conhecimento' }, ] }, { id: 'projetos', label: 'Projetos & Operacional', items: [ { id: 'projetos', icon: 'folder', label: 'Projetos', counter: 6 }, { id: 'calendario', icon: 'calendar', label: 'Calendário' }, { id: 'arquivos', icon: 'file', label: 'Arquivos' }, { id: 'documentos', icon: 'doc', label: 'Documentos' }, { id: 'knowledge', icon: 'book', label: 'Knowledge' }, { id: 'mensagens', icon: 'message', label: 'Mensagens', counter: 3 }, { id: 'comunicados', icon: 'megaphone', label: 'Comunicados' }, { id: 'notas', icon: 'edit', label: 'Notas pessoais' }, { id: 'tarefas', icon: 'check', label: 'Tarefas pessoais' }, { id: 'lembretes', icon: 'bell', label: 'Lembretes' }, { id: 'whatsapp', icon: 'whatsapp', label: 'WhatsApp', counter: 8 }, ] }, { id: 'pdv', label: 'PDV Fiscal', items: [ { id: 'terminal', icon: 'shopping', label: 'Terminal' }, { id: 'produtos', icon: 'tag', label: 'Produtos' }, { id: 'fiscais', icon: 'shield', label: 'Docs Fiscais' }, ] }, { id: 'admin', label: 'Admin', items: [ { id: 'usuarios', icon: 'users', label: 'Usuários' }, { id: 'gestao', icon: 'shield', label: 'Papéis & Permissões' }, { id: 'config', icon: 'settings', label: 'Configurações' }, ] }, ]; // Breadcrumb resolver const flat = navGroups.flatMap(g => g.items.map(i => ({ ...i, group: g.label }))); const currentItem = flat.find(i => i.id === current) || { label: 'Dashboard', group: 'Home' }; // Groups collapse state, persisted const [collapsed, setCollapsed] = React.useState(() => { try { return JSON.parse(localStorage.getItem('automatiza-nav-collapse') || '{}'); } catch { return {}; } }); const toggleGroup = (id) => { const next = { ...collapsed, [id]: !collapsed[id] }; setCollapsed(next); try { localStorage.setItem('automatiza-nav-collapse', JSON.stringify(next)); } catch {} }; // Auto-expand the group that contains `current` const activeGroupId = navGroups.find(g => g.items.some(i => i.id === current))?.id; const handleClick = (id) => { onNavigate(id); }; const [mobNav, setMobNav] = React.useState(false); const [isNarrow, setIsNarrow] = React.useState(() => typeof window !== 'undefined' && window.innerWidth <= 980); React.useEffect(() => { const onResize = () => setIsNarrow(window.innerWidth <= 980); window.addEventListener('resize', onResize); return () => window.removeEventListener('resize', onResize); }, []); return (
{mobNav &&
setMobNav(false)}/>}
{currentItem.group} / {currentItem.label}
⌘K
{children}
); }; Object.assign(window, { AppShell });