DG Pipefy Usage Statistics

Visualize estatísticas de uso do iPaaS, API, Automações e AI Credits no Pipefy

DG Pipefy Usage Statistics é uma extensão essencial para administradores e analistas do Pipefy que precisam monitorar e analisar o uso de recursos da plataforma. 🎯 FUNCIONALIDADES PRINCIPAIS: 📊 Estatísticas de iPaaS (Integrações) • Visualize execuções de flows (sucesso, falhas, canceladas) • Análise por período (dia, semana, mês, ano) • Top 10 fluxos mais executados (com toggle "Ver Todos") • Identificação de pipes com integração ativa • Estatísticas de Steps no Popup e na Análise da ORG • Badges de steps nos fluxos (executados e no fluxo) • Cache inteligente por pipe (inclui mapa de steps) • Exportação para CSV e PDF 🏢 Análise Completa da Organização • Dashboard executivo com todas as métricas • Total de pipes e taxa de adoção de integração • Estatísticas consolidadas de toda a org • Estatísticas de Steps (total executados, média, steps por fluxo) • Data e hora da última análise com nome da ORG • Suporte a Multi-Tenant e Single-Tenant • Sistema de permissionamento automático • Exportação para PDF e CSV detalhado 📈 Estatísticas de Uso Geral • Uso de Automações (Pipefy nativo) com histórico mensal • Uso de API Calls e limites • Uso de AI Credits (Automation + Assistants) • Alertas visuais quando perto do limite • Informações da organização (plano, membros, pipes) • Features habilitadas (iPaaS, AI, Copilot) ✨ RECURSOS AVANÇADOS: • Formatação brasileira de números (1.234,56) • Detecção de over-limit com alertas visuais • Progresso em tempo real durante análises • Cache robusto com controle por organização • Botão "Limpar Dados" para reset manual • Força atualização de dados ao analisar • Detalhes de steps por execução e por fluxo • Suporte a instâncias Single-Tenant • Exportação em CSV (com steps) e PDF 🔒 PRIVACIDADE: • Todos os dados processados localmente • Nenhum dado enviado para servidores externos • Token e credenciais armazenados apenas no navegador • Código seguro e confiável 🎨 INTERFACE: • Design moderno e intuitivo • Cores e gradientes profissionais • Dashboard executivo pronto para apresentações • Abas "Top 10" e "Ver Todos" para listas expansíveis • Badges coloridos para steps (executados e no fluxo) • Responsivo e otimizado Ideal para: Administradores Pipefy, Analistas de TI, Gestores de Operações, DevOps, e qualquer profissional que precise monitorar o uso de recursos do Pipefy. ________________________________________ # 📝 Changelog - Histórico de Alterações ## [1.8.1] - 05/02/2026 - Estatísticas de Steps no Popup ### ✨ Novas Funcionalidades #### 🔢 Estatísticas de Steps no Popup (Análise Individual) - **Total Steps Executados**: Soma de todos os `stepsCount` das execuções do pipe - **Média Steps/Execução**: Média de steps por execução de flow - **Total Steps nos Fluxos**: Quantidade de steps em cada fluxo único - **Fluxos Únicos**: Contagem de flowIds distintos - Nova seção "🔢 Estatísticas de Steps" no popup #### 🔍 Detalhes dos Fluxos no Popup - Busca automática de detalhes de cada fluxo via API `/api/v1/flows/{flowId}` - Contagem recursiva de steps (procura por `name` contendo "step_") - Badges nos fluxos: "X steps exec" e "X steps fluxo" - Cache do mapa de steps para restauração rápida ### 🎨 Interface - Novos cards de estatísticas com cor roxa para Steps - Badges coloridos: steps-exec (roxo claro), steps-flow (roxo escuro) ### 🔧 Melhorias Técnicas - Nova action `fetchFlowDetails` no background.js - Nova action `fetchMultipleFlowDetails` para processamento em lote - Função `countStepsInFlow` para contagem recursiva - Variável `flowStepsMap` para mapeamento de steps por flowId - Salvamento/restauração do flowStepsMap no cache --- ## [1.8.0] - 05/02/2026 - Estatísticas de Steps e Cache Robusto ### ✨ Novas Funcionalidades #### 🔢 Estatísticas de Steps - **Total de Steps Executados**: Soma de todos os `stepsCount` das execuções - **Média Steps/Execução**: Média de steps por execução de flow - **Total Steps nos Fluxos**: Quantidade de steps em cada fluxo único - **Fluxos Únicos**: Contagem de flowIds distintos - Nova seção "🔢 Estatísticas de Steps" nas duas abas (Análise e Uso Geral) #### 🔍 Detalhes dos Fluxos - Busca automática de detalhes de cada fluxo via API `/api/v1/flows/{flowId}` - Contagem recursiva de steps (procura por `name` contendo "step_") - Mapeamento de tokens por flowId para autenticação correta - Badges nos fluxos: "X steps exec" e "X steps fluxo" #### 📑 Abas Top 10 / Ver Todos - Toggle entre "Top 10" e "Ver Todos" para Pipes e Fluxos - Lista expansível com scroll quando "Ver Todos" - Indicador "... e mais X pipes/fluxos" no modo Top 10 #### 💾 Sistema de Cache Robusto - **Força atualização**: Sempre busca dados novos ao clicar "Analisar" - **Cache-Control headers**: Evita cache do navegador nas requisições - **Limpeza automática por ORG**: Remove cache ao trocar de organização - **Botão "🗑️ Limpar Dados"**: Limpa cache manualmente - **Data da última análise**: Exibe quando e de qual ORG são os dados #### 📅 Info da Última Análise - Exibe data e hora: "📅 Última análise: DD/MM/AAAA às HH:MM" - Mostra ORG: "ORG: 123456 - Nome da Empresa" - Posicionado no canto direito da seção de resultados #### 📄 Exportação Melhorada - **PDF na aba de Análise**: Novo botão ao lado do CSV - **CSV detalhado**: Novas colunas adicionadas: - Pipe ID - Flow ID - Data Criação, Data Início, Data Fim - Steps Executados (por execução) - Steps no Fluxo (total do fluxo) - Nome do arquivo inclui ID da ORG ### 🎨 Interface - Novos cards de estatísticas com cor roxa para Steps - Badges coloridos: steps-exec (roxo claro), steps-flow (roxo escuro) - Botões de exportação lado a lado - Layout de formulário ajustado (3 colunas para Período/De/Para) - Tabs de seção com estilo pill/toggle ### 🔧 Melhorias Técnicas - Headers `Cache-Control: no-cache, no-store, must-revalidate` em todas as requisições - Header `Pragma: no-cache` para compatibilidade - Variável `flowTokensMap` para mapeamento de tokens por flowId - Variável `organizationName` para exibição do nome da ORG - Impressão CSS inteligente baseada em `data-print-tab` - Funções novas: `fetchFlowDetails`, `countStepsInFlow`, `fetchAllFlowsDetails`, `displayStepsStats`, `displayStepsStatsInUsageTab`, `handleExportAnalysisPdf`, `handleClearData`, `updateClearButtonState`, `showSuccessMessage`, `displayLastAnalysisInfo`, `initializeSectionTabs`, `resetSectionTabs` ### 🐛 Correções - Cache agora identifica a organização e não mistura dados de ORGs diferentes - Tokens iPaaS corretos para cada fluxo (cada projeto tem seu próprio token) --- ## [1.7.3] - 23/01/2026 - Versão de Lançamento ### ✨ Recursos Principais - 📊 Análise de estatísticas de iPaaS por pipe - 🏢 Análise completa da organização (todos os pipes) - 📈 Dashboard de uso geral (Automações, API, AI Credits) - 💾 Cache inteligente por pipe - 🔢 Formatação brasileira de números - 📄 Exportação em PDF e CSV - 🏢 Suporte a Multi-Tenant e Single-Tenant - 🔐 Sistema de permissionamento automático - 👤 Footer com assinatura e versão automática ### 🎨 Interface - Design moderno com cores Pipefy - Sistema de abas para organização - Barra de progresso detalhada - Alertas visuais coloridos - Layout responsivo em grid ### 🔒 Segurança - Todos os dados processados localmente - Nenhum envio para servidores externos - Token armazenado apenas no navegador - Código 100% incluído na extensão --- ## [1.1.0] - 22/01/2026 ### ✨ Novas Funcionalidades #### 🔖 Cache de Estatísticas por Pipe - **Problema resolvido:** As estatísticas eram perdidas ao fechar a extensão - **Solução implementada:** - A extensão agora captura o **Pipe ID** da URL do Pipefy - Ao analisar dados, a extensão **salva automaticamente** os resultados no storage - Quando você reabrir a extensão **no mesmo pipe**, as últimas estatísticas analisadas serão **restauradas automaticamente** - Os dados salvos incluem: - Todos os flow runs - Período selecionado (De/Para) - Seletor de período escolhido - Para **re-analisar**, basta clicar novamente no botão "Analisar" - **Cada pipe tem seu próprio cache** - trocar de pipe mostra as estatísticas daquele pipe específico #### 👁️ Campos de Data Sempre Visíveis - **Problema resolvido:** Os campos "De" e "Para" ficavam escondidos ao selecionar períodos pré-definidos - **Solução implementada:** - Os campos **"De"** e **"Para"** agora estão **sempre visíveis** - Ao selecionar um período pré-definido (ex: "Mês atual"), os campos são **automaticamente preenchidos** - Você pode ver e editar as datas a qualquer momento - A experiência fica mais transparente e intuitiva #### 🔤 Correção de Caracteres no CSV - **Problema resolvido:** Caracteres especiais apareciam corrompidos no CSV (ex: "Criação" ao invés de "Criação") - **Solução implementada:** - Adicionado **BOM UTF-8** (Byte Order Mark) no início do arquivo CSV - O BOM é um marcador especial que indica ao Excel que o arquivo está em UTF-8 - Agora o Excel (e outros programas) reconhecem corretamente: - Acentos: á, é, í, ó, ú, ã, õ - Cedilha: ç - Caracteres especiais: ñ, ü, etc. - O arquivo CSV continua compatível com todas as ferramentas (Excel, Google Sheets, etc.) --- ## 🔧 Alterações Técnicas ### Arquivos Modificados #### 📄 `popup.js` - Adicionado campo `pipeId` ao objeto `capturedData` - Criada função `loadLastAnalysis()` - carrega estatísticas salvas do pipe atual - Criada função `saveCurrentAnalysis()` - salva análise atual no storage - Modificada função `handlePeriodChange()` - remove lógica de esconder campos - Modificada função `handleAnalyze()` - agora salva análise após sucesso - Modificada função `handleExport()` - adiciona BOM UTF-8 ao CSV - Modificada função `loadCapturedData()` - carrega também o pipeId #### 📄 `content.js` - Criada função `extractPipeId()` - extrai Pipe ID da URL - Criada função `sendPipeIdToBackground()` - envia Pipe ID para o background - Adicionada lógica para capturar e enviar Pipe ID quando a página carrega - Observer atualizado para enviar Pipe ID em mudanças de URL #### 📄 `background.js` - Adicionado campo `pipeId` ao objeto `capturedData` - Adicionado listener para mensagem `setPipeId` do content script - Modificada lógica de salvamento para incluir `pipeId` --- ## 💾 Estrutura de Dados no Storage ### Antes (v1.0.0) ```javascript { projectId: "...", authToken: "..." } ``` ### Agora (v1.1.0) ```javascript { projectId: "...", authToken: "...", pipeId: "...", analysis_PIPE_ID: { data: [...], // Array de flow runs dateFrom: "2026-01-01", dateTo: "2026-01-31", period: "currentMonth", timestamp: "2026-01-22T..." } } ``` --- ## 🎯 Benefícios das Mudanças ### Para o Usuário - ✅ **Menos trabalho:** Não precisa re-analisar toda vez que abre a extensão - ✅ **Mais rápido:** Estatísticas aparecem instantaneamente ao reabrir - ✅ **Mais controle:** Campos de data sempre visíveis para edição - ✅ **Dados corretos:** CSV sem caracteres corrompidos - ✅ **Multi-pipe:** Cada pipe mantém suas próprias estatísticas ### Para o Sistema - ✅ **Menos requisições:** Cache reduz chamadas à API - ✅ **Melhor UX:** Interface mais responsiva e intuitiva - ✅ **Compatibilidade:** CSV funciona corretamente em qualquer programa --- ## 🔄 Como Funciona o Cache ### Fluxo de Salvamento 1. Usuário analisa dados de um pipe 2. Extensão busca dados da API 3. Dados são exibidos na tela 4. **NOVO:** Dados são salvos automaticamente no storage com chave `analysis_PIPE_ID` ### Fluxo de Carregamento 1. Usuário abre a extensão em um pipe 2. Extensão captura o Pipe ID da URL 3. **NOVO:** Extensão busca `analysis_PIPE_ID` no storage 4. **NOVO:** Se encontrar, restaura dados, datas e período 5. **NOVO:** Exibe automaticamente as estatísticas salvas 6. Usuário pode re-analisar clicando no botão "Analisar" ### Exemplo Prático ``` Pipe A (ID: 123): Última análise em 20/01 └─> Ao abrir extensão: Mostra dados de 20/01 Pipe B (ID: 456): Última análise em 18/01 └─> Ao abrir extensão: Mostra dados de 18/01 Pipe C (ID: 789): Nunca analisado └─> Ao abrir extensão: Sem dados (precisa analisar) ``` --- ## 🐛 Correções de Bugs ### CSV com Caracteres Corrompidos - **Bug:** Acentos e caracteres especiais apareciam incorretos - **Causa:** Faltava BOM UTF-8 no arquivo - **Correção:** Adicionado `const BOM = '\uFEFF';` antes do conteúdo CSV - **Status:** ✅ Resolvido ### Campos de Data Escondidos - **Bug:** Impossível ver as datas quando período não era "Personalizado" - **Causa:** Lógica escondia `customDateInputs` com `display: none` - **Correção:** Removida lógica de esconder, apenas preenche os campos - **Status:** ✅ Resolvido ### Perda de Estatísticas - **Bug:** Ao fechar e reabrir extensão, precisava re-analisar tudo - **Causa:** Dados não eram salvos - **Correção:** Implementado sistema de cache por pipe - **Status:** ✅ Resolvido --- ## 📊 Comparação de Versões | Recurso | v1.0.0 | v1.1.0 | |---------|--------|--------| | Captura automática de dados | ✅ | ✅ | | Seleção de períodos | ✅ | ✅ | | Estatísticas detalhadas | ✅ | ✅ | | Paginação automática | ✅ | ✅ | | Exportação CSV | ✅ | ✅ | | Campos de data visíveis | ❌ | ✅ | | CSV com caracteres corretos | ❌ | ✅ | | Cache de estatísticas por pipe | ❌ | ✅ | | Restauração automática de dados | ❌ | ✅ | --- ## 📝 Notas de Atualização ### Compatibilidade - ✅ Compatível com versão anterior - ✅ Não requer reinstalação - ✅ Dados antigos são preservados ### Migração - Não é necessária nenhuma ação do usuário - O cache será criado automaticamente na próxima análise - Pipe IDs serão capturados na próxima visita à página de flows ### Recomendações - Recarregue a extensão em `chrome://extensions/` após atualizar - Limpe o cache do navegador se encontrar problemas - Teste em um pipe antes de usar em produção --- **Versão:** 1.8.1 **Data:** 05 de Fevereiro de 2026 **Desenvolvido com ❤️ para facilitar a análise do Pipefy iPaaS**