FINAL FIX: Docker API URL resolution for internal service communication

- Fixed internal API calls in Docker environment to use port 3000 instead of 9000 - Added DOCKER_ENV detection to properly route internal fetch requests - Resolves ECONNREFUSED errors when APIs try to call each other within container - Trade validation now works correctly in Docker: 5 USD position validates properly - Successfully tested: amountUSD field properly passed through validation pipeline - Both development and Docker environments now fully functional
2025-07-16 16:35:09 +02:00
parent befe860188
commit bd04e0b6a8
24 changed files with 2091 additions and 9 deletions
--- a/app/simple-chart/page.tsx
+++ b/app/simple-chart/page.tsx
@@ -0,0 +1,115 @@
+'use client'
+import React, { useEffect, useRef, useState } from 'react'
+
+export default function SimpleChart() {
+  const chartContainerRef = useRef<HTMLDivElement>(null)
+  const [status, setStatus] = useState('Initializing...')
+
+  useEffect(() => {
+    if (!chartContainerRef.current) return
+
+    const initChart = async () => {
+      try {
+        setStatus('Loading lightweight-charts...')
+        console.log('Importing lightweight-charts...')
+        
+        const LightweightCharts = await import('lightweight-charts')
+        console.log('Lightweight charts imported successfully')
+        setStatus('Creating chart...')
+        
+        const { createChart, ColorType, CandlestickSeries } = LightweightCharts
+
+        const chart = createChart(chartContainerRef.current!, {
+          layout: {
+            background: { type: ColorType.Solid, color: '#1a1a1a' },
+            textColor: '#ffffff',
+          },
+          width: chartContainerRef.current!.clientWidth || 800,
+          height: 400,
+          grid: {
+            vertLines: { color: 'rgba(42, 46, 57, 0.5)' },
+            horzLines: { color: 'rgba(42, 46, 57, 0.5)' },
+          },
+        })
+
+        setStatus('Adding candlestick series...')
+        console.log('Chart created, adding candlestick series...')
+
+        const candlestickSeries = chart.addSeries(CandlestickSeries, {
+          upColor: '#26a69a',
+          downColor: '#ef5350',
+          borderDownColor: '#ef5350',
+          borderUpColor: '#26a69a',
+          wickDownColor: '#ef5350',
+          wickUpColor: '#26a69a',
+        })
+
+        // Generate sample data
+        const data = []
+        const baseTime = new Date(Date.now() - 100 * 60 * 1000) // 100 minutes ago
+        let price = 166.5
+
+        for (let i = 0; i < 100; i++) {
+          const currentTime = new Date(baseTime.getTime() + i * 60 * 1000) // 1 minute intervals
+          const timeString = currentTime.toISOString().split('T')[0] // YYYY-MM-DD format
+          const change = (Math.random() - 0.5) * 2 // Random price change
+          const open = price
+          const close = price + change
+          const high = Math.max(open, close) + Math.random() * 1
+          const low = Math.min(open, close) - Math.random() * 1
+
+          data.push({
+            time: timeString,
+            open: Number(open.toFixed(2)),
+            high: Number(high.toFixed(2)),
+            low: Number(low.toFixed(2)),
+            close: Number(close.toFixed(2)),
+          })
+
+          price = close
+        }
+
+        console.log('Setting chart data...', data.length, 'points')
+        candlestickSeries.setData(data)
+
+        setStatus('Chart loaded successfully!')
+        console.log('Chart created successfully!')
+
+        // Handle resize
+        const handleResize = () => {
+          if (chartContainerRef.current) {
+            chart.applyOptions({
+              width: chartContainerRef.current.clientWidth,
+            })
+          }
+        }
+
+        window.addEventListener('resize', handleResize)
+
+        return () => {
+          window.removeEventListener('resize', handleResize)
+          chart.remove()
+        }
+
+      } catch (error) {
+        const errorMessage = error instanceof Error ? error.message : String(error)
+        console.error('Error creating chart:', error)
+        setStatus(`Error: ${errorMessage}`)
+      }
+    }
+
+    initChart()
+  }, [])
+
+  return (
+    <div className="min-h-screen bg-gray-900 p-8">
+      <h1 className="text-white text-2xl mb-4">Lightweight Charts Test</h1>
+      <div className="text-gray-400 mb-4">Status: {status}</div>
+      <div 
+        ref={chartContainerRef} 
+        className="bg-gray-800 rounded w-full h-96" 
+        style={{ minHeight: '400px' }}
+      />
+    </div>
+  )
+}