Services:
- alerts.service.ts: Alert management
- currency.service.ts: Currency conversion
- risk.service.ts: Risk calculation
Stores:
- investmentStore.ts: Investment state management
- llmStore.ts: LLM integration state
- mlStore.ts: ML model state
- riskStore.ts: Risk metrics state
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add tradingAgents.types.ts with complete type definitions
- Add agents.service.ts for Trading Agents API integration
- Add agentsStore.ts (Zustand) for state management
- Add BotCard.tsx, AgentCard.tsx, AgentsList.tsx components
- Add AgentsPage.tsx for /trading/agents route
- Fix TypeScript errors in AgentsList.tsx:
- Add handlers for startBot with default config
- Use correct AgentType for selectBot
Total: 8 new files, ~3,000 LOC
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Update mlService.ts to use apiClient with /proxy/ml/* endpoints
- Update llmAgentService.ts to use apiClient with /proxy/llm/* endpoints
- Update backtestService.ts to use apiClient with /proxy/data/* and /proxy/ml/*
- Update adminService.ts to use apiClient for ML model operations
ARCH-002: Frontend services now use authenticated Express proxy
- Token auto-refresh via apiClient interceptor
- Centralized error handling
- Unified session management
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add complete implementation of ML overlay components:
- MLPredictionOverlay: Renders ML price predictions as line overlay
- SignalMarkers: Displays BUY/SELL signal markers on chart
- ICTConceptsOverlay: Renders Order Blocks, FVG, and Liquidity zones
- useMlOverlayData: Custom hook with TanStack Query for data fetching
- mlOverlay.types.ts: Type definitions for all ML overlay data
Features:
- Uses lightweight-charts API for efficient rendering
- Automatic caching with 60s stale time
- Configurable colors and visibility
- Clean up on component unmount
- Full TypeScript support
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Created three complete 2FA components integrating with existing backend endpoints:
1. TwoFactorSetup.tsx (auth/components)
- 3-step wizard for 2FA setup
- QR code display with manual entry fallback
- TOTP code verification
- Backup codes display with copy functionality
- Integrates with POST /auth/2fa/setup and /auth/2fa/enable
2. TwoFactorVerifyModal.tsx (auth/components)
- Modal for 2FA verification during login
- Support for both TOTP (6 digits) and backup codes (8 digits)
- Auto-submit for TOTP codes
- Switch between code types
- Auto-focus input field
3. TwoFactorSettings.tsx (settings/components)
- Management panel for 2FA in settings
- Enable/disable 2FA with confirmation
- Regenerate backup codes
- Status display with activation date
- Integrates with all 2FA endpoints
All components follow project patterns:
- Tailwind CSS styling matching existing components
- lucide-react icons
- Centralized apiClient with auto-refresh
- Complete TypeScript types
- No placeholders or TODOs
Related: GAP-P1-004 2FA Frontend Flow
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Backend WS: Changed from localhost:3000/ws/trading to localhost:3080/ws
- ML Engine WS: Changed from localhost:8001 to localhost:3083
- Portfolio WS: Changed from localhost:3000/ws/portfolio to localhost:3080/ws
- Backend uses single /ws path with message types for channel differentiation
- ML Engine has dedicated /ws/signals endpoint
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Replace simulated video upload with real multipart upload to backend.
New Files:
- src/services/video-upload.service.ts (NEW): Complete multipart upload service
- Initialize upload with backend
- Split file into 5MB parts
- Upload parts to S3/R2 using presigned URLs
- Upload max 3 parts in parallel
- Complete upload and return video object
- Full upload flow with progress callbacks
Updated Files:
- src/modules/education/components/VideoUploadForm.tsx (UPDATED):
- Import videoUploadService
- Replace simulated upload (lines 214-248) with real API calls
- Use progress callbacks to update UI
- Handle real video ID on completion
- Maintain all existing UI/UX behavior
Upload Flow:
1. User selects video + fills metadata
2. Call videoUploadService.uploadVideo()
3. Backend initializes multipart upload
4. Split file into 5MB chunks
5. Upload chunks to S3/R2 (presigned URLs)
6. Backend completes upload
7. Video processing starts automatically
8. UI shows real-time progress
Technical Details:
- Part size: 5MB (optimal for network)
- Max concurrent uploads: 3 parts
- Uses fetch API for S3 direct upload
- ETags returned for multipart completion
- Full error handling and retry capability
Status: BLOCKER-003 (ST4.3) - 89% complete (5/6 tasks done)
Task: #10 ST4.3.5 - Frontend integrar VideoUploadForm con backend
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Delete PaymentMethodForm.tsx (PCI-DSS violation)
- Remove export from components/payments/index.ts
- Component was NOT in use (legacy/demo code)
Violation: Component handled card data directly (PAN, CVV, expiry)
in state and sent raw data to backend.
Compliant alternatives:
- Stripe Customer Portal (add payment methods)
- CardElement + Payment Intents (one-time payments)
Blocker: BLOCKER-002 (ST4.2 PCI-DSS Compliance)
Epic: OQI-005
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Created src/types/portfolio.types.ts
- Added all portfolio type definitions aligned with DDL
- Includes WebSocket event types for real-time updates
- Types match backend portfolio.types.ts structure
Part of coherence gap fix E-COH-004 - Frontend portfolio types.
Types align with DDL schema (portfolio.* enums and tables).
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- ModelSelector: Model selection with dropdown/tabs/cards variants
- EnsemblePanel: Ensemble voting configuration with weight sliders
- ICTAnalysisPanel: ICT analysis parameters with collapsible sections
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- StripeElementsWrapper: PCI-DSS compliance foundation with HOC and hook
- InvoicePreview: Pre-checkout invoice display with itemized breakdown
- RefundRequestModal: Modal for refund requests with validation
- RefundList: Paginated refund history with status filters
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- OrderBookDepthVisualization: Canvas-based depth chart with bid/ask areas
- MarketDepthPanel: Complete market depth with filters and grouping
- SymbolComparisonChart: Multi-symbol comparison with normalization modes
- TradingScreener: Advanced screener with filters and saved presets
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- AnalysisRequestForm: Structured request builder for complex analysis tasks
- StrategyTemplateSelector: Pre-built strategy templates with AI recommendations
- LLMConfigPanel: Model selection and inference parameters (Claude models)
- ContextMemoryDisplay: Conversation context and memory visualization
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- ConfidenceMeter: Advanced confidence visualization with model agreement
- SignalPerformanceTracker: Signal history with filters and statistics
- ModelAccuracyDashboard: Individual model metrics and comparison
- BacktestResultsVisualization: Backtest results with trades and monthly returns
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- CourseProgressTracker: Comprehensive progress visualization
- LearningPathVisualizer: Visual roadmap for learning paths
- VideoProgressPlayer: Enhanced video player with bookmarks and controls
- AssessmentSummaryCard: Quiz results analysis and review
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- IndicatorConfigPanel: Advanced technical indicator configuration
- ChartDrawingToolsPanel: Drawing tools for technical analysis
- SymbolInfoPanel: Comprehensive symbol information sidebar
- TradeJournalPanel: Trade review and journaling for paper trading
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- MT4LiveTradesPanel: Real-time positions dashboard with aggregate metrics
- PositionModifierDialog: Modal for modifying SL/TP with price/pips modes
- RiskBasedPositionSizer: Position size calculator based on risk percentage
- TradeAlertsNotificationCenter: Unified notification hub for MT4 events
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- InvoiceList: Paginated invoice table with filters
- InvoiceDetail: Full invoice modal with line items
- PaymentMethodsList: Manage saved payment methods
- SubscriptionUpgradeFlow: Plan upgrade/downgrade with preview
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- MessageList: Virtualized message list with auto-scroll
- ChatHeader: Header with title editing, actions menu, status
- MessageSearch: Search within conversation with filters
- MarkdownRenderer: Custom markdown rendering with code copy
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- QuickOrderPanel: One-click trading with lot presets
- TradeExecutionHistory: Session trade history with P&L stats
- TradingMetricsCard: Daily trading metrics and performance
- useMT4WebSocket: Real-time account/position updates hook
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- CouponForm: Apply and validate discount codes
- PaymentMethodForm: Add payment methods with card validation
- TransactionHistory: Wallet transactions with filtering/pagination
- BillingInfoForm: Edit billing address and tax information
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- useChatAssistant: Centralized chat logic with retry and streaming support
- useStreamingChat: SSE streaming with token animation
- messageFormatters: Signal parsing, price formatting, markdown processing
- SignalExecutionPanel: Execute trading signals with risk validation
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- MT4PositionsManager: Container for all live positions with filtering/sorting
- AdvancedOrderEntry: Professional order form with risk calculator, SL/TP modes
- AccountHealthDashboard: Unified account metrics with health status
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- ToolCallCard: Display tool execution results with expandable details
- MessageFeedback: Thumbs up/down with detailed feedback form
- StreamingIndicator: Multiple variants for thinking/analyzing/generating states
- AssistantSettingsPanel: Settings modal with risk profile, preferences
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- MT4ConnectionStatus: Connection indicator with account info display
- LivePositionCard: Real-time position card with P&L, modify/close actions
- RiskMonitor: Risk management dashboard with metrics and warnings
- index.ts: Centralized exports for all trading components
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- CertificatePreview: Display earned certificates with download/share
- CourseReviews: Reviews section with rating summary and filtering
- LessonNotes: Note-taking with timestamps and auto-save
- RecommendedCourses: Course recommendations with multiple layouts
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- ConversationHistory: Session list with search, delete, and selection
- ContextPanel: Display trading context (watchlist, risk profile, favorites)
- Update Assistant page to use chatStore for session management
- Wire sidebar to load/create/delete sessions
- Add error banner and responsive design
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add WalletDepositModal for depositing funds to wallet
- Add WalletWithdrawModal for withdrawing funds from wallet
- Add CheckoutSuccess page for successful Stripe checkout
- Add CheckoutCancel page for canceled checkout
- Update Billing page to use new wallet modals
- Add routes for /payments/success and /payments/cancel
- Export new modals from payments index
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add Settings tab with account info and reset functionality
- Show initial balance, total trades, open positions
- Reset account confirmation dialog
- Danger zone styling for reset action
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Create TradingStatsPanel with trading metrics (win rate, P&L, profit factor)
- Create OrderBookPanel with bids/asks visualization and spread
- Update Trading.tsx with toggle buttons for all panels
- Implement indicator toggle logic with Set state
- Add stats panel: current streak, avg hold time, portfolio summary
- Add order book: depth bars, click-to-fill, configurable rows
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Create AlertsPanel component with full CRUD functionality
- Add alerts API functions to trading.service.ts
- Integrate AlertsPanel into Trading.tsx with toggle button
- Support for above/below/crosses conditions
- Push and email notification options
- Recurring alerts support
- Filter by active/inactive status
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add Withdrawals.tsx with global withdrawals list and status filters
- Add Transactions.tsx with global transaction history and type/account filters
- Add Reports.tsx with allocation chart, performance bars, and export
- Add ProductDetail.tsx with performance chart and investment form
- Add routes for all new pages in App.tsx
OQI-004 progress: 45% -> 75%
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Create AccountDetail.tsx with tabs for overview, transactions, distributions, deposit, withdraw
- Create investment.service.ts with full API client for investment endpoints
- Add routes /investment/portfolio, /investment/products, /investment/accounts/:accountId
- Integrate DepositForm and WithdrawForm components
- Add canvas-based performance chart
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Create portfolioStore.ts with Zustand for state management
- Add portfolioWS instance for real-time portfolio updates
- Add usePortfolioUpdates hook for WebSocket subscriptions
- Refactor PortfolioDashboard to use store instead of local state
- Add WebSocket connection status indicator (Live/Offline)
- Add last update timestamp display
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add PerformanceChart component with canvas-based line chart
- Add EditAllocations page for modifying target allocations
- Integrate PerformanceChart into PortfolioDashboard
- Add route for /portfolio/:portfolioId/edit
- Extend portfolio.service with performance API functions
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Created portfolio.service.ts with API client functions
- Created AllocationChart component (donut chart)
- Created AllocationTable component (detailed positions)
- Created RebalanceCard component (rebalancing recommendations)
- Created GoalCard component (financial goal progress)
- Created PortfolioDashboard page (main dashboard)
- Created CreatePortfolio page (new portfolio form)
- Created CreateGoal page (new goal form)
- Updated App.tsx with portfolio routes
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add notification service for API calls
- Add notification Zustand store with WebSocket integration
- Create NotificationBell component with badge
- Create NotificationDropdown with recent notifications
- Create NotificationItem with icons and actions
- Update MainLayout to use NotificationBell
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
