Trading Terminal

The TradeStaq Pro Trading Terminal is a professional-grade interface for manual trading with real-time market data, advanced charting, and instant order execution.

Overview

The trading terminal provides:

Real-Time Price Feeds - WebSocket-connected live prices
Advanced Charting - Multi-timeframe OHLCV charts
Quick Order Entry - One-click trading
Position Management - Live P&L tracking
Order History - Recent trades and fills
Keyboard Shortcuts - Lightning-fast execution

Accessing the Terminal

Navigate to Dashboard → Trading
Or use keyboard shortcut (if configured)
Terminal loads with last-used settings

Terminal Layout

┌─────────────────────────────────────────────────────────────────────┐
│  [Exchange ▼]  [🔍 Search Symbol]  $50,123.45  +2.34%  Balance: $10k │
├────────────────────────────────────┬────────────────────────────────┤
│                                    │                                │
│                                    │  ORDER ENTRY                   │
│                                    │  ┌────────────────────────────┤
│   TRADING CHART                    │  │ [LONG] [SHORT]             │
│                                    │  │                            │
│   [1m] [5m] [15m] [1h] [4h] [1d]   │  │ Type: [Market ▼]           │
│                                    │  │ Size: [____] BTC           │
│   ┌────────────────────────────┐   │  │ [25%] [50%] [75%] [100%]   │
│   │                            │   │  │                            │
│   │     Candlestick Chart      │   │  │ □ Stop Loss  [____]        │
│   │         (Live)             │   │  │ □ Take Profit [____]       │
│   │                            │   │  │                            │
│   │                            │   │  │ [  PLACE ORDER  ]          │
│   └────────────────────────────┘   │  └────────────────────────────┤
│                                    │                                │
│                                    │  POSITIONS                     │
│                                    │  BTC/USDT Long 0.1            │
│                                    │  Entry: $50,000               │
│                                    │  P&L: +$123.45 (+0.25%)       │
│                                    │  [Close] [Modify]             │
│                                    │                                │
├────────────────────────────────────┴────────────────────────────────┤
│  ORDER HISTORY                                                       │
│  ┌─────────────┬────────┬────────┬─────────┬────────┬─────────────┐ │
│  │ Time        │ Symbol │ Side   │ Type    │ Size   │ Price       │ │
│  ├─────────────┼────────┼────────┼─────────┼────────┼─────────────┤ │
│  │ 10:30:45    │ BTC    │ Buy    │ Market  │ 0.1    │ $50,000     │ │
│  │ 10:25:12    │ ETH    │ Sell   │ Limit   │ 1.5    │ $3,200      │ │
│  └─────────────┴────────┴────────┴─────────┴────────┴─────────────┘ │
├─────────────────────────────────────────────────────────────────────┤
│  ● Connected  │  Paper Mode  │  Ctrl+/ for shortcuts               │
└─────────────────────────────────────────────────────────────────────┘

Header Bar

Exchange Selector

Click to switch between connected exchanges:

Element	Description
Exchange Name	Currently selected exchange
Connection Status	Green dot = connected
Balance	Available trading balance

Symbol Search

Find and switch trading pairs:

Click search box or press Ctrl+K
Type symbol (e.g., "BTC", "ETH/USDT")
Select from results
Recent symbols shown first

Price Display

Element	Description
Current Price	Real-time market price
24h Change	Percentage change (color-coded)
High/Low	24h high and low prices

Trading Chart

Timeframe Selection

Available timeframes:

Button	Period	Use Case
1m	1 minute	Scalping
5m	5 minutes	Quick trades
15m	15 minutes	Day trading
30m	30 minutes	Intraday
1h	1 hour	Swing entry
4h	4 hours	Swing trading
1d	1 day	Position trading
1w	1 week	Long-term

Chart Features

Feature	Description
Candlesticks	OHLCV data visualization
Volume	Trading volume bars
Zoom	Mouse wheel to zoom
Pan	Click and drag
Crosshair	Price/time cursor

Chart Data Source

Charts fetch data from:

GET /api/charts/candles?symbol=BTC/USDT&exchangeId=xxx&timeframe=1h

Features:

Auto-refresh on new candles
Fallback to public data for paper trading
Symbol normalization across exchanges

Order Entry Panel

Order Side

Button	Action
LONG	Open or add to long position
SHORT	Open or add to short position

Order Types

Type	Description
Market	Execute immediately at best price
Limit	Execute at specified price or better

Size Input

Enter position size:

Direct input in base currency (e.g., 0.1 BTC)
Quick buttons: 25%, 50%, 75%, 100% of balance
Size validation based on exchange minimums

Stop Loss / Take Profit

Optional exit orders:

