mirror of https://github.com/dpup/meshstream.git synced 2026-03-28 17:42:37 +01:00

Files

Daniel Pupius 9e5fd5bcae Add code review findings as todos

Security and architecture review of current codebase. 11 findings:
- 3 P1 (XSS, hardcoded creds, unbounded memory growth)
- 4 P2 (SSE protocol, broker deadlock, NetworkMap architecture, CORS)
- 4 P3 (security headers, error leakage, dead code, binary payload)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

2026-03-15 15:41:24 +00:00

2.8 KiB

Raw Blame History

status, priority, issue_id, tags, dependencies

status

priority

issue_id

NetworkMap.tsx Functions Redeclared in Component Body Every Render

Problem Statement

initializeMap, updateNodeMarkers, createMarker, updateMarker, and showInfoWindow are declared inside the component function body without useCallback. They are redeclared on every render, cannot be properly listed in dependency arrays, and are the direct cause of the /* eslint-disable react-hooks/exhaustive-deps */ at the top of the file. The planned topology polyline feature will make this worse if it follows the same pattern.

Findings

File: web/src/components/dashboard/NetworkMap.tsx, lines 261-455, line 1 (eslint-disable)
tryInitializeMap useCallback (line 133) lists updateNodeMarkers and initializeMap in deps — but these change every render, defeating memoization
The eslint-disable suppression acknowledges the problem but doesn't fix it
Adding polyline management code to this pattern makes the component increasingly difficult to reason about

Proposed Solutions

Option A: Extract to module-level pure functions (Recommended)

Move functions that don't access component state/refs directly (e.g., getMarkerIcon, marker content builders) to module-level. Pass refs/state as parameters.

Pros: Cleanest; enables proper useCallback dependency arrays; allows tree-shaking
Effort: Medium
Risk: Low

Option B: Wrap all in useCallback with correct deps

Convert all functions to useCallback with proper dependency lists. Remove the eslint-disable.

Pros: Fixes the hook rules without restructuring
Cons: Still keeps large functions in the component body
Effort: Medium
Risk: Low

Option C: Leave as-is, document for topology addition

Accept the pattern and apply it consistently for topology polylines. Remove the eslint-disable only when refactoring later.

Effort: None now
Cons: Technical debt grows; makes the topology feature harder to test
Risk: Medium (ongoing)

Recommended Action

At minimum, do Option A for module-level pure helpers before adding topology polyline code. The topology feature addition is a natural trigger for this cleanup.

Technical Details

Affected file: web/src/components/dashboard/NetworkMap.tsx
This should be addressed before or alongside the topology polyline rendering implementation

Acceptance Criteria

The /* eslint-disable react-hooks/exhaustive-deps */ comment is removed
All useCallback hooks have accurate, complete dependency arrays
Adding polyline management code does not require more eslint suppression

Work Log

2026-03-15: Identified by architecture-strategist review agent

2.8 KiB Raw Blame History