Files
git.stella-ops.org/docs/ui-analysis/02_HOME_AND_ANALYZE_SCREENS.md

34 KiB

Stella Ops UI Structure - Part 2: Home & Analyze Screens


1. HOME DASHBOARD

Route: / Component: HomeDashboardComponent Location: src/app/features/home/home-dashboard.component.ts

┌────────────────────────────────────────────────────────────────────────────────┐
│                          SECURITY DASHBOARD                                     │
│                                                        [Last updated] [Refresh]│
├────────────────────────────────────────────────────────────────────────────────┤
│                                                                                │
│  ┌─────────────────────────┐  ┌─────────────────────────┐  ┌─────────────────┐│
│  │    VULNERABILITIES      │  │     RISK OVERVIEW       │  │  REACHABILITY   ││
│  │         [View all →]    │  │        [View details →] │  │    [Explore →]  ││
│  ├─────────────────────────┤  ├─────────────────────────┤  ├─────────────────┤│
│  │ Critical ████████  245  │  │      ┌───────────┐      │  │    ┌───────┐   ││
│  │ High     ██████     89  │  │     /     72     \      │  │   /  75%   \   ││
│  │ Medium   ███████   156  │  │    │   SCORE     │      │  │  │ REACH.  │   ││
│  │ Low      ████       42  │  │     \   ↑ 5%    /       │  │   \        /   ││
│  │                         │  │      └───────────┘      │  │    └───────┘   ││
│  │   Total Findings: 532   │  │                         │  │                ││
│  │                         │  │ [Crit] [High] [Medium]  │  │ ● Reachable    ││
│  │                         │  │  12     34      89      │  │ ● Unreachable  ││
│  └─────────────────────────┘  └─────────────────────────┘  │ ● Uncertain    ││
│                                                            └─────────────────┘│
│                                                                                │
│  ┌─────────────────────────┐  ┌─────────────────────────┐  ┌─────────────────┐│
│  │   COMPLIANCE STATUS     │  │    ACTIVE POLICIES      │  │  RECENT SCANS   ││
│  ├─────────────────────────┤  ├─────────────────────────┤  ├─────────────────┤│
│  │ [Compliance metrics]    │  │ [Policy status list]    │  │ [Scan history]  ││
│  └─────────────────────────┘  └─────────────────────────┘  └─────────────────┘│
└────────────────────────────────────────────────────────────────────────────────┘

Dashboard Cards:

  • Vulnerabilities Summary (by severity with progress bars)
  • Risk Overview (circular score with trend indicator)
  • Reachability (donut chart with legend)
  • Compliance Status
  • Active Policies
  • Recent Scans

2. WELCOME PAGE

Route: /welcome Component: WelcomePageComponent Location: src/app/features/welcome/welcome-page.component.ts


3. ANALYZE SECTION

3.1 Scans & Findings

Route: /findings Component: FindingsContainerComponent Location: src/app/features/findings/container/findings-container.component.ts

Additional Route: /findings/:scanId

┌────────────────────────────────────────────────────────────────────────────────┐
│                       SCANS & FINDINGS                                          │
├────────────────────────────────────────────────────────────────────────────────┤
│ ┌──────────────────────────────────────────────────────────────────────────┐  │
│ │ [Search/Filter Bar]  [Severity ▼] [Source ▼] [Date Range] [Bulk Actions]│  │
│ └──────────────────────────────────────────────────────────────────────────┘  │
│ ┌──────────────────────────────────────────────────────────────────────────┐  │
│ │ [View Toggle: Diff-First | List | Timeline]                              │  │
│ └──────────────────────────────────────────────────────────────────────────┘  │
├────────────────────────────────────────────────────────────────────────────────┤
│ ┌──────────────────────────────────────────────────────────────────────────┐  │
│ │ ☐ │ Sev │ CVE ID        │ Package        │ Status   │ Reach. │ Actions   │  │
│ ├───┼─────┼───────────────┼────────────────┼──────────┼────────┼───────────┤  │
│ │ ☐ │ 🔴  │ CVE-2024-1234 │ log4j 2.14.1   │ Open     │ ✓ Yes  │ [...] [→] │  │
│ │ ☐ │ 🟠  │ CVE-2024-5678 │ spring 5.2.1   │ Triaged  │ ✗ No   │ [...] [→] │  │
│ │ ☐ │ 🟡  │ CVE-2024-9012 │ commons-io 2.4 │ Open     │ ? TBD  │ [...] [→] │  │
│ └──────────────────────────────────────────────────────────────────────────┘  │
│                                                                                │
│ [Pagination: < 1 2 3 ... 45 >]                                                 │
├────────────────────────────────────────────────────────────────────────────────┤
│ ┌─ BULK TRIAGE PANEL ──────────────────────────────────────────────────────┐  │
│ │ Selected: 3 items    [Accept Risk] [Create Exception] [Export] [Dismiss] │  │
│ └──────────────────────────────────────────────────────────────────────────┘  │
└────────────────────────────────────────────────────────────────────────────────┘
  • FindingsListComponent - List view
  • BulkTriageViewComponent - Bulk operations
  • AiChipRowComponent - AI-enhanced findings

