[CHAIN] fix(ui): re-fit attack-path viewport on filter and expand, harden minimap

[pfe-nazaries]

🔗 Part of Chained PRs

Field	Value
Feature Branch	PROWLER-1273/react-flow-migration
Main PR	#10686
Chain Position	5 (after PR4 / #10970)

Chain Overview

   ┌──────────────────────────────────────────────────────────────┐
   │ PR0  #10701  refactor(ui): normalize graph edge types        │
   └────────────────────────────┬─────────────────────────────────┘
                                │
   ┌──────────────────────────────────────────────────────────────┐
   │ PR1  #10705  refactor(ui): replace D3 with React Flow        │
   └────────────────────────────┬─────────────────────────────────┘
                                │
   ┌──────────────────────────────────────────────────────────────┐
   │ PR2  #10756  feat(ui): graph interactions + filtered view    │
   └────────────────────────────┬─────────────────────────────────┘
                                │
   ┌──────────────────────────────────────────────────────────────┐
   │ PR3  #10800  feat(ui): export, minimap, fullscreen polish    │
   └────────────────────────────┬─────────────────────────────────┘
                                │
   ┌──────────────────────────────────────────────────────────────┐
   │ PR4  #10970  test(ui): Vitest Browser coverage               │
   └────────────────────────────┬─────────────────────────────────┘
                                │
                                ▼
   ┌──────────────────────────────────────────────────────────────┐
   │ 📍 PR5  THIS PR — auto-fit + minimap                         │
   └────────────────────────────┬─────────────────────────────────┘
                                │
                                ▼
   ┌──────────────────────────────────────────────────────────────┐
   │ #10686  Main PR  feat(ui): D3 → React Flow → master          │
   └──────────────────────────────────────────────────────────────┘

---

Context

Follow-up polish on the React Flow migration based on review feedback against the previously merged chained PRs.

After interacting with the graph, three viewport regressions left the user staring at empty canvas and forced manual recovery via the Fit to Screen toolbar button:

1. Clicking a finding to enter the filtered view kept the previous viewport pointing at the old coordinates, so the filtered subgraph rendered off-screen.
2. Pressing Back to Full View also kept the viewport, leaving the restored full graph misaligned.
3. Expanding a resource whose findings were laid out beyond the framed area revealed nodes the user could not see.

The minimap viewport indicator (the rectangle that shows the area currently in view) was also nearly invisible against the dark theme.

---

Description

Changes:

• Auto-fit when isFilteredView toggles in either direction (finding click → filtered view, "Back to Full View" → full graph). Animated 300 ms re-fit, deferred to the next animation frame so React Flow has applied the new Dagre layout first.
• Auto-fit on resource expansion only when at least one of the newly revealed findings sits entirely past one of the viewport edges. Partially clipped edge nodes are left alone, and collapsing a resource never re-fits — the user keeps their current framing whenever nothing has actually moved off-screen.
• Auto-fit padding is asymmetric (extra room on the right and bottom) so fitted nodes never land underneath the bottom-right minimap panel.
• Minimap mask is darkened (higher contrast) and the viewport indicator's stroke colour and width are bumped, so the rectangle is visible against the dark theme background.
• Browser-mode coverage for the new behaviours under a new auto-fitting the viewport describe block: minimap stroke is visible, expansion re-fits when revealed findings fall off-screen, filter on/off both re-fit. New viewportTransform and minimapMaskStrokeWidth getters on AttackPathPageHarness.

---

Steps to review

1. Run a query, click any finding — the filtered subgraph should animate to fill the canvas (no need to press Fit to Screen).
2. From the filtered view, click Back to Full View — the full graph should animate back to a fitted framing.
3. Expand a resource whose findings sit off-screen — the viewport should re-fit so the newly revealed findings are visible. Collapse the resource — the viewport should stay where it is.
4. With the dark theme active, pan/zoom the canvas — the rectangle in the minimap should clearly indicate which portion of the graph is visible.
5. pnpm test:browser -- --run attack-paths-page (the four auto-fitting the viewport tests cover the regressions).

---

Checklist

Community Checklist

• This feature/issue is listed in here or roadmap.prowler.com
• Is it assigned to me, if not, request it via the issue/feature in here or Prowler Community Slack

• Review if the code is being covered by tests.
• Review if code is being documented following this specification https://github.com/google/styleguide/blob/gh-pages/pyguide.md#38-comments-and-docstrings
• Review if backport is needed.
• Review if is needed to change the Readme.md
• Ensure new entries are added to CHANGELOG.md, if applicable.

UI

• All issue/task requirements work as expected on the UI
• Screenshots/Video of the functionality flow (if applicable) - Mobile (X < 640px)
• Screenshots/Video of the functionality flow (if applicable) - Table (640px > X < 1024px)
• Screenshots/Video of the functionality flow (if applicable) - Desktop (X > 1024px)
• Ensure new entries are added to CHANGELOG.md, if applicable.

License

By submitting this pull request, I confirm that my contribution is made under the terms of the Apache 2.0 license.