Demo Dashboard
Interactive Streamlit dashboard for testing and demonstrating the fraud detection system.
Starting the Dashboard
# Ensure the API is running first uvicorn src.api.main:app --reload --port 8000 # Start the dashboard streamlit run dashboard.py --server.port 8501
Open http://localhost:8501 in your browser.
Dashboard Layout
Sidebar: System Status
Real-time health indicators:
| Indicator | Description |
|---|---|
| System Status | Overall health (Healthy/Degraded/Down) |
| Redis | Velocity counter store connection |
| PostgreSQL | Evidence storage connection |
| Policy | Policy engine status |
| Policy Version | Current active policy version |
Main Area: Transaction Simulator
Attack Presets
One-click presets to demonstrate different fraud scenarios:
| Preset | Description | Expected Result |
|---|---|---|
| Normal Transaction | Typical $50 purchase | ALLOW |
| Card Testing Attack | Small $1 amount from datacenter IP | REVIEW or BLOCK |
| Velocity Attack | $1500 from new account | FRICTION or REVIEW |
| Geographic Anomaly | US card transacting from Nigeria | REVIEW |
| Bot/Emulator Attack | Emulated device via Tor | BLOCK |
| Friendly Fraud Risk | High-value from dispute-prone user | FRICTION |
Custom Transaction Fields
Fine-tune transaction parameters:
- Amount - Transaction value in USD
- Service ID - Telco service identifier
- Event Subtype - sim_activation, topup, device_upgrade, sim_swap, etc.
- Card Token - Tokenized card reference
- User ID - Customer identifier
- Device Emulator - Toggle emulated device flag
- Device Rooted - Toggle rooted/jailbroken flag
- IP Datacenter - Toggle datacenter IP flag
- IP Tor - Toggle Tor exit node flag
- IP VPN - Toggle VPN flag
Decision Display
Decision Badge
Large colored badge showing the decision:
| Decision | Color | Meaning |
|---|---|---|
| ALLOW | Green | Transaction approved |
| FRICTION | Yellow | Request additional verification |
| REVIEW | Orange | Queue for manual review |
| BLOCK | Red | Transaction declined |
Score Gauges
Four interactive gauge charts:
- Overall Risk - Combined risk score (0-100%)
- Criminal Score - Criminal fraud probability
- Friendly Fraud - Friendly fraud probability
- Bot Score - Automation detection score
Color thresholds:
- 0-30%: Green (low risk)
- 30-60%: Yellow (medium risk)
- 60-80%: Orange (elevated risk)
- 80-100%: Red (high risk)
Signal Details
Expandable section showing:
- Triggered detection signals
- Individual detector scores
- Feature values used in decision
- Policy rules that matched
Analytics Tab
Decision Distribution
Pie chart showing decision breakdown:
- Percentage of ALLOW vs FRICTION vs REVIEW vs BLOCK
- Updated in real-time as transactions are processed
Hourly Volume
Bar chart showing:
- Transaction volume per hour
- Decision distribution over time
- Useful for identifying attack patterns
Latency Metrics
Line chart displaying:
- P50 latency (median)
- P95 latency
- P99 latency
- Target threshold line (10ms)
Decision History Tab
Table showing recent decisions:
| Column | Description |
|---|---|
| Timestamp | When decision was made |
| Transaction ID | Unique identifier |
| Amount | Transaction value |
| Decision | ALLOW/FRICTION/REVIEW/BLOCK |
| Overall Risk | Combined risk score |
| Signals | Triggered detectors |
| Latency | Processing time |
Features:
- Sort by any column
- Filter by decision type
- Export to CSV
- Click row for full details
Policy Inspector Tab
Current Policy
Displays the active policy configuration:
version: "1.0"
thresholds:
block: 80
review: 60
friction: 40
rules:
- name: high_value_new_user
condition: amount > 500 AND user_age_days < 7
action: FRICTIONPolicy Actions
- View Full YAML - See complete policy file
- Reload Policy - Hot-reload from disk
- Version History - See previous policy versions
Demo Scenarios
Scenario 1: Normal Operations
- Select "Normal Transaction" preset
- Click "Submit Transaction"
- Observe
ALLOWdecision with low scores - View decision in history
Scenario 2: Card Testing Attack
- Select "Card Testing Attack" preset
- Submit multiple times rapidly
- Watch scores increase with each submission
- Eventually triggers
REVIEWthenBLOCK - Demonstrates velocity detection
Scenario 3: Bot Attack
- Select "Bot/Emulator Attack" preset
- Submit transaction
- Immediate
BLOCKdecision - View signals:
bot_detected,tor_exit_node
Scenario 4: Policy Change
- Edit
config/policy.yaml - Change
frictionthreshold from 40 to 30 - Click "Reload Policy" in dashboard
- Submit borderline transaction
- Observe changed decision behavior
Keyboard Shortcuts
| Shortcut | Action |
|---|---|
| Enter | Submit transaction |
| R | Reload policy |
| C | Clear form |
| H | Toggle history panel |
Tips for Demos
- Start clean - Reset Redis counters before demos
- Tell a story - Walk through attack - detection - block
- Show the numbers - Explain what scores mean
- Live reload - Demonstrate policy changes take effect instantly
- Show evidence - Pull up stored evidence for a blocked transaction