Sobre este projeto
it-programming / web-development
Aberto
Estamos buscando um desenvolvedor experiente para criar uma plataforma web multi-tenant robusta e intuitiva, focada na visualização, filtragem e análise de registros de chamadas geradas via Voximplant Kit. A solução deve ser construída para operar em um ambiente self-hosted, utilizando nossa infraestrutura existente no Hetzner, onde Supabase e n8n já estão configurados e em funcionamento.
Objetivo do Projeto:
O principal objetivo é fornecer aos nossos clientes uma ferramenta completa para gerenciar e analisar seus dados de chamadas de forma eficiente, com uma interface moderna e personalizável.
Estilo Visual:
A interface do usuário deve ser moderna, limpa e responsiva, garantindo uma experiência otimizada tanto em desktops quanto em tablets. É Essencial que a plataforma suporte funcionalidades de white-label, permitindo a customização da marca para cada cliente. A inspiração visual deve ser o Voximplant Kit, buscando uma estética coesa e profissional.
Funcionalidades Detalhadas:
Tela: Histórico de Chamadas
* Cabeçalho: "Histórico"
* Subtabs: "Chamadas" e "Chamadas Perdidas"
* Filtros de Data e Hora: Um date picker para seleção de data e campos para seleção de hora (00:00 a 23:59).
* Botão de Filtros: Um ícone de engrenagem que, ao ser clicado, abre um painel lateral com opções de filtragem avançada.
Colunas da Tabela de Chamadas:
* Tempo: Horário da chamada.
* Tipo: Indicador visual (ícone) para chamadas de entrada ou saída.
* Chamada de / para: Números de origem e destino.
* Tempo de discagem / conversa: Duração da chamada.
* Record: Ícone de play para acesso à gravação da chamada.
* Cenário: Cenário de uso da chamada.
* Campanha: Campanha associada à chamada.
* Resultado da tentativa: Status final da chamada (ex: atendida, ocupada, etc.).
* Código de finalização: Código de término da chamada.
Filtros Laterais (Painel de Filtros):
* Tipo de chamada: Entrada, Saída.
* Número: Campo de busca para filtrar por número de telefone.
* Tempo de conversa: Faixa de tempo de duração da conversa.
* Resultado da tentativa: Dropdown com opções de resultados.
* Código de finalização: Dropdown com opções de códigos.
* Tags, Cenários, Campanhas: Dropdowns para seleção de tags, cenários e campanhas.
* Botão: "Aplicar filtros" para aplicar as seleções.
Funcionalidade de Áudio:
O ícone de play na coluna "Record" deve abrir um player HTML5 embutido ou um link seguro com token para reprodução da gravação da chamada.
KPIs por Campanha:
* SLA (Service Level Agreement): Tempo médio de atendimento.
* Total de chamadas: Número total de chamadas.
* Chamadas Atendidas: Número de chamadas que foram atendidas.
* Chamadas Positivas: Número de chamadas com resultado positivo.
* Chamadas Negativas: Número de chamadas com resultado negativo.
Outras Funcionalidades Essenciais:
* Exportação de Dados: Capacidade de exportar o histórico de chamadas em formatos csv e pdf.
* Sistema de Login: Autenticação de usuários via e-mail e senha.
* Integração n8n + Voximplant: Conexão fluida entre as plataformas para ingestão de dados.
* Multi-cliente com Isolamento de Dados: A plataforma deve suportar múltiplos clientes, garantindo o isolamento completo dos dados de cada um.
* Customização por Cliente: Possibilidade de personalizar a plataforma para atender às necessidades específicas de cada cliente (white-label).
Stack Técnica Requerida:
* Frontend: React e Tailwind CSS para uma interface moderna e responsiva.
* Backend/API: Supabase, utilizando PostgreSQL para banco de dados, Auth para autenticação, Storage para armazenamento e RLS (Row Level Security) para segurança dos dados.
* Automação: n8n para orquestração de fluxos de trabalho e integração de dados.
* Hospedagem: Servidor dedicado Hetzner (já provisionado).
Fluxo de Integração com Voximplant:
1. O Voximplant enviará eventos e dados de chamadas para o n8n.
2. O n8n processará esses dados e os enviará para o Supabase.
3. O Supabase armazenará os registros de chamadas, associando-os ao respectivo cliente através de um `cliente_id`.
4. O frontend em React exibirá os dados filtrados e analisados, utilizando jwt (json web tokens) para autenticação e autorização.
Entregáveis do Projeto:
* Frontend funcional e completo desenvolvido em React.
* Backend operando perfeitamente com Supabase (PostgreSQL, Auth, Storage, RLS).
* Integração e automação de dados via n8n.
* Implementação de segurança robusta (rls, jwt).
* Documentação detalhada para setup e manutenção da plataforma.
Categoria TI e Programação
Subcategoria Programação
Qual é o alcance do projeto? Criar um novo site personalizado
Prazo de Entrega: Não estabelecido
Habilidades necessárias