const TeslaTechnicalIndicatorsChart = ({ data }) => { // Filter out initial nulls for Bollinger Bands and SMAs for cleaner visualization const filteredData = data.filter(d => d.upper_band !== null && d.lower_band !== null && d.sma_50 !== null && d.sma_200 !== null); return ( { const date = new Date(value); return date.toLocaleDateString('en-US', { month: 'short', year: 'numeric' }); }} style={{ fontSize: 12 }} /> `$${value.toLocaleString()}`} style={{ fontSize: 12 }} /> { if (name === 'close_price') return [`$${value.toLocaleString()}`, 'Close Price']; if (name === 'sma_50') return [`$${value.toLocaleString()}`, '50-Day SMA']; if (name === 'sma_200') return [`$${value.toLocaleString()}`, '200-Day SMA']; if (name === 'sma_20_bb') return [`$${value.toLocaleString()}`, '20-Day SMA (BB)']; if (name === 'upper_band') return [`$${value.toLocaleString()}`, 'Upper Bollinger Band']; if (name === 'lower_band') return [`$${value.toLocaleString()}`, 'Lower Bollinger Band']; return value; }} contentStyle={{ backgroundColor: BACKGROUND_COLOR, borderRadius: 8 }} /> ); };