Skip to content

Feat Improve HTML report dependency rendering - #4

Merged
JosephMaynard merged 5 commits into
masterfrom
feat/improve-html-report
Feb 2, 2026
Merged

JosephMaynard merged 5 commits into
masterfrom
feat/improve-html-report

Conversation

@JosephMaynard

@JosephMaynard JosephMaynard commented Feb 2, 2026 •

Copy link
Copy Markdown
Owner

Summary by CodeRabbit

  • New Features

    • Root packages now show explicit name+version entries and link into dependency cards.
    • Copy-to-clipboard for raw JSON with copy feedback.
  • UI/UX Improvements

    • Lazy-loaded dependency details with animated loading placeholders.
    • Improved raw-data pane with scrollable area and a sticky copy button.
    • Enhanced package link styling, keyboard activation (Space), and better screen-reader feedback.

@coderabbitai

coderabbitai Bot commented Feb 2, 2026 •

Copy link
Copy Markdown
Contributor
📝 Walkthrough

Walkthrough

Root package tracking changed from plain names to objects with name+version across types, aggregator, and generated data. The report UI gained lazy-loaded dependency details, root-package linking, and JSON-copy UX; CSS was extended and report asset constants were exported.

Changes

Cohort / File(s) Summary
Type System
src/types.ts, report-ui/types.ts
Changed topRootPackages type from string[] to objects ({name, version}) or a union allowing both, updating public interfaces.
Aggregation Logic
src/aggregator.ts
Introduced RootPackageRef ({name,version}) and refactored root-cause tracking and related functions (findRootCauses, determineScope, determineIntroduction, buildOrigins) to use versioned refs.
UI Rendering & Interaction
report-ui/main.ts
Added dep key/dom-id helpers, renderRootPackageList, loading placeholder, lazy dependency-details rendering (ensureDepDetailsRendered, dep maps), JSON copy flow, root-package link activation, and keyboard support.
UI Styles
report-ui/style.css
New .raw-data-pane, .copy-json-btn, .dep-loading animation, .package-tag-link, sr-only and focus styles; improved raw-data scrolling and copy button behavior.
Sample & Generated Data
report-ui/sample-data.json, dependency-radar.json
Rewrote many topRootPackages entries from strings to { "name", "version" } objects and updated metadata (timestamp, branch).
Report Assets Exports
src/report-assets.ts
Exported CSS_CONTENT and JS_CONTENT constants (no content change).

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~60 minutes

Poem

🐰 I nibbled strings and found a shoe—

Now each package dons a versioned hue.
Lazy hops to details, clipboard in paw,
Links that scurry right where they saw.
A tidy refactor, a celebratory chew 🥕

🚥 Pre-merge checks | ✅ 2 | ❌ 1
❌ Failed checks (1 warning)
Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 8.70% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (2 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title accurately summarizes the main change: improving HTML report dependency rendering through structured package data and enhanced UI interactions.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing touches
  • 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch feat/improve-html-report

Comment @coderabbitai help to get the list of available commands and usage tips.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Fix all issues with AI agents
In `@report-ui/main.ts`:
- Around line 728-761: The issue is that linkableKeys is populated from
allDependencies so renderRootPackageList may render links to roots that are not
currently displayed; update the logic so linkability is computed from the
currently rendered set rather than allDependencies. Specifically, change where
linkableKeys is built (currently using depByKey/allDependencies) to compute a
Set of keys from the same input used by renderRootPackageList (e.g., the
filtered/current roots list) and pass that Set into renderRootPackageList and
ensureDepDetailsRendered (or recompute it inside those functions) so the UI only
renders links that actually exist in depByKey and are present in the current
rendered collection.

Comment thread report-ui/main.ts
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant