Add WhaleTrades tab + Trading Tools (Calculator, Alerts, Notes)

components/mission-control/TradingPanel.tsx

@@ -2,8 +2,9 @@
 
 import { useState, useEffect } from 'react'
 import { TradingChart } from './TradingChart'
+import { TradingTools } from './TradingTools'
 
-type TradingTab = 'research' | 'strategies' | 'execution' | 'journal'
+type TradingTab = 'research' | 'strategies' | 'execution' | 'journal' | 'whaletrades' | 'tools'
 
 interface Trader {
   id: string
@@ -273,6 +274,8 @@ export function TradingPanel() {
     { id: 'strategies', label: '🎯 Strategies', count: traders.filter(t => t.status === 'active').length },
     { id: 'execution', label: '⚡ Execution', count: trades.filter(t => t.status === 'open').length },
     { id: 'journal', label: '📔 Journal', count: trades.length },
+    { id: 'whaletrades', label: '🐋 WhaleTrades', count: 0 },
+    { id: 'tools', label: '🧮 Tools', count: 3 },
   ]
 
   const filteredTrades = trades.filter(t => {
@@ -557,6 +560,25 @@ export function TradingPanel() {
         </div>
       )}
 
+      {/* WhaleTrades Tab */}
+      {activeTab === 'whaletrades' && (
+        <div className="border border-white/20 rounded-lg p-4 bg-white/5">
+          <h3 className="text-lg font-bold mb-4">🐋 WhaleTrades Tools</h3>
+          <p className="text-white/60 mb-4">Professional trading tools embedded from WhaleTrades.io</p>
+          
+          <iframe 
+            src="https://whaletrades.io/"
+            className="w-full h-[600px] rounded-lg border border-white/10"
+            title="WhaleTrades"
+          />
+        </div>
+      )}
+
+      {/* Tools Tab */}
+      {activeTab === 'tools' && (
+        <TradingTools />
+      )}
+
       {/* Full Analysis Modal */}
       {showFullAnalysis && (
         <div className="fixed inset-0 bg-black/80 backdrop-blur-sm z-50 flex items-center justify-center p-4">