Interface web da OrkestrAI Saúde, uma plataforma de orquestração de agentes de Inteligência Artificial voltada ao apoio de processos no setor de saúde, como triagem, pré-atendimento, agendamento, análise de documentos clínicos (RAG) e suporte à tomada de decisão.
Este repositório contém o frontend responsável por autenticação, navegação, gestão de agentes, conversas com streaming e gerenciamento de documentos.
A OrkestrAI UI fornece uma interface moderna e segura para:
- Autenticação e controle de acesso (login e permissões)
- Gerenciamento de agentes de IA (criar, editar e organizar)
- Chat com streaming para interação com agentes
- Gerenciamento de documentos para uso com RAG
- Dashboard com visão geral de uso e operações
A plataforma opera com acesso controlado por login e senha, seguindo boas práticas de segurança e privacidade, especialmente para o contexto de saúde.
graph TB
subgraph "ENTRADA DE DADOS"
USER[Usuário<br/>Interação via Browser]
FORMS[Formulários<br/>Login, Cadastro, Configurações]
UPLOAD[Upload de Arquivos<br/>Drag & Drop, File Input]
CHAT_INPUT[Input de Chat<br/>Mensagens do Usuário]
end
subgraph "ORQUESTRAÇÃO - NEXT.JS"
APP_ROUTER[App Router<br/>Next.js 14+]
ROUTES[Rotas<br/>/dashboard, /agents, /ai-chat]
API_ROUTES[API Routes<br/>Proxy, Auth Callbacks]
COMPONENTS[Componentes React<br/>UI Reutilizáveis]
CONTEXTS[Contexts<br/>ModelContext, Auth State]
end
subgraph "IA - INTEGRAÇÃO"
API_CLIENT[API Client<br/>HTTP Client Axios]
STREAM_HANDLER[Stream Handler<br/>SSE Parser]
CHAT_STREAM[Chat Stream<br/>Gerenciamento de Streaming]
end
subgraph "PERSISTÊNCIA"
LOCAL_STORAGE[Local Storage<br/>Tokens, Preferências]
COOKIES[Cookies<br/>Sessão, Auth Tokens]
STATE[React State<br/>Estado da Aplicação]
end
subgraph "SAÍDA"
UI_RENDER[Renderização UI<br/>React Components]
STREAM_UI[Streaming UI<br/>Chat em Tempo Real]
NOTIFICATIONS[Notificações<br/>Toasts, Alerts]
end
USER -->|Cliques, Inputs| FORMS
USER -->|Mensagens| CHAT_INPUT
USER -->|Arquivos| UPLOAD
FORMS --> APP_ROUTER
CHAT_INPUT --> APP_ROUTER
UPLOAD --> APP_ROUTER
APP_ROUTER --> ROUTES
APP_ROUTER --> API_ROUTES
ROUTES --> COMPONENTS
COMPONENTS --> CONTEXTS
CHAT_INPUT --> API_CLIENT
API_CLIENT -->|HTTP/SSE| STREAM_HANDLER
STREAM_HANDLER --> CHAT_STREAM
API_ROUTES -->|Auth| LOCAL_STORAGE
API_ROUTES -->|Session| COOKIES
CONTEXTS --> STATE
CHAT_STREAM -->|Stream Data| STREAM_UI
COMPONENTS -->|Render| UI_RENDER
UI_RENDER -->|Feedback| NOTIFICATIONS
STREAM_UI -->|Display| USER
UI_RENDER -->|Display| USER
NOTIFICATIONS -->|Display| USER
- Decisão: Uso do App Router do Next.js 14+ em vez de Pages Router
- Motivo: Melhor suporte a Server Components, streaming e layouts aninhados
- Impacto: Performance melhorada e experiência de desenvolvimento moderna
- Decisão: API Routes do Next.js fazem proxy para orkestrai-api
- Motivo: Evita problemas de CORS e mantém tokens seguros no servidor
- Impacto: Segurança aprimorada e simplificação do frontend
- Decisão: Parser customizado para Server-Sent Events (SSE)
- Motivo: Experiência de chat em tempo real sem polling
- Impacto: UX melhorada com feedback instantâneo
- Decisão: React Context para gerenciar estado de modelos e autenticação
- Motivo: Evita prop drilling e centraliza estado compartilhado
- Impacto: Código mais limpo e manutenível
- Decisão: Biblioteca de componentes shadcn/ui baseada em Radix UI
- Motivo: Componentes acessíveis, customizáveis e sem dependências pesadas
- Impacto: UI consistente e desenvolvimento mais rápido
- Decisão: Separação clara entre
lib/(lógica),components/(UI),app/(rotas) - Motivo: Facilita manutenção e testes
- Impacto: Código mais organizado e escalável
- Decisão: TypeScript com configuração strict
- Motivo: Type safety e prevenção de erros em tempo de desenvolvimento
- Impacto: Menos bugs em produção e melhor experiência de desenvolvimento
- Decisão: Tokens JWT armazenados em cookies httpOnly quando possível
- Motivo: Segurança contra XSS e melhor controle de sessão
- Impacto: Aplicação mais segura para dados sensíveis de saúde
Na arquitetura da OrkestrAI Saúde, o frontend é responsável por:
- Ser o ponto de entrada do usuário (HTTPS)
- Aplicar regras de sessão e autenticação
- Consumir a OrkestrAI API para:
- CRUD de agentes
- Conversas com streaming
- Upload e organização de arquivos (base para RAG)
- Oferecer uma experiência de uso clara para rotinas operacionais em saúde
A OrkestrAI UI foi desenhada para apoiar princípios de segurança e LGPD:
- Sessões autenticadas e chamadas seguras à API
- Acesso controlado e governança por perfis (quando aplicável)
- Interface pensada para ambientes com dados sensíveis
- Apoio à rastreabilidade via logs e histórico de interações (gerenciado no backend)
- Node.js LTS (18+)
- Backend OrkestrAI API rodando localmente
git clone https://github.com/EliasSantiago/orkestrai-ui.git
cd orkestrai-ui
npm install
cp env.template .env.local
# ajuste a variável abaixo
npm run devNEXT_PUBLIC_API_URL=http://localhost:8001curl http://localhost:8001/healthorkestrai-ui/
├── app/ # Rotas (Next.js App Router)
├── components/ # Componentes reutilizáveis
├── lib/ # Cliente HTTP, auth helpers e utilitários
├── types/ # Tipos TypeScript
└── public/ # Assets estáticos
Next.js • React • TypeScript • TailwindCSS • shadcn/ui
- Backend (OrkestrAI API): https://github.com/EliasSantiago/orkestrai-api
- Modelos open source / inferência local (Tensoria): https://github.com/EliasSantiago/tensoria
- Plataforma: https://orkestrai.com.br
A OrkestrAI Saúde pode operar com acesso restrito por convites em fases iniciais, para garantir controle de uso, segurança e qualidade da experiência.
Para fins de avaliação institucional ou demonstração, acessos controlados podem ser fornecidos mediante solicitação.
npm run dev # Inicia servidor de desenvolvimento
npm run build # Build para produção
npm run start # Inicia servidor de produção
npm run lint # Executa ESLint