Skip to content

feat(app): landing page + inspector (trace input, timeline, failures, report export)#43

Merged
sepehr-safari merged 1 commit into
mainfrom
feat/app-landing-inspector
Jul 7, 2026
Merged

feat(app): landing page + inspector (trace input, timeline, failures, report export)#43
sepehr-safari merged 1 commit into
mainfrom
feat/app-landing-inspector

Conversation

@sepehr-safari

Copy link
Copy Markdown
Member

Summary

Builds the landing page and the Inspector UI — the two flagship web features for v0.1.0.

Closes #27, Closes #28

Changes

Landing page (/)

  • Hero: tagline + description + CTA (Try Inspector, View on GitHub)
  • Features: inspect, detect, test, report
  • What it's not: not a CSMS, not a simulator, not a compliance tool
  • Architecture: package cards (core, scenarios, reporter, cli)
  • Quick start: CLI commands
  • Footer: GitHub, npm, docs, license

Inspector (/inspector)

  • Trace input: paste textarea, file upload (with size limit), sample scenario selector
  • Session timeline: clickable events with message type, action, timestamp, direction
  • Message inspector: raw message JSON, normalized fields, payload
  • Failure summary: severity emoji, description, suggested steps
  • Report export: download Markdown report via Blob
  • States: loading, empty, error (with non-sensitive messages)
  • Browser-local: all parsing happens client-side, no network calls with trace data

Security

  • No dangerouslySetInnerHTML — all rendering is React-safe
  • File size limit enforced (10 MB)
  • Input validation via Zod schemas in core package
  • No auto-upload of trace data
  • Non-sensitive error messages

Verification

  • pnpm lint — ✅
  • pnpm typecheck — ✅
  • pnpm test — ✅ (196 tests)
  • pnpm build — ✅ (all routes prerendered)
  • pnpm format:check — ✅

… report export)

Landing page (#27):
- Hero with CTA (Try Inspector, View on GitHub)
- Features section (inspect, detect, test, report)
- What it's not section (not CSMS, not simulator, not compliance tool)
- Architecture overview (package cards)
- Quick start (CLI commands)
- Footer (GitHub, npm, docs, license)

Inspector (#28):
- Trace paste textarea + file upload + sample scenario selector
- Session timeline (click events to inspect)
- Message inspector panel (raw + normalized fields, payload)
- Failure summary (severity, description, suggested steps)
- Markdown report export (download)
- Loading/empty/error states
- Browser-local processing only (all parsing client-side)

Closes #27, Closes #28
@sepehr-safari sepehr-safari added this to the v0.1.0 — Inspector MVP milestone Jul 7, 2026
@sepehr-safari sepehr-safari added type:feature New feature or enhancement package:app apps/web — single Next.js app labels Jul 7, 2026
@sepehr-safari sepehr-safari merged commit ed2e26d into main Jul 7, 2026
5 checks passed
@sepehr-safari sepehr-safari deleted the feat/app-landing-inspector branch July 7, 2026 23:41
@ocpp-debugkit ocpp-debugkit deleted a comment from netlify Bot Jul 7, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

package:app apps/web — single Next.js app type:feature New feature or enhancement

Projects

None yet

Development

Successfully merging this pull request may close these issues.

feat(app): inspector trace input + timeline + message inspector feat(app): landing page

1 participant