Mover campo “Agrupar por” para fora do bloco de filtros

[VanderleiDenir]

📌 Contexto Atual

Nas telas de pesquisa de Cota Parlamentar (CotaParlamentar.tsx) e Folha de Pagamento (FolhaPagamento.tsx), o campo "Agrupar por" está localizado dentro do bloco de filtros (dentro do <Card> que é exibido/ocultado pelo botão "Mostrar filtros").

Estrutura Atual

┌─────────────────────────────────────┐
│  Botão "Mostrar filtros"            │
├─────────────────────────────────────┤
│  ┌───────────────────────────────┐  │
│  │  Card de Filtros              │  │
│  │  - Legislatura/Ano            │  │
│  │  - Parlamentar                │  │
│  │  - Tipo de Despesa            │  │
│  │  - Estado                     │  │
│  │  - Partido                    │  │
│  │  - Fornecedor                 │  │
│  │  ─────────────────────────    │  │
│  │  → AGRUPAR POR (RadioGroup)   │  │ ← Deve sair daqui
│  │  ─────────────────────────    │  │
│  │  [Botão "Pesquisar"]          │  │
│  └───────────────────────────────┘  │
└─────────────────────────────────────┘
│  Lista de Resultados                │
└─────────────────────────────────────┘

---

🎯 Objetivo

1. Mover o campo "Agrupar por" para fora do bloco de filtros
2. Fixar o campo abaixo do botão "Mostrar filtros" e acima da lista de resultados
3. Sempre visível - independente se os filtros estão expandidos ou não
4. Acionar pesquisa automática ao selecionar uma opção de agrupamento

Nova Estrutura Desejada

┌─────────────────────────────────────┐
│  Botão "Mostrar filtros"            │
├─────────────────────────────────────┤
│  ┌───────────────────────────────┐  │
│  │  Card de Filtros (opcional)   │  │
│  │  - Legislatura/Ano            │  │
│  │  - Parlamentar                │  │
│  │  - Tipo de Despesa            │  │
│  │  - Estado                     │  │
│  │  - Partido                    │  │
│  │  - Fornecedor                 │  │
│  │  [Botão "Pesquisar"]          │  │
│  └───────────────────────────────┘  │
├─────────────────────────────────────┤
│  → AGRUPAR POR (fixo)               │ ← Nova posição
├─────────────────────────────────────┤
│  Lista de Resultados                │
└─────────────────────────────────────┘

---

✅ Requisitos Funcionais

ID	Requisito
RF01	O campo "Agrupar por" deve ficar fora do <Card> de filtros
RF02	O campo deve ficar sempre visível, mesmo com filtros recolhidos
RF03	Ao selecionar uma opção de agrupamento, deve acionar a pesquisa automaticamente (sem precisar clicar em "Pesquisar")
RF04	Manter o mesmo visual atual (RadioGroup com ícones e cards selecionáveis)
RF05	Manter o modal de "Agrupar por" que aparece ao clicar em uma linha da tabela

---

📁 Arquivos para Modificação

Arquivo	Componente
OPS.Site/src/pages/CotaParlamentar.tsx	Cota Parlamentar (Deputados e Senadores)
OPS.Site/src/pages/FolhaPagamento.tsx	Folha de Pagamento (Deputados e Senadores)

---

🔧 Mudanças Técnicas Sugeridas

1. Mover o RadioGroup "Agrupar por"

• De: Dentro do <Card className="shadow-xl border-0 bg-card/80 backdrop-blur-sm overflow-hidden">
  • Linha ~599 em CotaParlamentar.tsx
  • Linha ~681 em FolhaPagamento.tsx
• Para: Após o Card de filtros e antes da seção de paginação/tabela

2. Remover dependência do showFilters

O RadioGroup não deve estar dentro do bloco condicional {showFilters && (...)}

3. Adicionar auto-pesquisa

No onValueChange do RadioGroup, chamar handleSearch() após atualizar o estado:

<RadioGroup
  value={selectedFilters.agrupamento}
  onValueChange={(value) => {
    setSelectedFilters(prev => ({ ...prev, agrupamento: value }));
    handleSearch(); // ← Adicionar isto
  }}
>
  {/* ... options */}
</RadioGroup>

4. Manter o Modal

O Dialog/modal que abre ao clicar em uma linha da tabela deve permanecer inalterado.

---

✔️ Critérios de Aceite

• Campo "Agrupar por" visível mesmo com filtros recolhidos
• Campo posicionado entre os filtros e a lista de resultados
• Seleção de agrupamento aciona pesquisa automaticamente
• Visual do RadioGroup mantido (cards com ícones)
• Modal de agrupamento por linha continua funcionando
• URL atualizada corretamente com parâmetro Agrupamento
• Funciona em todas as variações: Deputado Federal, Deputado Estadual, Senador

---

📝 Observações

1. Não remover a lógica do modal (handleAgrupamentoChange) - ela é usada quando o usuário clica em uma linha específica da tabela para reagrupar com filtros contextualizados

2. Manter a integração com a URL (query params) para compartilhamento de links

3. Testar em mobile para garantir que o layout responsivo funcione corretamente

---

🔗 Referências

• Telas de exemplo:
  • https://ops.org.br/#/deputado-federal/ceap
  • https://ops.org.br/#/senador/folha-pagamento