ligbox-ops-platform/docs/anais-referencia/20260610_OVERVIEW_DNS_UI_ASPECTOS.md

Anais de Referência — Overview, DNS Cloudflare e UI Desk

Data: 2026-06-10
Utilizador: Roger
Transcript Cursor: 161d3d86-8ce8-4a2d-86f7-424b69111cb3
Projeto: Ligbox Ops Platform · VM122 (10.10.10.122:8080)
Chat bruto: CHAT_BRUTO_LIGBOX_OPS_PLATFORM_OVERVIEW_DNS_UI_20260610.{txt,jsonl}

---

1. Resumo executivo

Sessão focada em UI/UX do Support Desk e Audit Overview:

1. Menu lateral redesenhado com ícones SVG inline (não imagens recortadas).
2. Overview clássico mantido — cards = tenants (não empresas individuais).
3. Modal de detalhe por tenant com lista de domínios, timeline, checks, IP de acesso.
4. Novo menu Overview Home (estilo Cloudflare) — sem apagar o Overview original.
5. Card Apontamentos DNS (Cloudflare) via API — integrado na linha de métricas (Security · Performance · Activity · DNS).
6. Correção de bug: DNS descartado quando scorecard falhava (Promise.all).

---

2. Infraestrutura e deploy

Item	Valor
Host	VM122 ligbox-ops
URL Desk	http://10.10.10.122:8080
Compose	docker-compose.mvp.yml
Frontend	container ligbox-ops-platform_frontend_1 (nginx)
API	container ligbox-ops-platform_api_1
Código ativo	./frontend/ e ./api/ (não a raiz /opt/ligbox-ops-platform/index.html)

Rebuild obrigatório após alterações frontend/API:

cd /opt/ligbox-ops-platform
docker-compose -f docker-compose.mvp.yml up -d --build frontend
# Se API mudou:
docker-compose -f docker-compose.mvp.yml up -d --build api frontend

Cache bust: index.html usa query ?v=20260610dns3 em styles.css e app.js.

---

3. Menu lateral

Pedido Roger

• Referência visual: frontend/menu lateral__dashboard.png
• Ícones separados, construídos como elementos (SVG), não PNG recortado.
• Espaçamento vertical compacto sem reduzir tamanho dos ícones.
• Modelo premium dos ícones: aceitável “por hora”.

Implementação

