pos-system/apps/client-example/docs/TRADING_DEMO.md

BTC/USDT Trading Demo Page

Trang demo hiển thị dữ liệu real-time từ market-data-service (Coinbase WebSocket) để phục vụ showcase trading.

Đường dẫn

/[locale]/dashboard/trading-demo

Cấu hình

# client/.env.local
NEXT_PUBLIC_MARKET_DATA_SERVICE_URL=http://localhost:7015
NEXT_PUBLIC_MARKET_DATA_WS_URL=ws://localhost:7015/ws/market

Service cần chạy ở services/market-data-service (port 7015). Nếu deploy qua API Gateway, cập nhật biến môi trường tương ứng (bao gồm cả WS).

Thành phần chính

• useTradingDemo hook: fetch snapshot (/api/v1/market-data/:symbol/latest) + lịch sử TradingView (/api/v1/tv/history), đồng thời subscribe WebSocket (useMarketSocket) để nhận realtime snapshot.
• TradingStatsCards: hiển thị price, bid/ask, volume, last trade.
• TradingHistoryChart: sử dụng TradingView lightweight-charts để vẽ chart và cập nhật realtime theo WS.
• OrderSimulator: form mô phỏng buy/sell BTC dựa trên giá mới nhất (chưa khớp lệnh thật).

Quy trình chạy local

1. Khởi động market-data-service (npm run dev tại services/market-data-service), tạo pair BTC_USDT nếu chưa có.
2. Ở thư mục client/, chạy npm install (đảm bảo đã cài lightweight-charts) rồi npm run dev.
3. Truy cập http://localhost:3001/vi/dashboard/trading-demo (hoặc /en/...) sau khi đăng nhập.