feat(sbom): add Cryptography tab to SBOM Explorer detail page

[gildub]

Summary

Add a new "Cryptography" tab to the SBOM Explorer detail page that displays cryptographic assets for the selected SBOM using the existing crypto algorithm API filtered by SBOM ID.

• Add useFetchCryptoBySbom query hook with asset_type filtering
• Add CryptoBySbom component with KPI cards and two sub-tabs
• Register the tab in sbom-details.tsx

KPI cards

• Algorithms meeting PQC — percentage and count of compliant algorithms
• Classical algorithm share — percentage and count of classical-only (warning) algorithms

Algorithms sub-tab (default)

7-column table: Algorithm name (with parameter set subtitle), Primitive, Occurrences, Policy, Recommendation, Usage, Packages

Keys sub-tab

4-column table: Name, Type, Occurrences, Usage

Detail drawer

Reuses CryptoAlgorithmDetail from the main Cryptography page for algorithm/key detail view.

Jira: TC-5854

Test plan

• Lint passes (npm run lint -w client)
• All 123 tests pass (npm run test -w client)
• Manual verification: navigate to an SBOM detail page → Cryptography tab
• Verify KPI cards show correct PQC compliance and classical algorithm percentages
• Verify Algorithms sub-tab renders 7 columns with data
• Verify Keys sub-tab renders 4 columns with data
• Verify algorithm detail drawer opens on row click
• Verify parameter set subtitle appears for algorithms with parameterSetIdentifier
• Verify empty states when SBOM has no crypto assets

🤖 Generated with Claude Code

[sourcery-ai]

Reviewer's Guide

The PR introduces a URL-persisted CBOM tab in SBOM Explorer, backed by a new SBOM-scoped crypto query and a filterable, paginated table that displays cryptographic asset details, policy status, and empty/loading/error states, with focused unit coverage.

Sequence diagram for SBOM CBOM tab data loading

sequenceDiagram
    actor User
    participant SbomDetails
    participant CbomBySbom
    participant useFetchCryptoBySbom
    participant CryptoAPI

    User->>SbomDetails: select CBOM tab
    SbomDetails->>SbomDetails: useTabControls
    SbomDetails->>CbomBySbom: render with sbomId
    CbomBySbom->>useFetchCryptoBySbom: useFetchCryptoBySbom(sbomId, params)
    useFetchCryptoBySbom->>CryptoAPI: GET /api/v3/crypto/algorithm with sbom_id
    CryptoAPI-->>useFetchCryptoBySbom: crypto assets and total
    useFetchCryptoBySbom-->>CbomBySbom: data, total, fetchError
    CbomBySbom-->>User: filterable paginated CBOM table

Loading

File-Level Changes

Change	Details	Files
Adds a CBOM detail view with a reusable, server-backed crypto asset table.	Renders filterable and paginated cryptographic assets with asset metadata, primitive, OID fallback, policy status, and formatted properties. Uses existing table-control, loading/error, empty-state, filtering, and pagination components. Adds coverage for headers, rows, formatting, policy badges, pagination, and empty results.	client/src/app/pages/sbom-details/cbom-by-sbom.tsx client/src/app/pages/sbom-details/cbom-by-sbom.test.tsx
Integrates CBOM into SBOM detail navigation and URL-persisted tab state.	Adds CBOM after Models in the tab list and renders the view for the selected SBOM. Extends tab controls with the cbom key while retaining URL parameter persistence.	client/src/app/pages/sbom-details/sbom-details.tsx
Adds a query hook for fetching crypto assets associated with an SBOM.	Builds a query keyed by SBOM ID and request parameters. Appends an sbom_id filter to GET /api/v3/crypto/algorithm and exposes normalized data, totals, loading, errors, and refetching.	client/src/app/queries/crypto.ts

---

Tips and commands

Interacting with Sourcery

• Trigger a new review: Comment @sourcery-ai review on the pull request.
• Continue discussions: Reply directly to Sourcery's review comments.
• Generate a GitHub issue from a review comment: Ask Sourcery to create an
  issue from a review comment by replying to it. You can also reply to a
  review comment with @sourcery-ai issue to create an issue from it.
• Generate a pull request title: Write @sourcery-ai anywhere in the pull
  request title to generate a title at any time. You can also comment
  @sourcery-ai title on the pull request to (re-)generate the title at any time.
• Generate a pull request summary: Write @sourcery-ai summary anywhere in
  the pull request body to generate a PR summary at any time exactly where you
  want it. You can also comment @sourcery-ai summary on the pull request to
  (re-)generate the summary at any time.
• Generate reviewer's guide: Comment @sourcery-ai guide on the pull
  request to (re-)generate the reviewer's guide at any time.
• Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
  pull request to resolve all Sourcery comments. Useful if you've already
  addressed all the comments and don't want to see them anymore.
• Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
  request to dismiss all existing Sourcery reviews. Especially useful if you
  want to start fresh with a new review - don't forget to comment
  @sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

• Enable or disable review features such as the Sourcery-generated pull request
  summary, the reviewer's guide, and others.
• Change the review language.
• Add, remove or edit custom review instructions.
• Adjust other review settings.

Getting Help

• Contact our support team for questions or feedback.
• Visit our documentation for detailed guides and information.
• Keep in touch with the Sourcery team by following us on X/Twitter, LinkedIn or GitHub.

[sourcery-ai]

Hey - I've reviewed your changes and they look great!

Sourcery assessment

Approved.

---

Sourcery is free for open source - if you like our reviews please consider sharing them ✨

• X
• Mastodon
• LinkedIn
• Facebook

[codecov]

Codecov Report

❌ Patch coverage is 86.20690% with 12 lines in your changes missing coverage. Please review.
✅ Project coverage is 57.18%. Comparing base (ba89f57) to head (2f657cc).

Files with missing lines	Patch %	Lines
client/src/app/queries/crypto.ts	56.25%	5 Missing and 2 partials ⚠️
...ient/src/app/pages/sbom-details/crypto-by-sbom.tsx	92.75%	5 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1251      +/-   ##
==========================================
+ Coverage   56.37%   57.18%   +0.80%     
==========================================
  Files         262      263       +1     
  Lines        5926     6014      +88     
  Branches     1884     1907      +23     
==========================================
+ Hits         3341     3439      +98     
+ Misses       2341     2335       -6     
+ Partials      244      240       -4     

Flag	Coverage Δ
e2e	69.71% <87.14%> (-0.45%)	⬇️
unit	18.33% <71.95%> (+1.12%)	⬆️

Flags with carried forward coverage won't be shown. 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:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.