80 lines
3.1 KiB
Markdown
80 lines
3.1 KiB
Markdown
# Live Pulse Ticker & Contextual Intelligence Panels
|
||
|
||
> Added: 2026-02-20
|
||
|
||
## Overview
|
||
|
||
Rather than showing the same market data widgets on every tab (which creates UI fatigue), the dashboard now uses a **contextual intelligence** architecture:
|
||
|
||
- A **global Live Pulse Ticker** visible on all pages.
|
||
- **Tab-specific panels** that surface relevant data based on what the user is doing.
|
||
|
||
---
|
||
|
||
## Global: Live Pulse Ticker
|
||
|
||
**Component**: `src/components/LivePulseTicker.tsx`
|
||
**Location**: Persistent bar immediately below the sticky header (all tabs)
|
||
**Height**: 40px
|
||
|
||
### Contents
|
||
|
||
| Section | Description |
|
||
|:---|:---|
|
||
| **Market Pulse** (left) | Scrolling animated ticker of all tracked symbols with 24h % change (green = up, red = down) |
|
||
| **AI Top Picks** (right) | Top 3 symbols ranked by `AIAnalysisRule` confidence score |
|
||
|
||
### Design Rationale
|
||
- Provides a "Bloomberg Terminal" feel — the app feels alive and real-time at all times.
|
||
- Non-intrusive 40px height — never competes with primary tab content.
|
||
- The AI section only appears if `AIAnalysisRule` data is available; otherwise shows "SCANNING...".
|
||
|
||
---
|
||
|
||
## Marketplace Tab — Discovery Intelligence Panels
|
||
|
||
**Component**: `src/tabs/MarketplaceTab.tsx`
|
||
|
||
Two panels rendered above the strategy grid to help users find the right template:
|
||
|
||
### 🧠 Best AI Setups Panel
|
||
- Shows top 5 symbols with the highest AI confidence scores.
|
||
- Includes a color-gradient progress bar (hue shifts from yellow → green as confidence rises).
|
||
- Intended message: *"These markets are high-confidence right now — find a strategy to match."*
|
||
|
||
### 🔥 Top Volatile (24h) Panel
|
||
- Shows top 6 symbols sorted by absolute 24h % change.
|
||
- Displayed in a 2-column grid for compact scanning.
|
||
- Intended message: *"These markets are moving — match them with an aggressive or balanced strategy."*
|
||
|
||
---
|
||
|
||
## My Strategies Tab — Operational Intelligence Panels
|
||
|
||
**Component**: `src/tabs/MyStrategiesTab.tsx`
|
||
|
||
Two panels rendered between the header and strategy cards:
|
||
|
||
### Recent Activity Panel
|
||
- Shows the last 5 system `alerts` from `botState.alerts`.
|
||
- Each row: icon (🚀/⏰/⚠️/ℹ️) + symbol + message + relative time ("just now", "3m ago").
|
||
- Intended message: *"Here's what just happened to your bots."*
|
||
|
||
### Your Markets (24h) Panel
|
||
- Shows **only the symbols that the user's active strategies are currently trading**.
|
||
- Includes a mini bar chart showing the direction and magnitude of each move.
|
||
- Intended message: *"Here's how your specific markets are performing right now."*
|
||
- Personalized — empty state shows "Deploy a strategy to see its market data."
|
||
|
||
---
|
||
|
||
## UX Design Rationale
|
||
|
||
| Feature | Where | Why |
|
||
|:---|:---|:---|
|
||
| Live Pulse Ticker | All tabs | Keeps the app "alive" without cluttering content |
|
||
| 🧠 AI Setups | Marketplace only | Inspires strategy discovery |
|
||
| 🔥 Top Volatile | Marketplace only | Provides market context for template selection |
|
||
| Recent Activity | My Strategies only | Operational awareness without leaving the tab |
|
||
| Your Markets | My Strategies only | Personalized — only relevant symbols shown |
|