Skip to content

Web Frontend -- Phase 15 Addendum

This addendum extends the Web Frontend Guided Demo and Phase 14 Addendum with Phase 15 unified object model, compliance heatmap, and federation topology features added to the React frontend.

Object Model Explorer

Unified Facade Browser

The new Object Model Explorer page (pages/ObjectModel.tsx) provides an interactive browser for the unified ModelFacade layer. Users can:

  • Browse all connected domain repositories
  • Search across models with vocabulary-mapped term normalization
  • View full entity representations with cross-model references
  • Compare entities across projects side by side

Vocabulary Mapping Inspector

A dedicated panel displays the active VocabularyMapping configuration:

Field Description
Source Term Original term from the source repository
Mapped Term Normalized term in the unified vocabulary
Confidence Mapping confidence score (0.0 -- 1.0)
Source Which project the mapping originates from

Evolution Stage Dashboard

A progress chart shows each connected model's evolution stage:

Stage Colour Description
Initial Grey No formal model defined
Defined Blue Schema and attributes documented
Managed Green Vocabulary mapped and versioned
Optimized Gold Full federation with provenance

Compliance Heatmap

Risk Tier Heatmap

The Compliance page now includes an interactive heatmap visualization (visualizations/ComplianceHeatmap.tsx) that displays:

  • Rows: Persona categories (20 categories)
  • Columns: EU AI Act article groups (Articles 6-15)
  • Cells: Colour-coded by compliance status (green/amber/red)

Heatmap Interactions

  • Hover: Shows finding count and severity breakdown
  • Click: Drills down to individual findings for that cell
  • Filter: Toggle risk tiers (HIGH, LIMITED, MINIMAL) to focus the view

NIST AI RMF Crosswalk

A secondary heatmap tab shows NIST AI RMF compliance mapped against the same persona categories, with a toggle to overlay the EU AI Act crosswalk for dual-regulation analysis.

Federation Topology

Network Graph

The new Federation page (pages/Federation.tsx) renders the ecosystem topology as an interactive force-directed graph:

  • Nodes: Each ecosystem project (sized by entity count)
  • Edges: Cross-namespace references (weighted by reference count)
  • Clusters: Projects grouped by federation maturity stage

Topology Metrics

Metric Description
Total Namespaces Number of registered project namespaces
Cross-References Total cross-namespace entity references
Resolution Rate Percentage of references successfully resolved
Avg Confidence Mean confidence score across all resolutions

Real-Time Updates

Federation topology events (federation.namespace.registered, federation.entity.resolved, federation.change.tracked) are streamed via WebSocket and update the graph in real time.

The sidebar navigation adds three new entries for Phase 15:

  • Object Model -- Unified facade browser and evolution dashboard
  • Compliance Heatmap -- Risk heatmap with drill-down (nested under Compliance)
  • Federation -- Ecosystem topology and cross-reference explorer

Tips

  • Use the object model explorer to understand cross-project entity overlap
  • Filter the compliance heatmap by risk tier to focus remediation efforts
  • Watch the federation topology update in real time during pipeline runs