const TeslaStockPriceWithSignals = ({ data }) => { const formattedData = data.map(d => ({ ...d, date: new Date(d.date).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' }), // Ensure these are numbers, though SQL should now return 0 instead of NULL buy_signal_price: parseFloat(d.buy_signal_price), sell_signal_price: parseFloat(d.sell_signal_price) })); // Filter for buy signals, ensuring they are valid numbers AND not 0 const buySignalPoints = formattedData.filter(d => d.buy_signal_price > 0); // Assuming prices are always > 0 // Filter for sell signals, ensuring they are valid numbers AND not 0 const sellSignalPoints = formattedData.filter(d => d.sell_signal_price > 0); // Assuming prices are always > 0 return ( { if (name === 'Closing Price') return [`$${value.toFixed(2)}`, name]; if (name === 'Buy Signal') return [`$${value.toFixed(2)}`, name]; if (name === 'Sell Signal') return [`$${value.toFixed(2)}`, name]; return value; }} contentStyle={{ backgroundColor: BACKGROUND_COLOR, borderRadius: 8 }} /> {/* Scatter for Buy Signals */} {/* Scatter for Sell Signals */} ); };