Autonomous-Bug-Explorer/.ralph/specs/legacy/frontend-v2.md

ABE — Frontend v2 Specification

New pages and components to add

New Page: Settings (ruta: /settings)

Sections:

1. API Key — show current key, button to copy
2. Notifications — form to set Slack webhook URL and min severity (calls PATCH /api/config)
3. Default Exploration Config — form with default values for maxStates, maxDepth, delay, excluded paths
4. About — version, links to docs

Updated: NewSessionForm

Add fields:

• Allowed Domains (chips input, default: hostname of URL)
• Max States (number, default 50)
• Max Depth (number, default 5)
• Action Delay ms (number, default 500)
• Excluded Paths (chips input)
• Auth Type (select: none / cookies / headers / login_flow)
  • If login_flow: show loginUrl, usernameSelector, passwordSelector, submitSelector, username, password
  • If cookies: textarea for JSON cookie array
  • If headers: key-value pairs input
• Fuzzing enabled (toggle)
• Fuzzing intensity (select: low / medium / high)

Updated: Dashboard

Add stats bar at the top with 4 numbers:

• Total sessions
• Total anomalies found
• Critical/High anomalies (highlighted in red)
• Sessions running now

Updated: AnomalyList

Add filter bar:

• Filter by severity (multi-select: low, medium, high, critical)
• Filter by type (multi-select: http_error, js_exception, etc.)
• Filter by session (dropdown)
• Search by description (text input)
• Sort by: newest first / severity desc

Updated: AnomalyDetail

Add:

• Download button → downloads report.json
• Download MD button → downloads report.md
• Copy replay command button → copies abe replay --anomaly-id anom_xxx to clipboard

New Component: SeverityBadge

Reusable badge component used everywhere:

• critical → red bg, white text
• high → orange bg, white text
• medium → yellow bg, dark text
• low → blue bg, white text

New API endpoints needed (add to api-server spec)

PATCH /api/config

• Updates server config (slack webhook, min severity, defaults)
• Body: Partial
• Returns: updated ServerConfig

GET /api/config

• Returns current server config (without API key value)

GET /api/stats

• Returns: { totalSessions, totalAnomalies, criticalHighCount, runningSessions }
• Used by dashboard stats bar