Dashboard-Automatizase/docs/architecture/componentes.md
2025-10-05 21:17:43 -03:00

100 lines
2.4 KiB
Markdown

# Componentes
## NextJS Frontend App
**Responsabilidade:** Renderiza UI do portal, gerencia estado da aplicação
**Interfaces Principais:**
- Pages: `/login`, `/reset-password`, `/dashboard`
- Components: `WhatsAppInstanceCard`, `GoogleCalendarCard`, `Header`, `Footer`
- Hooks: `useAuth`, `useWhatsAppInstances`, `useGoogleCalendar`
**Dependências:** Supabase Auth Client, API Routes, Shadcn/ui
**Tech Stack:** Next.js 14, React 18, TypeScript, TailwindCSS, Shadcn/ui
---
## NextJS API Routes (BFF)
**Responsabilidade:** Orquestra chamadas à EvolutionAPI e Supabase, protege API keys
**Interfaces Principais:**
- `/api/whatsapp/instances` - Lista instâncias
- `/api/whatsapp/instances/[name]/qrcode` - Gera QR code
- `/api/whatsapp/instances/[name]/disconnect` - Desconecta
- `/api/google-calendar/status` - Status OAuth
- `/api/google-calendar/callback` - Callback OAuth
**Dependências:** EvolutionAPI client, Supabase client
**Tech Stack:** Next.js API Routes, TypeScript, Vercel Edge Functions
---
## Supabase Backend
**Responsabilidade:** Autenticação, autorização, persistência de dados
**Interfaces Principais:**
- Supabase Auth API (login, logout, resetPassword)
- PostgreSQL schema `portal`
- Row Level Security policies
**Dependências:** PostgreSQL 15+, SMTP AutomatizaSE
**Tech Stack:** Supabase (Auth + Database), PostgreSQL
---
## Diagrama de Componentes
```mermaid
graph TB
subgraph "Frontend (Vercel)"
Pages[Pages<br/>/login /dashboard]
Components[Components<br/>Cards, Modals]
Hooks[Custom Hooks<br/>useAuth useAPI]
Pages --> Components
Pages --> Hooks
Components --> Hooks
end
subgraph "Backend (API Routes)"
WhatsAppAPI[WhatsApp Routes]
CalendarAPI[Calendar Routes]
AuthMW[Auth Middleware]
WhatsAppAPI --> AuthMW
CalendarAPI --> AuthMW
end
subgraph "External Services"
Evolution[EvolutionAPI]
Supabase[Supabase]
n8n[n8n OAuth]
end
Hooks --> WhatsAppAPI
Hooks --> CalendarAPI
Hooks --> Supabase
WhatsAppAPI --> Evolution
CalendarAPI --> Supabase
AuthMW --> Supabase
Pages --> n8n
n8n --> CalendarAPI
style Pages fill:#4A90E2
style Components fill:#4A90E2
style WhatsAppAPI fill:#000
style CalendarAPI fill:#000
style Evolution fill:#25D366
style Supabase fill:#3ECF8E
style n8n fill:#FF6D5A
```
---