Files
cameleer-server/docs/superpowers/specs/2026-04-01-ux-audit-pmf-readiness.md
hsiegeln b73f5e6dd4
All checks were successful
CI / cleanup-branch (push) Has been skipped
CI / build (push) Successful in 1m3s
CI / docker (push) Successful in 1m11s
CI / deploy-feature (push) Has been skipped
CI / deploy (push) Successful in 49s
feat: add Logs tab with cursor-paginated search, level filters, and live tail
- Extend GET /api/v1/logs with cursor pagination, multi-level filtering,
  optional application scoping, and level count aggregation
- Add exchangeId, instanceId, application, mdc fields to log responses
- Refactor ClickHouseLogStore with keyset pagination (N+1 pattern)
- Add LogSearchRequest/LogSearchResponse core domain records
- Create LogSearchPageResponse wrapper DTO
- Add Logs as 4th content tab (Exchanges | Dashboard | Runtime | Logs)
- Implement LogSearch component with debounced search, level filter bar,
  expandable log entries, cursor pagination, and live tail mode
- Add cross-navigation: exchange header → logs, log tab → logs tab
- Update ClickHouseLogStoreIT with cursor, multi-level, cross-app tests

Closes: #104

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-02 08:47:16 +02:00

4.1 KiB

UX Audit: PMF Readiness for First Market Offer

Date: 2026-04-01 Epic: Gitea #100 Timeline: 8 weeks to first market offer (~2026-05-27)

Context

Comprehensive UX audit evaluating readiness for product-market fit. Full-stack Apache Camel observability platform competing with Datadog, Grafana+Tempo, Dynatrace. Self-hosted first, SaaS later.

Three target personas (all equally important):

  • Integration Developers -- debug message flows, trace exchanges, inspect payloads/errors
  • DevOps/Platform Engineers -- manage deployments, agent health, route control, config push
  • Engineering Managers / Tech Leads -- dashboards, SLA compliance, error trends

Competitive positioning: "General APM tools don't understand Camel. We do."

What's Working Well

  • Process diagram visualization -- killer differentiator, no APM tool shows Camel routes this way
  • Three-tab navigation (Exchanges/Dashboard/Runtime) maps cleanly to personas
  • Command palette (Ctrl+K) with categorized search is polished
  • Dashboard 3-level drill-down with KPIs, treemaps, punchcard heatmaps -- competitive-grade
  • Dark mode is clean and well-implemented
  • Design system gives visual consistency; amber/brown brand is distinctive
  • Route control bar (Start/Stop/Suspend/Resume/Replay) -- unique differentiator
  • Live auto-refresh with LIVE indicator
  • Correlation chain navigation

Issues Created

P0 -- Ship Blockers

  • #101 Onboarding & empty state experience (spec posted)
  • #102 Alerting & notification system (spec posted)
  • #103 Shareable links with filter state (spec posted)

P1 -- Must Have

  • #104 Log search experience (spec posted)
  • #105 Exchange table readability (spec posted)
  • #106 Latency outlier investigation path (spec posted)

P2 -- Should Have

  • #107 Data export CSV/JSON (spec posted)
  • #108 Sidebar consolidation & tab-awareness (spec posted)
  • #109 Dashboard L3 diagram readability (spec posted)
  • #110 Time/locale formatting consistency (spec posted)
  • #111 Pagination & deep result access (spec posted)

P3 -- Polish

  • #112 Admin page context separation (spec posted)
  • #113 Runtime suspended routes context (spec posted)
  • #114 App Config detail full page (spec posted)
  • #115 Comparative & historical analysis (spec posted)
Weeks Issues Focus
1-2 #103, #105, #110 Quick wins: shareable links, table readability, formatting
3-4 #101, #111 First-run experience, pagination
5-6 #102 Alerting (the big sticky feature)
7-8 #104, #106 Depth: log search, latency investigation

Design Specs

Full design specifications are posted as comments on each Gitea issue. Key architectural decisions:

#101 Onboarding

  • useOnboardingState() hook derives phase from existing useAgents() + useRouteCatalog() polling
  • Phases: welcome -> connected -> receiving -> complete -> dismissed
  • Framework-specific snippets (Spring Boot/Quarkus/Standalone x Maven/Gradle)
  • Bootstrap token via new GET /api/v1/admin/bootstrap-token (ADMIN only)
  • Per-page empty states using DS EmptyState component

#102 Alerting

  • PostgreSQL tables: alert_channels, alert_rules, alert_history, alert_rule_state
  • 7 built-in alert types querying ClickHouse MVs and agent registry
  • Evaluation engine: Spring @Scheduled, 10s loop, hysteresis, cooldown
  • 3 notification channels: webhook, email (SMTP), Slack
  • Bell icon in TopBar with firing count badge
  • New "Alerting" admin tab with Rules/Channels/History sub-tabs
  • URL as canonical source of truth, React state is derived mirror
  • UrlFilterSyncProvider wraps existing GlobalFilterProvider (no DS changes)
  • Filter changes = replaceState, navigation = pushState
  • Copy Link button with Ctrl+Shift+C shortcut
  • 9-step incremental rollout
  • New GET /api/v1/logs/search endpoint with cursor pagination and level counts
  • 4th tab: Logs, with search bar, level filter toggles, virtual-scrolled results
  • Search syntax: free text + field:value (level, app, logger, exchange, mdc.*)
  • Live tail via adaptive polling (2-5s)
  • Bidirectional exchange correlation