git.stella-ops.org/docs/ui-analysis/01_SHELL_AND_NAVIGATION.md

Stella Ops UI Structure - Part 1: Shell & Navigation

Technology Stack

• Framework: Angular 17+ (standalone components, signals)
• Routing: Angular Router with lazy-loaded modules
• Styling: SCSS
• Architecture: Feature-based module organization under src/app/features/
• Location: src/Web/StellaOps.Web/

---

1. MAIN SHELL & HEADER

┌─────────────────────────────────────────────────────────────────────────────────┐
│ [QUICKSTART BANNER - visible only in demo/offline mode]                         │
├─────────────────────────────────────────────────────────────────────────────────┤
│ ┌─────────────┐ ┌─────────────────────────────────────────┐  ┌────────────────┐ │
│ │ StellaOps   │ │   HOME│ANALYZE│TRIAGE│POLICY│OPS│NOTIFY│  │ Fresh Auth     │ │
│ │ Dashboard   │ │       │ADMIN                            │  │ Tenant: xxx    │ │
│ │  (brand)    │ │                                         │  │ [User Menu ▼]  │ │
│ └─────────────┘ └─────────────────────────────────────────┘  └────────────────┘ │
├─────────────────────────────────────────────────────────────────────────────────┤
│ [BREADCRUMB: Dashboard > Section > Subsection]                                  │
├─────────────────────────────────────────────────────────────────────────────────┤
│                                                                                 │
│                         ┌─────────────────────────────────┐                     │
│                         │       <router-outlet />         │                     │
│                         │       (Page Content)            │                     │
│                         └─────────────────────────────────┘                     │
│                                                                                 │
└─────────────────────────────────────────────────────────────────────────────────┘
                                    │
              ┌─────────────────────┼─────────────────────┐
              ▼                     ▼                     ▼
    [Command Palette]      [Toast Container]     [Keyboard Shortcuts]

Shell Components (from app.component.html)

• app-navigation-menu - Main navigation
• app-user-menu - User dropdown
• app-breadcrumb - Breadcrumb navigation
• app-command-palette - Command palette (keyboard shortcut access)
• app-toast-container - Toast notifications
• app-keyboard-shortcuts - Keyboard shortcut handler

---

2. NAVIGATION MENU STRUCTURE

Source: src/app/core/navigation/navigation.config.ts

┌──────────────────────────────────────────────────────────────────────────────┐
│                           MAIN NAVIGATION                                     │
├──────────────────────────────────────────────────────────────────────────────┤
│                                                                              │
│  ┌──────────┐  ┌──────────┐  ┌──────────┐  ┌──────────┐  ┌──────────┐       │
│  │   HOME   │  │  ANALYZE │  │  TRIAGE  │  │  POLICY  │  │   OPS    │       │
│  │ [icon]   │  │ [icon] ▼ │  │ [icon] ▼ │  │ [icon] ▼ │  │ [icon] ▼ │       │
│  └────┬─────┘  └────┬─────┘  └────┬─────┘  └────┬─────┘  └────┬─────┘       │
│       │             │             │             │             │              │
│  ┌────▼─────┐  ┌────▼───────────────────┐ ┌────▼──────────┐ ┌─▼────────────┐│
│  │Dashboard │  │ • Scans & Findings     │ │ • Artifacts   │ │• SBOM Sources││
│  └──────────┘  │ • Vulnerabilities      │ │ • Exceptions  │ │• Quotas      ││
│                │ • SBOM Graph           │ │ • Audit       │ │  └→ Overview ││
│                │ • Lineage              │ │   Bundles     │ │  └→ Tenants  ││
│                │ • Reachability         │ │ • Risk        │ │  └→ Throttle ││
│                │ • VEX Hub              │ │   Profiles    │ │  └→ Forecast ││
│                │ • Unknowns             │ └───────────────┘ │  └→ Alerts   ││
│                │ • Patch Map            │                   │  └→ Reports  ││
│                └────────────────────────┘                   │• Dead-Letter ││
│                                                             │  └→ Dashboard││
│  ┌──────────┐  ┌───────────────────────────────────────────▲│  └→ Queue    ││
│  │  NOTIFY  │  │                      ADMIN (scoped)       ││• SLO Monitor ││
│  │ [icon]   │  │                                           ││  └→ Dashboard││
│  └────┬─────┘  └────┬──────────────────────────────────────┘│  └→ Alerts   ││
│       │             │                                       │  └→ Defs     ││
│  ┌────▼─────┐  ┌────▼───────────────────────────────────┐  │• Platform    ││
│  │Notific.  │  │ • Tenants      • OAuth Clients         │  │  Health      ││
│  │Panel     │  │ • Users        • Tokens                │  │• Feed Mirror ││
│  └──────────┘  │ • Roles        • Unified Audit Log     │  │  └→ Dashboard││
│                │ • Branding     • Notification Admin    │  │  └→ AirGap   ││
│                │ • Platform     • Trust Management      │  │• Offline Kit ││
│                │   Status       • Policy Governance     │  │• AOC Compli. ││
│                │ • Trivy DB     • Policy Simulation     │  │• Scheduler   ││
│                │ • Registry     • Issuer Directory      │  │• Doctor Diag ││
│                │   Tokens       • Scanner Ops           │  │              ││
│                └────────────────────────────────────────┘  └──────────────┘│
└──────────────────────────────────────────────────────────────────────────────┘

---

3. NAVIGATION GROUPS DETAIL

3.1 HOME Group