3.2 Vulnerabilities

Route: /vulnerabilities Component: VulnerabilityExplorerComponent Location: src/app/features/vulnerabilities/vulnerability-explorer.component.ts

Detail Route: /vulnerabilities/:vulnId Component: VulnerabilityDetailComponent

┌────────────────────────────────────────────────────────────────────────────────┐
│                      VULNERABILITY EXPLORER                                     │
├────────────────────────────────────────────────────────────────────────────────┤
│ ┌──────────────────────────────────────────────────────────────────────────┐  │
│ │ 🔍 Search CVE/Package...  [Severity ▼] [CVSS ▼] [Exploited ▼] [Year ▼] │  │
│ └──────────────────────────────────────────────────────────────────────────┘  │
├────────────────────────────────────────────────────────────────────────────────┤
│ ┌────────────────────────────────────────────────────────────────────────────┐│
│ │ CVE ID        │ CVSS │ Severity │ Description           │ Exploited │ VEX  ││
│ ├───────────────┼──────┼──────────┼───────────────────────┼───────────┼──────┤│
│ │ CVE-2024-...  │ 9.8  │ Critical │ Remote code exec...   │ 🔴 Yes    │ ⚑    ││
│ │ CVE-2024-...  │ 7.5  │ High     │ SQL injection in...   │ ⚪ No     │      ││
│ │ CVE-2024-...  │ 5.0  │ Medium   │ Information disc...   │ ⚪ No     │ ⚑    ││
│ └────────────────────────────────────────────────────────────────────────────┘│
│                                                                                │
│ ┌─ VULNERABILITY DETAIL (slide-out) ───────────────────────────────────────┐  │
│ │ CVE-2024-1234                                          [Open in new tab] │  │
│ │ ─────────────────────────────────────────────────────────────────────── │  │
│ │ CVSS: 9.8 Critical                                                      │  │
│ │ Description: Remote code execution vulnerability in...                   │  │
│ │ Affected: [package@version list]                                         │  │
│ │ VEX Statements: [consensus status]                                       │  │
│ │ Reachability: [analysis results]                                         │  │
│ │ Fix Available: ✓ Yes - Upgrade to version X.X.X                         │  │
│ └──────────────────────────────────────────────────────────────────────────┘  │
└────────────────────────────────────────────────────────────────────────────────┘

3.3 SBOM Graph

Route: /graph Component: GraphExplorerComponent Location: src/app/features/graph/graph-explorer.component.ts Required Scope: graph:read

┌────────────────────────────────────────────────────────────────────────────────┐
│                          SBOM GRAPH EXPLORER                                    │
├────────────────────────────────────────────────────────────────────────────────┤
│ ┌──────────────────────────────────────────────────────────────────────────┐  │
│ │ [Search node...] [Filter by type ▼] [Depth: ▼] [Layout: ▼] [Zoom: ─●─] │  │
│ └──────────────────────────────────────────────────────────────────────────┘  │
├────────────────────────────────────────────────────────────────────────────────┤
│ ┌──────────────────────────────────────────────────────────────────────────┐  │
│ │                                                                          │  │
│ │                    ┌─────────┐                                           │  │
│ │           ┌────────┤ app-svc ├────────┐                                 │  │
│ │           │        └────┬────┘        │                                 │  │
│ │           ▼             │             ▼                                 │  │
│ │     ┌─────────┐         │       ┌─────────┐                             │  │
│ │     │ log4j   │◄────────┼──────►│ spring  │                             │  │
│ │     │ 🔴 vuln │         │       │ 🟠 vuln │                             │  │
│ │     └─────────┘         │       └────┬────┘                             │  │
│ │           │             │            │                                  │  │
│ │           ▼             │            ▼                                  │  │
│ │     ┌─────────┐    ┌────┴───┐  ┌─────────┐                             │  │
│ │     │ jackson │    │commons │  │ netty   │                             │  │
│ │     └─────────┘    └────────┘  └─────────┘                             │  │
│ │                                                                          │  │
│ │  [Legend: ● Package  🔴 Critical  🟠 High  🟡 Medium  ⚫ Low]           │  │
│ └──────────────────────────────────────────────────────────────────────────┘  │
├─ NODE DETAILS ─────────────────────────────────────────────────────────────────┤
│ │ Selected: log4j@2.14.1                                                   │  │
│ │ Type: Library │ License: BUSL-1.1 │ Dependencies: 12 │ Dependents: 45 │  │
│ │ Vulnerabilities: 3 Critical, 1 High                                      │  │
│ └──────────────────────────────────────────────────────────────────────────┘  │
└────────────────────────────────────────────────────────────────────────────────┘

