Add Observability UI for traces and metrics from MauiDevFlow-enabled apps

[Redth]

Summary

Add a new Observability experience to MAUI Sherpa for viewing traces + metrics from DevFlow-enabled MAUI apps inside Sherpa.

This issue tracks the Sherpa-side work for that feature.

Dependency

This work depends on MauiDevFlow exposing the observability data Sherpa needs:

• Depends on Redth/MauiDevFlow#41

For the first version, it is acceptable to require MauiDevFlow in the target app.

MVP direction

Use a MauiDevFlow-first approach instead of introducing a separate OTLP receiver, external dashboard, or Docker dependency.

That means Sherpa should:

• discover compatible apps through the existing DevFlow broker/agent model
• query/stream observability data from MauiDevFlow
• render a Sherpa-native UI for traces + metrics
• gracefully handle older agents that do not yet support the required capability

For the initial slice, the DevFlow-side implementation is expected to start with existing profiler spans and metrics, with deeper Activity / Meter capture potentially added later.

Proposed Sherpa scope

1. New top-level Observability page

Add a new page under Tools that shows:

• connected DevFlow apps/resources
• signal availability / capability status
• app filtering
• empty or upgrade-required states when observability support is unavailable

Likely files:

• src/MauiSherpa/Components/MainLayout.razor
• src/MauiSherpa.MacOS/MacOSApp.cs
• src/MauiSherpa/Pages/Observability.razor

2. Observability inspector UI

Add an inspector-style experience, similar to DevFlow, with tabs such as:

• Overview
• Traces
• Metrics

Likely files:

• src/MauiSherpa/Pages/Inspector/ObservabilityInspector.razor
• src/MauiSherpa/Pages/Inspector/ObservabilityTracesTab.razor
• src/MauiSherpa/Pages/Inspector/ObservabilityMetricsTab.razor

3. DevFlow client/model updates

Extend Sherpa’s DevFlow client and shared DevFlow models so Sherpa can consume the new MauiDevFlow observability contract.

Likely files:

• src/MauiSherpa.Core/Services/DevFlowAgentClient.cs
• src/MauiSherpa.Core/Models/DevFlow/DevFlowModels.cs

Responsibilities:

• capability detection
• replay/live streaming support
• trace and metric query methods
• mapping agent payloads into UI-friendly models
• graceful handling of older agents

4. Shortcut from App Inspector / DevFlow

Add a direct shortcut from the existing DevFlow inspector into the new Observability flow for the selected app.

Acceptance criteria

• Sherpa shows an Observability entry under Tools
• Sherpa can detect whether a connected DevFlow agent supports observability
• Sherpa can filter traces/metrics by connected app/resource
• Sherpa can render recent traces with span detail
• Sherpa can render recent metrics with useful summaries/trends
• Sherpa shows clear upgrade/capability messaging when an older agent is connected
• Sherpa includes a shortcut from App Inspector / DevFlow into Observability

Non-goals for the first version

• generic OTLP ingestion for non-DevFlow apps
• external dashboard integration as the primary path
• full logs ingestion as part of the first observability slice
• durable telemetry storage/history

Notes

If the DevFlow-first approach proves too limiting later, we can revisit a secondary path where Sherpa hosts a generic OTLP ingest helper. That is intentionally out of scope for this issue.