DG Pipefy Usage Statistics

About

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**