AG Grid Refactor

Status: Phases 1-3 and Visual fixes complete. Phases 4-5 and data integrity fixes pending. Created: 2026-02-23 Repository: arda-frontend-app

Goal

Restore normal AG Grid behavior throughout the application by eliminating racing state, memory leaks, and visual glitches in the existing data grid components.

What Was Completed

Phase 1 — Stop the Bleeding (complete)

Eliminated active runtime bugs:

Removed exportDataAsExcel call that caused runtime crashes (Enterprise API not registered).
Added destroy() to 5 select editors and BreadcrumbSize that were leaking focus listeners on every cell edit.
Fixed deprecated API warnings appearing on every grid mount.

Phase 2 — State Ownership (complete)

Resolved the core state management problem where multiple code paths competed to write the same data:

Unified column persistence to a single owner (enableColumnStatePersistence={false} on secondary locations). Eliminated racing writes to localStorage.
Unified column visibility to a single source of truth. Removed hide from baseColumnDefs to eliminate flicker and View dropdown bugs.
Removed redundant setTimeout save calls.
Memoized column definitions to eliminate redundant localStorage reads on re-render.

Phase 3 — Selection and Rendering Performance (complete)

Replaced N-event select-all with api.setNodesSelected (single batch call).
Moved lastSelectedRowIndex from module-level variable (shared across grid instances) to instance ref.
Replaced inline cellRenderer lambdas on text columns with valueFormatter to avoid mounting React components per cell.

Visual Fixes (complete)

Extended row borders on horizontal scroll.
Fixed dropdown editor popup styling, inline editing border, and change listener.

Data Integrity — Skip-Publish Gap (complete)

Fixed skip-publish gap where a quick-action click on a dirty row left the row stranded without a publish.

What Remains

Phase 4 — Edit-Refresh-Flicker Loop

Switch Notes field updates from direct rowData mutation to applyTransaction.
Debounce onRefreshRequested to stop full table reloads after every single cell edit.
Replace 20-retry polling loop for selection restore with onFirstDataRendered.

Phase 5 — Code Reduction

Unify the field-to-viewKey mapping that is currently written 4 times with inconsistencies.
Replace silently-ignored headerStyle prop with headerClass.
Fix click-outside listener to use React ref instead of document.querySelector (which targets the wrong grid when multiple grids exist).

Data Integrity (high priority)

Fix 5 bugs in publishRow that can silently drop user edits (stale snapshot, early dirty delete, silent block, early draft clear, double setTimeout).

Clean Patterns

Replace 5 custom select editors with agSelectCellEditor.
Remove display: none on sort indicators to restore visible sort.
Switch content columns from fixed width to flex: 1 + minWidth.
Change getRowId to use stable id/eId (not entityId).

Roadmap: In Progress