ID	Label	Route	Icon	Scopes
dashboard	Dashboard	/	dashboard	-

3.2 ANALYZE Group

ID	Label	Route	Icon	Scopes
findings	Scans & Findings	/findings	scan	-
vulnerabilities	Vulnerabilities	/vulnerabilities	bug	-
graph	SBOM Graph	/graph	graph	graph:read
lineage	Lineage	/lineage	git-branch	-
reachability	Reachability	/reachability	network	-
vex-hub	VEX Hub	/admin/vex-hub	shield-check	-
unknowns	Unknowns	/analyze/unknowns	help-circle	-
patch-map	Patch Map	/analyze/patch-map	grid	-

3.3 TRIAGE Group

ID	Label	Route	Icon	Scopes
artifacts	Artifact Workspace	/triage/artifacts	package	-
exceptions	Exception Queue	/exceptions	exception	-
audit-bundles	Audit Bundles	/triage/audit-bundles	archive	-
risk	Risk Profiles	/risk	shield	-

3.4 POLICY Group

ID	Label	Route	Icon	Scopes
policy-studio	Policy Studio	-	edit	-
├─ policy-editor	Editor	/policy-studio/packs	-	policy:author
├─ policy-simulate	Simulate	/policy-studio/simulate	-	policy:simulate
├─ policy-approvals	Approvals	/policy-studio/approvals	-	policy:review OR policy:approve
└─ policy-dashboard	Dashboard	/policy-studio/dashboard	-	policy:read
orchestrator	Jobs & Orchestration	/orchestrator	workflow	-

3.5 OPS Group

ID	Label	Route	Icon	Children
sbom-sources	SBOM Sources	/sbom-sources	database	-
quotas	Quota Dashboard	/ops/quotas	gauge	Overview, Tenant Usage, Throttle Events, Forecast, Alert Config, Reports
dead-letter	Dead-Letter Queue	/ops/orchestrator/dead-letter	alert-triangle	Dashboard, Queue Browser
slo-monitoring	SLO Monitoring	/ops/orchestrator/slo	activity	Dashboard, Alerts, Definitions
platform-health	Platform Health	/ops/health	heart-pulse	Dashboard, Incidents
feed-mirror	Feed Mirror & AirGap	/ops/feeds	mirror	Dashboard, Import Bundle, Export Bundle, Version Locks
offline-kit	Offline Kit	/ops/offline-kit	offline	Dashboard, Bundles, Verification, JWKS
aoc-compliance	AOC Compliance	/ops/aoc	shield-check	Dashboard, Guard Violations, Ingestion Flow, Provenance Validator, Compliance Report

3.6 NOTIFY Group

ID	Label	Route	Icon	Scopes
notifications	Notifications	/notify	notification	-

3.7 ADMIN Group (requires ui.admin scope)

ID	Label	Route	Icon	Notes
tenants	Tenants	/console/admin/tenants	building	-
users	Users	/console/admin/users	users	-
roles	Roles & Scopes	/console/admin/roles	key	-
clients	OAuth Clients	/console/admin/clients	app	-
tokens	Tokens	/console/admin/tokens	token	-
audit	Unified Audit Log	/admin/audit	log	Has children: Dashboard, All Events, Policy Audit, Authority Audit, VEX Audit, Integration Audit, Export
branding	Branding	/console/admin/branding	palette	-
platform-status	Platform Status	/console/status	monitor	-
trivy-db	Trivy DB Settings	/concelier/trivy-db-settings	database	-
admin-notifications	Notification Admin	/admin/notifications	bell-config	-
admin-trust	Trust Management	/admin/trust	certificate	-
policy-governance	Policy Governance	/admin/policy/governance	policy-config	-
policy-simulation	Policy Simulation	/admin/policy/simulation	test-tube	-
registry-admin	Registry Tokens	/admin/registries	container	-
issuer-trust	Issuer Directory	/admin/issuers	shield-check	-
scanner-ops	Scanner Ops	/ops/scanner	scan	-

---

4. USER MENU ITEMS

ID	Label	Route	Icon
profile	Profile	/console/profile	user
settings	Settings	/settings	settings

---

5. FEATURE MODULES COUNT

Total feature directories under src/app/features/: 77 modules

admin-notifications/    evidence-export/        policy-governance/      setup-wizard/
advisory-ai/            evidence-pack/          policy-simulation/      slo-monitoring/
ai-runs/                evidence-thread/        policy-studio/          snapshot/
aoc/                    exceptions/             proof/                  sources/
aoc-compliance/         feed-mirror/            proof-chain/            timeline/
audit-log/              findings/               proof-studio/           triage/
auth/                   graph/                  proofs/                 triage-inbox/
binary-index/           home/                   quota-dashboard/        trivy-db-settings/
change-trace/           integration-hub/        reachability/           trust-admin/
compare/                integrations/           registry-admin/         unknowns/
configuration-pane/     issuer-trust/           release-orchestrator/   unknowns-tracking/
console/                lineage/                releases/               verdicts/
console-admin/          notify/                 risk/                   vex-hub/
cvss/                   offline-kit/            runs/                   vex-studio/
dashboard/              opsmemory/              sbom/                   vuln-explorer/
deadletter/             orchestrator/           sbom-sources/           vulnerabilities/
doctor/                 platform-health/        scanner-ops/            welcome/
evidence/               policy/                 scans/
                        policy-gates/           scheduler-ops/
                                                scores/
                                                secret-detection/
                                                settings/