Phase 4: Economic Calendar API Integration

Implemented comprehensive economic calendar system for trading event alerts:

Backend (economic_calendar.py):
- GET /api/economic-calendar/events: Fetch events by days, countries, impact level
- GET /api/economic-calendar/today: Get today's scheduled events
- GET /api/economic-calendar/upcoming: Events within X hours (1-168)
- GET /api/economic-calendar/high-impact: Only critical events (next 30 days)
- GET /api/economic-calendar/by-country/{country}: Country-specific events
- GET /api/economic-calendar/impact-analysis: Gold trading impact analysis
- GET /api/economic-calendar/calendar-view: Calendar view with events by day
- POST /api/economic-calendar/events/{event_id}/notify: Set reminder notifications
- GET /api/economic-calendar/stats: Event statistics and busiest days

Features:
- Sample economic events: NFP, CPI, Unemployment, Fed Rate Decision, ECB Rate
- Impact levels: High/Medium/Low with color coding
- Forecast, previous, and actual values tracking
- Event filtering by country, impact, and days ahead
- Multiple sort options: date, importance, impact
- Notifications 15-120 minutes before events
- Gold trading correlation analysis
- Statistics for 7-day and 30-day windows

Frontend (EconomicCalendar.tsx):
- Calendar overview with event statistics
- Upcoming and high-impact event tabs
- Country-based filtering
- Impact-based color coding (red/yellow/blue)
- Event details: forecast, previous, actual values
- Trading tips for different event types
- Event time display with timezone consideration
- Correlation guidance (USD inverse, rates inverse)
- Visual indicators for pending/actual events

Integration:
- Registered economic_calendar router in main.py
- Added EconomicCalendar tab to App.tsx
- Integrated with navigation system
- Full TypeScript support

Note: Currently uses mock data. In production, integrate with:
- Trading Economics API
- Forexfactory Calendar
- Economic Calendar Pro
- OANDA Calendar

frontend/src/App.tsx

@@ -17,6 +17,9 @@ import DailyChecklistPanel from './components/DailyChecklistPanel'
 // Phase 3: Advanced Analytics Components
 import AnalyticsDashboard from './components/AnalyticsDashboard'
 
+// Phase 4: Economic Calendar & Advanced Features
+import EconomicCalendar from './components/EconomicCalendar'
+
 function Tabs({ tabs, active, onChange }: { tabs: string[]; active: string; onChange: (t: string) => void }) {
   return (
     <div style={{ display: 'flex', gap: 8, marginBottom: 12 }}>
@@ -30,7 +33,7 @@ function Tabs({ tabs, active, onChange }: { tabs: string[]; active: string; onCh
 }
 
 export default function App() {
-  const [activeTab, setActiveTab] = useState<'Live' | 'Account' | 'Equity' | 'Decisions' | 'Analytics' | 'Settings' | 'Prompts' | 'Daily Helper'>('Live')
+  const [activeTab, setActiveTab] = useState<'Live' | 'Account' | 'Equity' | 'Decisions' | 'Analytics' | 'Economic Calendar' | 'Settings' | 'Prompts' | 'Daily Helper'>('Live')
   const [backendStatus, setBackendStatus] = useState<any>(null)
   const [showProfileSetup, setShowProfileSetup] = useState(false)
 
@@ -47,7 +50,7 @@ export default function App() {
     return () => { mounted = false }
   }, [])
 
-  const tabs = ['Live', 'Account', 'Equity', 'Decisions', 'Analytics', 'Daily Helper', 'Settings', 'Prompts']
+  const tabs = ['Live', 'Account', 'Equity', 'Decisions', 'Analytics', 'Economic Calendar', 'Daily Helper', 'Settings', 'Prompts']
 
   return (
     <div className="min-h-screen bg-dark-bg p-6">
@@ -84,6 +87,7 @@ export default function App() {
         {activeTab === 'Equity' && <EquityPerformancePanel />}
         {activeTab === 'Decisions' && <DecisionLogPanel />}
         {activeTab === 'Analytics' && <AnalyticsDashboard />}
+        {activeTab === 'Economic Calendar' && <EconomicCalendar />}
 
         {activeTab === 'Daily Helper' && (
           <div style={{ display: 'grid', gap: 16, gridTemplateColumns: 'repeat(auto-fit, minmax(400px, 1fr))' }}>