3.4 Lineage

Route: /lineage Component: LineageGraphContainerComponent Location: src/app/features/lineage/components/lineage-graph-container/lineage-graph-container.component.ts

Sub-routes:

  • /lineage/:artifact/compare - Compare with artifact context
  • /lineage/compare - Legacy compare route
┌────────────────────────────────────────────────────────────────────────────────┐
│                          SBOM LINEAGE GRAPH                                     │
├────────────────────────────────────────────────────────────────────────────────┤
│ ┌──────────────────────────────────────────────────────────────────────────┐  │
│ │ [Artifact selector ▼] [Version A ▼] ⟷ [Version B ▼] [Compare]           │  │
│ └──────────────────────────────────────────────────────────────────────────┘  │
├────────────────────────────────────────────────────────────────────────────────┤
│                                                                                │
│    v1.0.0        v1.1.0        v1.2.0        v1.3.0                           │
│      ●─────────────●─────────────●─────────────●  (lineage timeline)          │
│      │             │             │             │                               │
│      │             │      ┌──────┴──────┐      │                               │
│      │             │      ▼             ▼      │                               │
│      │             │   hotfix-a     hotfix-b   │                               │
│      │             │      │             │      │                               │
│      │             │      └──────┬──────┘      │                               │
│      │             │             ▼             │                               │
│      │             │          v1.2.1           │                               │
│      │             │             │             │                               │
│      └─────────────┴─────────────┴─────────────┘                               │
│                                                                                │
├─ SMART DIFF ───────────────────────────────────────────────────────────────────┤
│ │ Comparing: v1.2.0 ⟷ v1.3.0                                               │  │
│ ├──────────────────────────────────────────────────────────────────────────┤  │
│ │ + Added:   3 packages       🔴 New CVEs: 2                               │  │
│ │ - Removed: 1 package        ✓ Fixed CVEs: 5                              │  │
│ │ ↻ Changed: 7 packages       ⚠ Degraded: 1                                │  │
│ └──────────────────────────────────────────────────────────────────────────┘  │
└────────────────────────────────────────────────────────────────────────────────┘

3.5 Reachability Center

Route: /reachability Component: ReachabilityCenterComponent Location: src/app/features/reachability/reachability-center.component.ts

┌────────────────────────────────────────────────────────────────────────────────┐
│                       REACHABILITY CENTER                                       │
├────────────────────────────────────────────────────────────────────────────────┤
│ ┌─ COVERAGE SUMMARY ───────────────────────────────────────────────────────┐  │
│ │  ┌────────────┐  ┌────────────┐  ┌────────────┐  ┌────────────┐         │  │
│ │  │ Total CVEs │  │ Reachable  │  │ Unreachable│  │ Uncertain  │         │  │
│ │  │    1,234   │  │    456     │  │    678     │  │    100     │         │  │
│ │  │            │  │   (37%)    │  │   (55%)    │  │    (8%)    │         │  │
│ │  └────────────┘  └────────────┘  └────────────┘  └────────────┘         │  │
│ └──────────────────────────────────────────────────────────────────────────┘  │
├────────────────────────────────────────────────────────────────────────────────┤
│ ┌─ REACHABILITY BY ARTIFACT ───────────────────────────────────────────────┐  │
│ │                                                                          │  │
│ │ Artifact              │ Total │ Reachable │ Unreachable │ Coverage    │  │
│ │ ─────────────────────┼───────┼───────────┼─────────────┼─────────────│  │
│ │ app-backend:latest   │ 45    │ 12        │ 28          │ ████░░ 62%  │  │
│ │ api-gateway:v2.3     │ 32    │ 8         │ 20          │ ███░░░ 50%  │  │
│ │ worker-svc:1.0.0     │ 78    │ 45        │ 25          │ ██████ 89%  │  │
│ │                                                                          │  │
│ └──────────────────────────────────────────────────────────────────────────┘  │
├─ CALL PATH VISUALIZATION ──────────────────────────────────────────────────────┤
│ │ Selected: CVE-2024-1234 in log4j                                         │  │
│ │                                                                          │  │
│ │  main() → processRequest() → Logger.log() → vulnerable_function()       │  │
│ │                                                                          │  │
│ └──────────────────────────────────────────────────────────────────────────┘  │
└────────────────────────────────────────────────────────────────────────────────┘

3.6 VEX Hub

