Auditoria de código · vivo-poc3-prototipo-v2

Visão em árvore: existe e está funcional

Verificação solicitada: "temos visão em árvore nesse projeto?". Resultado: sim — implementada em Inventario.dc.html no modelo react-arborist (linhas achatadas, uma flex row por nó). O outro protótipo, Vivo-Inventario.dc.html, não possui árvore.

Confirmado ~/dev/vivo-poc3-prototipo-v2 verificado em 07/07/2026

Arquivos verificados

Busca por tree, treeitem, árvore em todos os HTML/JS do projeto vinculado.

Arquivo	Árvore	Observação
`Inventario.dc.html`	Sim	Árvore do site com busca, filtro, teclado e comparação de referências
`Vivo-Inventario.dc.html`	Não	Zero ocorrências de tree/árvore
`inventory-data.js`	fonte de dados	Nós com `parentId` — a hierarquia nasce aqui, não no DOM

Como a árvore é construída

Padrão react-arborist: a hierarquia é achatada em linhas antes de renderizar — nenhum aninhamento recursivo de DOM.

Dados planos com parentId

inventory-data.js expõe nós de inventário (Site, EE, Medidor, FCC, BBU…) referenciando o pai por id.

Mapa childrenOf

Na linha 1083, um único passe agrupa filhos por pai: childrenOf[n.parentId].push(n.id).

Achatamento em treeRows

Percurso em profundidade respeitando expanded, filtro e busca; cada nó visível vira uma flex row com indent (linha 1571).

Render de uma row por nó

role="treeitem", chevron de expandir/recolher, contador "N itens" quando recolhido, foco por teclado (linhas 367–384).

Recursos presentes

Checklist do que a implementação já cobre.

Recurso	Evidência
Expandir / recolher por nó	r.onToggle · chevron por linha
Busca no site	treeSearch · "Buscar no site…"
Filtro de classes	treeFilter · setFilter()
Navegação por teclado	tabIndex + onKeyDown por row
Acessibilidade	role="treeitem" · aria-label
Contador de itens recolhidos	collapsedCount → "N itens"
Diff contra plano de referência	nós previstos marcados com +
Painel de ocupantes por ativo	children → occupants (linha 1169)

Referências de código

Onde olhar em Inventario.dc.html.

linha 365Comentário v6 — "árvore reconstruída — modelo react-arborist"
linhas 367–384Template da row: treeitem, chevron, contador de recolhidos
linha 1083Construção do mapa childrenOf a partir de parentId
linhas 1101–1105Percurso ordenado + visibilidade por filtro/busca
linha 1571Atribuição final: base.treeRows = rows · treeEmpty

Réplica interativa

Mesma mecânica da árvore verificada, com dados reais do domínio (site de telecom). Experimente buscar ou recolher.

Navegação: ↑↓ mover · → expandir · ← recolher. Nós com + são previstos no plano de referência (ainda não instalados).