chore: remove ~100 debug console.log statements from frontend

Cleaned up verbose debug logging left from development: - AdvancedChart.tsx: removed ~50 debug logs (time parsing, order fetching, marker creation) - ChartWithOrders.tsx: removed debug logs and unused klineMinTime/klineMaxTime variables - ChartWithOrdersSimple.tsx: removed data loading debug logs - ChartTabs.tsx: removed render/selection debug logs - ComparisonChart.tsx: removed equity history debug logs - AITradersPage.tsx: removed 🔥 DEBUG logs from handleSaveEditTrader - App.tsx: removed mount debug log Kept legitimate console.error/console.warn for actual error handling.
2026-07-07 04:50:57 +08:00 · 2026-03-23 09:31:37 +08:00
parent 59e7e37db1
commit 0030639ec5
7 changed files with 4 additions and 86 deletions
--- a/web/src/App.tsx
+++ b/web/src/App.tsx
@@ -57,7 +57,6 @@ function App() {

  // Debug log
  useEffect(() => {
-    console.log('[App] Mounted. Route:', window.location.pathname);
  }, []);

  // 从URL路径读取初始页面状态（支持刷新保持页面）
--- a/web/src/components/charts/AdvancedChart.tsx
+++ b/web/src/components/charts/AdvancedChart.tsx
@@ -198,23 +198,17 @@ export function AdvancedChart({
    if (typeof time === 'number') {
      // Determine ms vs seconds: if > 10^12, treat as milliseconds
      if (time > 1000000000000) {
-        const seconds = Math.floor(time / 1000)
-        console.log('[AdvancedChart] ✅ Unix timestamp (ms→s):', time, '→', seconds, '(', new Date(time).toISOString(), ')')
-        return seconds
+        return Math.floor(time / 1000)
      }
-      console.log('[AdvancedChart] ✅ Unix timestamp (s):', time, '(', new Date(time * 1000).toISOString(), ')')
      return time
    }

    const timeStr = String(time)
-    console.log('[AdvancedChart] Parsing time string:', timeStr)

    // Try standard ISO format
    const isoTime = new Date(timeStr).getTime()
    if (!isNaN(isoTime) && isoTime > 0) {
-      const timestamp = Math.floor(isoTime / 1000)
-      console.log('[AdvancedChart] ✅ Parsed as ISO:', timeStr, '→', timestamp, '(', new Date(timestamp * 1000).toISOString(), ')')
-      return timestamp
+      return Math.floor(isoTime / 1000)
    }

    // Parse custom format "MM-DD HH:mm UTC" (for legacy data)
@@ -229,35 +223,27 @@ export function AdvancedChart({
        parseInt(hour),
        parseInt(minute)
      ))
-      const timestamp = Math.floor(date.getTime() / 1000)
-      console.log('[AdvancedChart] ✅ Parsed as custom format:', timeStr, '→', timestamp, '(', new Date(timestamp * 1000).toISOString(), ')')
-      return timestamp
+      return Math.floor(date.getTime() / 1000)
    }

-    console.error('[AdvancedChart] ❌ Failed to parse time:', timeStr)
+    console.warn('[AdvancedChart] Failed to parse time:', timeStr)
    return 0
  }

  // Fetch order data
  const fetchOrders = async (traderID: string, symbol: string): Promise<OrderMarker[]> => {
    try {
-      console.log('[AdvancedChart] Fetching orders for trader:', traderID, 'symbol:', symbol)
      // Fetch filled orders, up to 200 for more history
      const result = await httpClient.get(`/api/orders?trader_id=${traderID}&symbol=${symbol}&status=FILLED&limit=200`)

-      console.log('[AdvancedChart] Orders API response:', result)
-
      if (!result.success || !result.data) {
-        console.warn('[AdvancedChart] No orders found, result:', result)
        return []
      }

      const orders = result.data
-      console.log('[AdvancedChart] Raw orders data:', orders)
      const markers: OrderMarker[] = []

      orders.forEach((order: any) => {
-        console.log('[AdvancedChart] Processing order:', order)

        // Handle field names: support PascalCase and snake_case
        const filledAt = order.filled_at || order.FilledAt || order.created_at || order.CreatedAt
@@ -295,15 +281,6 @@ export function AdvancedChart({
          positionSide = side === 'buy' ? 'long' : 'short'
        }

-        console.log('[AdvancedChart] Order marker:', {
-          time: timeSeconds,
-          price: avgPrice,
-          side: positionSide,
-          rawSide: side,
-          action,
-          orderAction
-        })
-
        markers.push({
          time: timeSeconds,
          price: avgPrice,
@@ -314,7 +291,6 @@ export function AdvancedChart({
        })
      })

-      console.log('[AdvancedChart] Final markers:', markers)
      return markers
    } catch (err) {
      console.error('[AdvancedChart] Error fetching orders:', err)
@@ -325,11 +301,8 @@ export function AdvancedChart({
  // Fetch exchange open orders (TP/SL)
  const fetchOpenOrders = async (traderID: string, symbol: string): Promise<OpenOrder[]> => {
    try {
-      console.log('[AdvancedChart] Fetching open orders for trader:', traderID, 'symbol:', symbol)
      const result = await httpClient.get(`/api/open-orders?trader_id=${traderID}&symbol=${symbol}`)

-      console.log('[AdvancedChart] Open orders API response:', result)
-
      if (!result.success || !result.data) {
        console.warn('[AdvancedChart] No open orders found')
        return []
@@ -516,7 +489,6 @@ export function AdvancedChart({
    const loadData = async (isRefresh = false) => {
      if (!candlestickSeriesRef.current) return

-      console.log('[AdvancedChart] Loading data for', symbol, interval, isRefresh ? '(refresh)' : '')
      // Only show loading on first load, avoid flicker on refresh
      if (!isRefresh) {
        setLoading(true)
@@ -526,7 +498,6 @@ export function AdvancedChart({
      try {
        // 1. Fetch kline data
        const klineData = await fetchKlineData(symbol, interval)
-        console.log('[AdvancedChart] Loaded', klineData.length, 'klines')
        candlestickSeriesRef.current.setData(klineData)

        // Store volume/quoteVolume data for tooltip
@@ -587,18 +558,14 @@ export function AdvancedChart({

        // 4. Fetch and display order markers
        if (traderID && candlestickSeriesRef.current) {
-          console.log('[AdvancedChart] Starting to fetch orders...')
          const orders = await fetchOrders(traderID, symbol)
-          console.log('[AdvancedChart] Received orders:', orders)

          if (orders.length > 0) {
-            console.log('[AdvancedChart] Creating markers from', orders.length, 'orders')

            // Extract sorted kline time array
            const klineTimes = klineData.map((k: any) => k.time as number)
            const klineMinTime = klineTimes[0] || 0
            const klineMaxTime = klineTimes[klineTimes.length - 1] || 0
-            console.log('[AdvancedChart] Kline time range:', klineMinTime, '-', klineMaxTime, '(', klineTimes.length, 'candles)')

            // Binary search: find the kline candle for the order time
            // Return the largest kline time <= orderTime
@@ -682,10 +649,7 @@ export function AdvancedChart({
            // Sort by time (lightweight-charts requires chronological order)
            markers.sort((a, b) => (a.time as number) - (b.time as number))

-            console.log('[AdvancedChart] Valid markers:', markers.length, 'out of', orders.length)

-            console.log('[AdvancedChart] Setting', markers.length, 'markers on candlestick series')
-            console.log('[AdvancedChart] Markers data:', JSON.stringify(markers, null, 2))

            try {
              // Store marker data for later toggle use
@@ -701,12 +665,10 @@ export function AdvancedChart({
                // First time creating markers
                seriesMarkersRef.current = createSeriesMarkers(candlestickSeriesRef.current, markersToShow)
              }
-              console.log('[AdvancedChart] ✅ Markers updated! Count:', markersToShow.length, 'Visible:', showOrderMarkers)
            } catch (err) {
              console.error('[AdvancedChart] ❌ Failed to set markers:', err)
            }
          } else {
-            console.log('[AdvancedChart] No orders found, clearing markers')
            try {
              if (seriesMarkersRef.current) {
                seriesMarkersRef.current.setMarkers([])
@@ -715,11 +677,6 @@ export function AdvancedChart({
              console.error('[AdvancedChart] Failed to clear markers:', err)
            }
          }
-        } else {
-          console.log('[AdvancedChart] Skipping markers:', {
-            hasTraderID: !!traderID,
-            hasSeries: !!candlestickSeriesRef.current
-          })
        }

        // Auto-fit view only on initial load, avoid jitter on refresh
@@ -760,7 +717,6 @@ export function AdvancedChart({
        priceLinesRef.current = []

        const openOrders = await fetchOpenOrders(traderID, symbol)
-        console.log('[AdvancedChart] Open orders for price lines:', openOrders)

        if (openOrders.length > 0 && candlestickSeriesRef.current) {
          openOrders.forEach(order => {
@@ -804,7 +760,6 @@ export function AdvancedChart({
              priceLinesRef.current.push(priceLine)
            }
          })
-          console.log('[AdvancedChart] ✅ Created', priceLinesRef.current.length, 'price lines for pending orders')
        }
      } catch (err) {
        console.error('[AdvancedChart] Error loading open orders:', err)
@@ -830,7 +785,6 @@ export function AdvancedChart({
    try {
      const markersToShow = showOrderMarkers ? currentMarkersDataRef.current : []
      seriesMarkersRef.current.setMarkers(markersToShow)
-      console.log('[AdvancedChart] 🔄 Toggled markers visibility:', showOrderMarkers, 'Count:', markersToShow.length)
    } catch (err) {
      console.error('[AdvancedChart] ❌ Failed to toggle markers:', err)
    }
--- a/web/src/components/charts/ChartTabs.tsx
+++ b/web/src/components/charts/ChartTabs.tsx
@@ -123,7 +123,6 @@ export function ChartTabs({ traderId, selectedSymbol, updateKey, exchangeId }: C
  // Auto-switch to kline chart when symbol selected externally
  useEffect(() => {
    if (selectedSymbol) {
-      console.log('[ChartTabs] Symbol selected:', selectedSymbol, 'updateKey:', updateKey)
      setChartSymbol(selectedSymbol)
      setActiveTab('kline')
    }
@@ -143,7 +142,6 @@ export function ChartTabs({ traderId, selectedSymbol, updateKey, exchangeId }: C
    }
  }

-  console.log('[ChartTabs] rendering, activeTab:', activeTab)

  return (
    <div className={`nofx-glass rounded-lg border border-white/5 relative z-10 w-full flex flex-col transition-all duration-300 ${typeof window !== 'undefined' && window.innerWidth < 768 ? 'h-[500px]' : 'h-[600px]'
--- a/web/src/components/charts/ChartWithOrders.tsx
+++ b/web/src/components/charts/ChartWithOrders.tsx
@@ -69,21 +69,17 @@ export function ChartWithOrders({
      // Determine ms vs seconds: if > 10^12, treat as milliseconds
      if (time > 1000000000000) {
        const seconds = Math.floor(time / 1000)
-        console.log('[ChartWithOrders] ✅ Unix timestamp (ms→s):', time, '→', seconds, '(', new Date(time).toISOString(), ')')
        return seconds
      }
-      console.log('[ChartWithOrders] ✅ Unix timestamp (s):', time, '(', new Date(time * 1000).toISOString(), ')')
      return time
    }

    const timeStr = String(time)
-    console.log('[ChartWithOrders] Parsing time string:', timeStr)

    // Try standard ISO format
    const isoTime = new Date(timeStr).getTime()
    if (!isNaN(isoTime) && isoTime > 0) {
      const timestamp = Math.floor(isoTime / 1000)
-      console.log('[ChartWithOrders] ✅ Parsed as ISO:', timeStr, '→', timestamp, '(', new Date(timestamp * 1000).toISOString(), ')')
      return timestamp
    }

@@ -100,7 +96,6 @@ export function ChartWithOrders({
        parseInt(minute)
      ))
      const timestamp = Math.floor(date.getTime() / 1000)
-      console.log('[ChartWithOrders] ✅ Parsed as custom format:', timeStr, '→', timestamp, '(', new Date(timestamp * 1000).toISOString(), ')')
      return timestamp
    }

@@ -184,7 +179,6 @@ export function ChartWithOrders({
        })
      })

-      console.log(`[ChartWithOrders] Loaded ${markers.length} order markers for ${symbol}`)
      return markers
    } catch (err) {
      console.error('Error fetching orders:', err)
@@ -199,7 +193,6 @@ export function ChartWithOrders({
      return
    }

-    console.log('[ChartWithOrders] Initializing chart for', symbol, interval)

    try {
      // Create chart
@@ -303,26 +296,19 @@ export function ChartWithOrders({
  useEffect(() => {
    const loadData = async () => {
      if (!candlestickSeriesRef.current) {
-        console.log('[ChartWithOrders] Candlestick series not ready yet')
        return
      }

-      console.log('[ChartWithOrders] Loading data for', symbol, interval, 'trader:', traderID)
      setLoading(true)
      setError(null)

      try {
        // 1. Fetch kline data
-        console.log('[ChartWithOrders] Fetching kline data...')
        const klineData = await fetchKlineData(symbol, interval)
-        console.log('[ChartWithOrders] Kline data received:', klineData.length, 'candles')
        candlestickSeriesRef.current.setData(klineData)

        // Build kline time set for quick lookup
        const klineTimeSet = new Set(klineData.map(k => k.time as number))
-        const klineMinTime = klineData.length > 0 ? klineData[0].time : 0
-        const klineMaxTime = klineData.length > 0 ? klineData[klineData.length - 1].time : 0
-        console.log('[ChartWithOrders] Kline time range:', klineMinTime, '-', klineMaxTime, 'candles:', klineData.length)

        // Calculate interval in seconds
        const getIntervalSeconds = (interval: string): number => {
@@ -339,16 +325,12 @@ export function ChartWithOrders({
          }
        }
        const intervalSeconds = getIntervalSeconds(interval)
-        console.log('[ChartWithOrders] Interval:', interval, '=', intervalSeconds, 'seconds')

        // 2. Fetch order data and add markers
        if (traderID) {
-          console.log('[ChartWithOrders] Fetching orders for trader:', traderID, 'symbol:', symbol)
          const orders = await fetchOrders(traderID, symbol)
-          console.log('[ChartWithOrders] Received orders:', orders.length, 'orders')

          if (orders.length === 0) {
-            console.log('[ChartWithOrders] No orders to display')
          }

          // Convert orders to chart markers, aligned to kline time
@@ -385,9 +367,7 @@ export function ChartWithOrders({
            })
          })

-          console.log('[ChartWithOrders] Valid markers (with matching klines):', markers.length, 'out of', orders.length)

-          console.log('[ChartWithOrders] Setting', markers.length, 'markers on chart')

          try {
            // Using v5 API: createSeriesMarkers
@@ -398,7 +378,6 @@ export function ChartWithOrders({
              // First time creating markers
              seriesMarkersRef.current = createSeriesMarkers(candlestickSeriesRef.current, markers)
            }
-            console.log('[ChartWithOrders] ✅ Markers set successfully!')
          } catch (err) {
            console.error('[ChartWithOrders] ❌ Failed to set markers:', err)
          }
--- a/web/src/components/charts/ChartWithOrdersSimple.tsx
+++ b/web/src/components/charts/ChartWithOrdersSimple.tsx
@@ -21,7 +21,6 @@ export function ChartWithOrdersSimple({

  useEffect(() => {
    const loadData = async () => {
-      console.log('[ChartSimple] Loading data for', symbol, interval, 'trader:', traderID)
      setLoading(true)
      setError(null)

@@ -30,24 +29,20 @@ export function ChartWithOrdersSimple({
        const limit = 100
        const klineUrl = `/api/klines?symbol=${symbol}&interval=${interval}&limit=${limit}`

-        console.log('[ChartSimple] Fetching klines from our service:', klineUrl)
        const klineResult = await httpClient.get(klineUrl)

        if (!klineResult.success || !klineResult.data) {
          throw new Error('Failed to fetch klines from our service')
        }

-        console.log('[ChartSimple] Received klines:', klineResult.data.length)
        setKlineCount(klineResult.data.length)

        // 测试获取订单数据
        if (traderID) {
          const tradesUrl = `/api/trades?trader_id=${traderID}&symbol=${symbol}&limit=100`
-          console.log('[ChartSimple] Fetching trades from:', tradesUrl)
          const tradesResult = await httpClient.get(tradesUrl)

          if (tradesResult.success && tradesResult.data) {
-            console.log('[ChartSimple] Received trades:', tradesResult.data.length)
            setOrderCount(tradesResult.data.length)
          } else {
            console.warn('[ChartSimple] Failed to fetch trades:', tradesResult.message || 'Unknown error', tradesResult)
--- a/web/src/components/charts/ComparisonChart.tsx
+++ b/web/src/components/charts/ComparisonChart.tsx
@@ -48,10 +48,8 @@ export function ComparisonChart({ traders }: ComparisonChartProps) {
  const { data: allTraderHistories, isLoading } = useSWR(
    traders.length > 0 ? `equity-histories-${tradersKey}-${selectedHours}` : null,
    async () => {
-      console.log('Fetching equity history with hours:', selectedHours)
      const traderIds = traders.map((trader) => trader.trader_id)
      const batchData = await api.getEquityHistoryBatch(traderIds, selectedHours)
-      console.log('Received data points:', Object.values(batchData.histories || {}).map((h: any) => h?.length))
      return traders.map((trader) => {
        const history = batchData.histories?.[trader.trader_id] || []

--- a/web/src/components/trader/AITradersPage.tsx
+++ b/web/src/components/trader/AITradersPage.tsx
@@ -233,7 +233,6 @@ export function AITradersPage({ onTraderSelect }: AITradersPageProps) {
  }

  const handleSaveEditTrader = async (data: CreateTraderRequest) => {
-    console.log('🔥🔥🔥 handleSaveEditTrader CALLED with data:', data)
    if (!editingTrader) return

    try {
@@ -261,10 +260,6 @@ export function AITradersPage({ onTraderSelect }: AITradersPageProps) {
        show_in_competition: data.show_in_competition,
      }

-      console.log('🔥 handleSaveEditTrader - data:', data)
-      console.log('🔥 handleSaveEditTrader - data.strategy_id:', data.strategy_id)
-      console.log('🔥 handleSaveEditTrader - request:', request)
-
      await api.updateTrader(editingTrader.trader_id, request)
      toast.success(t('aiTradersToast.saved', language))
      setShowEditModal(false)