robinhood/docs/archive/STRATEGY_MODE_IMPLEMENTATION.md

Strategy Mode Selector - Implementation Summary

✅ Phase 1 Complete: Strategy Mode Selector UI

What Was Built

1. New Component: StrategyModeSelector.tsx

Location: /frontend/src/components/StrategyModeSelector.tsx

Features:

• ⚡ SCALP Mode: Micro position sizing, 0.5% stops, 1% targets, 1m timeframe
• 📈 SWING Mode: Full position sizing, 2% stops, 8% targets, daily timeframe
• 🎯 HYBRID Mode: 70% swing + 30% scalp blend for balanced trading

Each mode has:

• Preset risk parameters (auto-calculated)
• Trading tips specific to strategy
• Compact and full UI variants
• Persistent localStorage storage

2. Updated: Daily Trading Plan Integration

• Added strategyMode to TradingPlan type
• Strategy mode now auto-adjusts plan parameters:
  • Scalping: $50 daily target, $12.50 max loss, 20 max trades
  • Swing: $500 daily target, $250 max loss, 3 max trades
  • Hybrid: $250 daily target, $125 max loss, 10 max trades
• Added visual strategy info banner showing active mode & key metrics
• Strategy selector appears prominently in Daily Plan UI

3. Features Included

// Each strategy preset includes:
{
  mode: 'SCALP' | 'SWING' | 'HYBRID',
  riskPerTrade: number,        // % of capital
  stopLossPercent: number,     // % stop loss
  takeProfitPercent: number,   // % take profit
  timeFrame: string,           // '1m', '5m', 'daily', etc.
  maxHoldMinutes: number,      // Maximum hold time
  maxDailyTrades: number,      // Trade limit per day
  r2rRatio: number,            // Risk:Reward ratio
  description: string,         // Strategy summary
  emoji: string,               // Visual indicator
}

Screenshots / Usage

1. Toggle Strategy Mode

   • Click strategy buttons in Daily Trading Plan
   • Plan parameters auto-update
   • Choice saved to localStorage

2. View Strategy Details

   • Click "Show Details" to see all parameters
   • See specific tips for each strategy
   • Understand position sizing logic

3. Quick Mode View

   • On mobile, compact view shows 3 emoji buttons
   • On desktop, full card view with details
   • Responsive design

Parameter Comparison

Feature	Scalping	Swing	Hybrid
Risk/Trade	0.25%	2%	1.25%
Stop Loss	0.5%	2%	1.25%
Take Profit	1%	8%	4.5%
R:R Ratio	1:1	1:3	1:2
Time Frame	1m	Daily	Mixed
Max Hold	5m	24h	2h
Max Trades/Day	20	3	10
Daily Target	$50	$500	$250
Max Loss	$12.50	$250	$125

Files Modified/Created

✅ Created:

• /frontend/src/components/StrategyModeSelector.tsx - Main strategy selector component

✅ Modified:

• /frontend/src/components/features/trading/DailyTradingPlan/types.ts - Added strategyMode field
• /frontend/src/components/features/trading/DailyTradingPlan/index.tsx - Integrated strategy selector

Next Steps (Todo List)

1. ⏭️ Phase 2: Scalping Optimization

   • Add 1-5 minute chart support
   • Tight stop loss presets (0.5-1%)
   • Rapid entry/exit signals
   • Execution speed tracking

2. Phase 3: Swing Trading Optimization

   • Trend confirmation filters
   • Multi-day position tracking
   • Partial profit-taking system (33%/66%/100%)
   • News event tracking

3. Phase 4: Execution Speed Metrics

   • Time-to-entry tracking
   • Slippage cost analysis
   • Profitability correlation

---

How to Use

For Scalpers

1. Switch to SCALP mode
2. Watch 1m charts with tight stops
3. Take profits at 0.5-1%
4. Execute 10-20 trades per day for income

For Swing Traders

1. Switch to SWING mode
2. Use daily charts with trend filters
3. Target 6-8% moves
4. Hold 1-5 days for trend capture

For Balanced Traders

1. Switch to HYBRID mode
2. Allocate capital: 70% swing, 30% scalp
3. Let swings capture trends
4. Let scalps fill daily income gaps

---

Technical Details

localStorage Keys

• trading-strategy-mode: Current selected mode (SCALP/SWING/HYBRID)
• daily-trading-plan: Daily plan with strategy mode

State Management

• Strategy mode persists across sessions
• Plan auto-updates when mode changes
• All parameters reactive and real-time

Responsive Design

• Desktop: Full card with all details visible
• Tablet: Compact view with expandable details
• Mobile: Minimal buttons, full details on toggle

---

Quality Checklist

✅ TypeScript fully typed ✅ No ESLint errors ✅ Responsive design ✅ localStorage persistence ✅ Callback handlers optimized ✅ Icons from lucide-react ✅ Dark theme compatible ✅ Tailwind CSS styling ✅ Accessible markup

---

Next Implementation

Ready for Phase 2: Scalping Optimization Features

• Sub-5min chart timeframe selector
• Rapid entry trigger system
• Position size micro-formatter
• Execution speed metrics dashboard

Would you like me to proceed with Phase 2?