• SVG symbols em frontend/index.html (#icon-dashboard, #icon-overview, etc.)
• CSS em frontend/assets/styles.css (.nav-icon-wrap, .nav-icon-svg)
• Variáveis: --sidebar-w, --nav-icon-col, min-height dos botões reduzido progressivamente

Ficheiros

• frontend/index.html
• frontend/assets/styles.css

---

4. Overview clássico (mantido)

Modelo de dados

• 1 card = 1 tenant (ex.: VM112, VM104)
• 25 empresas em onboarding no mesmo tenant → 1 card com domínios agregados
• Resposta esperada Roger: 2 cards para tenants distintos, não 25 cards

Modal tenant (openOverviewModal)

• Endpoint: GET /api/v1/audit/tenants/{id}/details
• Lista domínios clicáveis
• Resumo: total, em execução, concluídos, falharam, com erros

Modal domínio (openOverviewDomainDetail)

• Scorecard: GET /api/v1/audit/tenants/{id}/scorecard?domain=...
• Timeline webhook com client_ip, email, timestamps
• Checks de auditoria
• Ticket associado (abrir em Tickets)
• DNS Cloudflare (secção dedicada)

Ficheiros backend

• api/app/audit_store.py — tenant_details(), scorecard
• api/app/main.py — rotas audit + webhook grava client_ip / ingress_client_ip

Ficheiros frontend

• frontend/assets/app.js — openOverviewModal, renderOverviewModalList, openOverviewDomainDetail
• frontend/index.html — #overview-modal
• frontend/assets/styles.css — .overview-domain-row, .modal-panel-lg

---

5. Overview Home (novo — Cloudflare-style)

Menu

• Item Overview Home com badge novo
• View: overview-home (#view-overview-home)
• Overview original intacto em overview

Layout

• Toolbar período: 24h / 7d / 30d
• Linha de métricas (4 cards):
  1. Security — domínios com alertas, eventos Wazuh
  2. Performance — checks pass %, degraded/critical
  3. Activity — onboarding em execução, webhooks
  4. Apontamentos DNS (Cloudflare) — card interativo
• Painéis: Domains, Audit trail, Infra nodes, Next steps

Interação DNS na linha de processos

• Clique em domínio (Domains ou Audit trail) → carrega DNS no 4.º card
• Funções: showOverviewHomeDnsPanel(), htmlCloudflareDnsCardInline()
• Estado: state.overviewHomeDnsDomain

Ficheiros

• frontend/assets/app.js — renderOverviewHome(), buildOverviewHomeTrail()
• frontend/assets/styles.css — .cf-home*, .cf-metrics-row (4 colunas), .cf-dns-metric-card

---

6. DNS Cloudflare

API backend

• Módulo: api/app/cloudflare_dns.py
• Função: fetch_domain_dns(domain, email_service=...)
• Endpoint: GET /api/v1/dns/cloudflare/records?domain=...&email_service=true|false
• Permissão: can_read_cloudflare_dns em api/app/permissions.py
  • Roles: super_admin, ops_lead, technician, noc

Tokens (.env)

CLOUDFLARE_API_TOKENS=EYH0ZbKTI41f1O0EoW5uxGUUCA3-Fsrt6b4-1xYJ,UBvRO4URpoGPH-vgjVRfKWOpklvmD9vV9PRX43mP

Classificação de registos

• mx, spf, dkim, dmarc, mail-host, autodiscover, mail-alias, other
• Filtro por domínio na zona pai Cloudflare
• email_service=true quando tenant_id=1 ou etapa funil de e-mail

Testes validados (API via nginx :8080)

Domínio	Resultado
itecnologys.com	56 registos
ligbox.com.br	18 registos
diarissima.com	Zona não encontrada (sem token/zona)

Bug corrigido (2026-06-10)

• Antes: Promise.all([scorecard, dns]) — falha do scorecard descartava DNS
• Depois: fetchCloudflareDns() independente; sempre exibe card (dados ou erro)

Teste rápido

TOKEN=$(curl -s -X POST "http://10.10.10.122:8080/api/v1/auth/login" \
  -H "Content-Type: application/json" \
  -d '{"username":"root","password":"<senha>"}' | python3 -c "import sys,json; print(json.load(sys.stdin)['access_token'])")

curl -s "http://10.10.10.122:8080/api/v1/dns/cloudflare/records?domain=itecnologys.com&email_service=true" \
  -H "Authorization: Bearer $TOKEN" | python3 -m json.tool | head -30

---

7. Mapa de ficheiros alterados (sessão)

Área	Ficheiro	Alteração
Frontend	frontend/index.html	SVG menu, modal overview, view overview-home, cache bust
Frontend	frontend/assets/app.js	Menu, overview modal, overview home, DNS fetch/card
Frontend	frontend/assets/styles.css	Sidebar, cf-home, DNS tables, metrics 4-col
API	api/app/main.py	Rota DNS Cloudflare, webhook IP
API	api/app/cloudflare_dns.py	Novo — integração Cloudflare
API	api/app/audit_store.py	tenant details, scorecard
API	api/app/permissions.py	can_read_cloudflare_dns
Config	.env	CLOUDFLARE_API_TOKENS

---

8. Decisões e pendências

Tema	Estado
Overview vs Overview Home	Roger a decidir qual manter
Ícones premium (referência PNG)	Aceitável por hora; melhorar depois
Domínios sem zona CF	Adicionar tokens/zones (diarissima.com, *.ligbox)
AUD collectors DNS	Parcial no backlog

---

9. Pedidos Roger (cronologia)

1. Menu lateral — ícones recortados/pequenos → SVG separado
2. “Não mudou nada” → rebuild Docker
3. Compactar espaço vertical do menu
4. Cards Overview = tenants?
5. 25 empresas → quantos cards? → 1 por tenant
6. Modal com domínios, timestamps, erros, IP
7. Tela estilo Cloudflare para Audit → Overview Home
8. Criar Overview Home sem destruir atual
9. Card DNS Cloudflare para gestão de domínio/e-mail
10. “Não está exibindo” → fix Promise.all + painel visível
11. Colocar card DNS na linha Security/Performance/Activity
12. Salvar aspectos + chat bruto nos anais de referência (este documento)

---

10. Canais de arquivo (chat bruto + anais)

Canal	Caminho
VM122 principal	/root/ligbox-ops-platform-chat-bruto/
Anais VM122	/root/ligbox-ops-platform-chat-bruto/anais-referencia/
Projeto	/opt/ligbox-ops-platform/docs/anais-referencia/
Chat bruto projeto	/opt/ligbox-ops-platform/chat-bruto/
LAPTOP (staging scp)	/opt/ligbox-ops-platform/LAPTOP/
Obsidian VM112	/root/obsidian-infra/ligbox-ops-platform/ (se existir)

Regenerar chat bruto:

python3 /opt/ligbox-ops-platform/scripts/export-chat-bruto-standalone.py \
  /root/.cursor/projects/1781094241105/agent-transcripts/161d3d86-8ce8-4a2d-86f7-424b69111cb3/161d3d86-8ce8-4a2d-86f7-424b69111cb3.jsonl \
  CHAT_BRUTO_LIGBOX_OPS_PLATFORM_OVERVIEW_DNS_UI_20260610 \
  161d3d86-8ce8-4a2d-86f7-424b69111cb3

---

Documento gerado automaticamente na sessão Cursor — Ligbox Ops Platform.