2.5 KiB
2.5 KiB
RPKI Explorer
RPKI Explorer is the SPA frontend for browsing ours RP rpki_query_service outputs.
Scope
Current MVP covers:
- Overview dashboard from latest run, stats, validation reasons, and top repositories.
- Repository -> publication point -> object lazy browser.
- Object detail with live object record, validation summary, lazy parsed/chain/list tabs, and validation explain.
- Exact URI lookup, raw download action, and object / publication point export actions.
Known backend-dependent limits:
- Parsed projection, raw download, and export success require
rpki_query_service --repo-bytes-db <path>. - Without repo bytes, the UI shows explicit unavailable/error states instead of fabricating data.
- VRP IP/prefix lookup is not part of this MVP and is tracked separately.
- Query service does not provide CORS headers; use a same-origin proxy.
Development
Start query service first:
rpki_2/rpki/target/llvm-cov-target/debug/rpki_query_service \
--query-db .scratch/rpki_explorer_m3_api/query-db \
--listen 127.0.0.1:19571
Start the Vite dev server with a proxy:
cd rpki_2/rpki/ui/rpki-explorer
npm install
RPKI_EXPLORER_API_TARGET=http://127.0.0.1:19571 npm run dev -- --port 5173
The Vite dev server proxies /api/v1/* to RPKI_EXPLORER_API_TARGET; default target is http://127.0.0.1:9557.
Production Build Preview
cd rpki_2/rpki/ui/rpki-explorer
npm run build
RPKI_EXPLORER_API_TARGET=http://127.0.0.1:19571 npm run preview -- --port 4173
For real deployment, serve dist/ through a static server or reverse proxy and route /api/v1/* to rpki_query_service on the same origin.
Validation
npm run typecheck
npm run lint
npm run build
npm audit --audit-level=high
npm run test:e2e
Playwright is intentionally configured with workers: 1. The current query service object endpoints use lazy report.json scans, so parallel browser tests can create artificial backend contention and false failures.
Screenshot Evidence
Milestone screenshots are stored under:
specs/develop/20260617/m*_playwright/
Directory Layout
src/api/ query-service client and TypeScript records
src/app/ app shell and top-level navigation state
src/components/layout/ sidebar/topbar shell
src/features/overview/ latest run overview dashboard
src/features/repositories repo -> PP -> object browser
src/features/object-detail live object detail and workflows
src/styles/globals.css MVP visual system