Route: /admin/vex-hub Location: src/app/features/vex-hub/

Sub-routes:

Path Component
/admin/vex-hub VexHubDashboardComponent
/admin/vex-hub/search VexStatementSearchComponent
/admin/vex-hub/search/detail/:id VexStatementDetailComponent
/admin/vex-hub/stats VexHubStatsComponent
/admin/vex-hub/consensus VexConsensusComponent
/admin/vex-hub/explorer VexHubComponent
┌────────────────────────────────────────────────────────────────────────────────┐
│                            VEX HUB                                              │
├──────────────────┬─────────────────────────────────────────────────────────────┤
│ NAVIGATION       │                                                              │
│ ─────────────    │                                                              │
│ [Dashboard]      │  VEX DASHBOARD                                               │
│ [Search]         │  ───────────────────────────────────────────────────────── │
│ [Stats]          │  ┌──────────────┐ ┌──────────────┐ ┌──────────────┐        │
│ [Consensus]      │  │ Statements   │ │ Conflicts    │ │ Consensus    │        │
│ [Explorer]       │  │   1,234      │ │     12       │ │  Reached: 89%│        │
│                  │  └──────────────┘ └──────────────┘ └──────────────┘        │
│                  │                                                              │
│ AI FEATURES      │  ┌─ RECENT VEX STATEMENTS ────────────────────────────────┐ │
│ ─────────────    │  │ CVE ID       │ Product    │ Status        │ Issuer     │ │
│ [AI Explain]     │  │ CVE-2024-... │ app-svc    │ Not Affected  │ Vendor A   │ │
│ [AI Justify]     │  │ CVE-2024-... │ api-gw     │ Fixed         │ Vendor B   │ │
│ [AI Remediate]   │  │ CVE-2024-... │ worker     │ Under Invest. │ Internal   │ │
│                  │  └────────────────────────────────────────────────────────┘ │
│                  │                                                              │
│                  │  ┌─ CONFLICT RESOLUTION ──────────────────────────────────┐ │
│                  │  │ 12 conflicts pending review → [Resolve]                │ │
│                  │  └────────────────────────────────────────────────────────┘ │
└──────────────────┴─────────────────────────────────────────────────────────────┘

VEX Hub Components:

  • VexHubDashboardComponent
  • VexStatementSearchComponent
  • VexStatementDetailComponent
  • VexStatementDetailPanelComponent
  • VexHubStatsComponent
  • VexConsensusComponent
  • VexConflictResolutionComponent
  • VexCreateWorkflowComponent
  • AiConsentGateComponent
  • AiExplainPanelComponent
  • AiJustifyPanelComponent
  • AiRemediatePanelComponent

3.7 Unknowns Tracking

Route: /analyze/unknowns Location: src/app/features/unknowns-tracking/

┌────────────────────────────────────────────────────────────────────────────────┐
│                       UNKNOWNS TRACKING                                         │
├────────────────────────────────────────────────────────────────────────────────┤
│ ┌─ SUMMARY ────────────────────────────────────────────────────────────────┐  │
│ │ Unknown Components: 234  │  Unresolved PURLs: 45  │  Missing SBOMs: 12   │  │
│ └──────────────────────────────────────────────────────────────────────────┘  │
├────────────────────────────────────────────────────────────────────────────────┤
│ [Search...] [Type ▼] [Status ▼] [Source ▼]                                     │
├────────────────────────────────────────────────────────────────────────────────┤
│ │ Component Name    │ Type      │ First Seen  │ Status    │ Actions       │  │
│ ├───────────────────┼───────────┼─────────────┼───────────┼───────────────┤  │
│ │ unknown-lib-1.0   │ Library   │ 2024-01-15  │ Pending   │ [Match] [Ign] │  │
│ │ mystery-pkg       │ Package   │ 2024-01-14  │ Reviewing │ [Match] [Ign] │  │
│ │ vendor-binary.dll │ Binary    │ 2024-01-13  │ Matched   │ [View]        │  │
└────────────────────────────────────────────────────────────────────────────────┘

3.8 Patch Map

Route: /analyze/patch-map Component: PatchMapComponent Location: src/app/features/binary-index/patch-map.component.ts

Fleet-wide binary patch coverage heatmap visualization.


3.9 Scan Detail

Route: /scans/:scanId Component: ScanDetailPageComponent Location: src/app/features/scans/scan-detail-page.component.ts


3.10 CVSS Receipt

Route: /cvss/receipts/:receiptId Component: CvssReceiptComponent Location: src/app/features/cvss/cvss-receipt.component.ts


3.11 Compare View

Route: /compare/:currentId Component: CompareViewComponent Location: src/app/features/compare/components/compare-view/compare-view.component.ts