feat(frontend): add toggleable performance heat-map overlay

[PG1204]

What changes were proposed in this PR?

Adds a toggleable, canvas-level performance heat-map overlay (Layers -> Performance) that colors operators cold -> hot from the per-operator metrics captured in #5773. A read-only consumer of existing data and no backend
changes.

• Three views with bottleneck-oriented scoring:
  • Runtime: data + control processing time (matches the backend cost model)
  • Throughput: seconds per output row (slow producers are hotter)
  • I/O imbalance: |out − in| / (out + in), bounded to [0, 1] so an extreme amplifier can't dominate the scale
• Scoring/color helpers (pure, unit-tested): rawMetricForView, normalizeScores (log1p + min-max), scoreToColor (colorblind-safe ramp)
• Overlay layer modeled on the existing Grid/Regions/Workers pattern: a BehaviorSubject view stream on JointGraphWrapper, applied by the editor to the shared model (canvas + mini-map)
• Heat-map owns only the operator body fill, so it coexists with the execution-status border
• Legend showing the active view and its real min/max value range
• Hover tooltip with the operator's metric value + heat score
• Live recolor as stats stream in; restores default fills when toggled off

Note on size: this is one cohesive sub-issue (#5774); roughly 40% of the diff is unit tests.

Any related issues, documentation, discussions?

Closes #5774. Part of umbrella #5772. Follows RFC discussion #5216.

How was this PR tested?

New Vitest specs (scoring, color, recolor methods, and the menu toggle):
cd frontend && ng test --watch=false --include "/heatmap-scoring.spec.ts" --include "/heatmap-color.spec.ts" --include "/joint-ui.service.spec.ts" --include "/menu.component.spec.ts"

Also verified: tsc --noEmit (strict) clean, eslint ./src clean, Prettier clean, ng build succeeds, and the existing workflow-editor/menu specs still pass.

Manually tested in the workspace: ran a workflow, toggled Performance on, switched all three views (recolor + legend range update), verified the hover tooltip, toggled off (fills restore), and confirmed the mini-map mirrors the colors.

UI screenshots
Before:

After:

Was this PR authored or co-authored using generative AI tooling?

Generated-by: Claude Code (Anthropic Claude Opus 4.7)

[github-actions]

Automated Reviewer Suggestions

Based on the git blame history of the changed files, we recommend the following reviewers:

• Contributors with relevant context: @bobbai00, @kunwp1, @Yicong-Huang
  You can notify them by mentioning @bobbai00, @kunwp1, @Yicong-Huang in a comment.

[PG1204]

/request-review @Yicong-Huang

[codecov-commenter]

Codecov Report

❌ Patch coverage is 61.49425% with 67 lines in your changes missing coverage. Please review.
✅ Project coverage is 69.77%. Comparing base (0485d02) to head (88d174f).

Files with missing lines	Patch %	Lines
...onent/workflow-editor/workflow-editor.component.ts	31.81%	27 Missing and 3 partials ⚠️
...c/app/workspace/component/menu/menu.component.html	22.22%	14 Missing ⚠️
...mponent/heatmap-legend/heatmap-legend.component.ts	44.44%	9 Missing and 1 partial ⚠️
...onent/heatmap-legend/heatmap-legend.component.html	28.57%	5 Missing ⚠️
...ent/workflow-editor/workflow-editor.component.html	42.85%	4 Missing ⚠️
...c/app/workspace/service/heatmap/heatmap-scoring.ts	91.83%	2 Missing and 2 partials ⚠️

Additional details and impacted files

@@             Coverage Diff              @@
##               main    #6213      +/-   ##
============================================
- Coverage     69.83%   69.77%   -0.06%     
- Complexity     3380     3382       +2     
============================================
  Files          1142     1146       +4     
  Lines         44838    45013     +175     
  Branches       4949     4980      +31     
============================================
+ Hits          31311    31409      +98     
- Misses        11869    11943      +74     
- Partials       1658     1661       +3     

Flag	Coverage Δ		*Carryforward flag
access-control-service	70.00% <ø> (ø)		Carriedforward from 8770ab8
agent-service	76.76% <ø> (ø)		Carriedforward from 8770ab8
amber	66.66% <ø> (+0.01%)	⬆️	Carriedforward from 8770ab8
computing-unit-managing-service	9.97% <ø> (ø)		Carriedforward from 8770ab8
config-service	52.30% <ø> (ø)		Carriedforward from 8770ab8
file-service	63.97% <ø> (ø)		Carriedforward from 8770ab8
frontend	68.06% <61.49%> (-0.11%)	⬇️
notebook-migration-service	78.94% <ø> (ø)		Carriedforward from 8770ab8
pyamber	91.18% <ø> (ø)		Carriedforward from 8770ab8
workflow-compiling-service	55.14% <ø> (ø)		Carriedforward from 8770ab8

*This pull request uses carry forward flags. Click here to find out more.

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[Yicong-Huang]

Thanks @PG1204! I will take a look later on the code details.

@aglinxinyuan @xuang7 advises for UI (color, theme, etc)? any ideas to make it more good looking?

[aglinxinyuan]

The current UI looks good to me. Can you provide a gif shows the workflow running in action and how does the other two options look like?

[PG1204]

The current UI looks good to me. Can you provide a gif shows the workflow running in action and how does the other two options look like?

Hi @aglinxinyuan, here's a screen recording gif of a running workflow with a look at all three options.