Field	Description
Stop Loss	Price to cut losses
Take Profit	Price to take profits

When enabled, creates bracket order with entry.

Place Order Button

Click to submit order. Button shows:

Estimated cost
Direction (Long/Short)
Loading state during submission

Position Panel

Shows current open positions:

Position Information

Field	Description
Symbol	Trading pair
Side	Long or Short
Size	Position size
Entry Price	Average entry
Current Price	Live market price
Unrealized P&L	Current profit/loss
P&L %	Percentage return
Liquidation	Liquidation price (futures)

Position Actions

Action	Description
Close	Market close entire position
Close %	Close partial position
Modify	Adjust SL/TP
Add	Increase position

P&L Color Coding

Green: Profit
Red: Loss
Gray: Breakeven

Order History Panel

Recent Orders

Shows last 20 orders:

Column	Description
Time	Order timestamp
Symbol	Trading pair
Side	Buy/Sell
Type	Market/Limit
Size	Order size
Price	Fill price
Status	Filled/Cancelled/Pending

Order Status Icons

Icon	Status
✓	Filled
◐	Partially filled
○	Open/Pending
✕	Cancelled
!	Failed

Real-Time Features

WebSocket Price Feed

The terminal maintains live connections:

┌────────────────────────────────────────────────────────────┐
│                 WEBSOCKET PRICE FEED                        │
│                                                             │
│  Exchange  ──── WebSocket ────  Terminal                   │
│                                                             │
│  Updates:                                                   │
│  • Price: Every tick (~100ms)                              │
│  • Orderbook: Real-time                                     │
│  • Positions: On change                                     │
│  • Orders: On fill                                          │
│                                                             │
│  Status: ● Connected (ping: 45ms)                          │
└────────────────────────────────────────────────────────────┘

Connection Status

Status	Indicator	Action
Connected	Green dot	Normal
Reconnecting	Yellow dot	Auto-retry
Disconnected	Red dot	Manual refresh

Auto-Reconnect

If connection drops:

Automatic reconnection attempts
Data resync on reconnect
No manual intervention needed
Notification if prolonged disconnect

Keyboard Shortcuts

Press Ctrl+/ to view all shortcuts:

Navigation

Shortcut	Action
`Ctrl+K`	Open symbol search
`Escape`	Close modal/cancel

Trading

Shortcut	Action
(Coming)	Quick buy/sell
(Coming)	Close all positions

Chart

Shortcut	Action
`1-7`	Switch timeframe
`+/-`	Zoom in/out
`R`	Reset chart view

Paper vs Live Trading

Visual Indicators

Mode	Indicator
Paper	"Paper Mode" badge, purple theme
Live	"Live" badge, standard theme

Paper Trading Features

Virtual $10,000 balance
Simulated execution
Real market prices
No actual trades placed

Switching Modes

Select different exchange in dropdown
Paper exchanges show "(Paper)" suffix
Confirm mode before trading

Mobile Responsiveness

The terminal adapts to screen size:

Desktop (> 1024px)

Full layout with all panels
Chart and order entry side-by-side
Order history visible

Tablet (768px - 1024px)

Chart above order entry
Collapsible panels
Touch-friendly buttons

Mobile (< 768px)

Simplified layout
Swipe between views
Large touch targets
Essential info only

Best Practices

Before Trading

✓ Verify correct exchange selected
✓ Check connection status (green)
✓ Confirm Paper vs Live mode
✓ Review available balance
✓ Set stop loss before entry

During Trading

✓ Monitor positions panel
✓ Watch for disconnection alerts
✓ Use keyboard shortcuts for speed
✓ Don't move stops further away

Risk Management

Always use stop losses
Size positions appropriately
Don't overtrade
Respect daily loss limits

Troubleshooting

Chart Not Loading

Solutions:

Check internet connection
Verify exchange is connected
Try refreshing the page
Select a different timeframe

Prices Not Updating

Solutions:

Check connection status indicator
Refresh the page
Switch to a different symbol and back
Check exchange API status

Order Not Submitting

Solutions:

Verify sufficient balance
Check order size meets minimum
Ensure exchange is in Active status
Review error message details

Position Not Showing

Solutions:

Click refresh on positions panel
Check if on correct exchange
Verify position isn't already closed
Sync exchange balance

API Endpoints Used

The terminal uses these endpoints:

Endpoint	Purpose
`GET /api/charts/candles`	Fetch OHLCV data
`GET /api/positions`	Get open positions
`POST /api/trading/price`	Get current price
`POST /api/orders`	Place orders
`GET /api/exchanges/[id]/markets`	Get tradeable symbols

Next Steps

Executing Trades - Step-by-step guide
Position Management - Managing positions
Order Types - Advanced orders
Risk Management - Protect capital