Fix: Margins Y Axis

frontend/src/components/HistoricalChartWidget.tsx

@@ -39,7 +39,7 @@ export const HistoricalChartWidget = ({ ticker, mercado, dias }: HistoricalChart
     const prices = data.map(p => p.precioActual);
     const dataMin = Math.min(...prices);
     const dataMax = Math.max(...prices);
-    const padding = (dataMax - dataMin) * 0.05; // 5% de padding
+    const padding = (dataMax - dataMin) * 0.5; // 5% de padding
     const domainMin = Math.floor(dataMin - padding);
     const domainMax = Math.ceil(dataMax + padding);
 
@@ -49,6 +49,11 @@ export const HistoricalChartWidget = ({ ticker, mercado, dias }: HistoricalChart
         return `$${formatCurrency(tick)}`;
     };
 
+    // 3. Calcular el ancho del eje Y dinámicamente
+    const maxLabel = yAxisTickFormatter(dataMax);
+    // Calculamos un ancho base + un extra por cada carácter en la etiqueta más larga.
+    const dynamicWidth = mercado === 'EEUU' ? 5 + (maxLabel.length * 4.5) : 15 + (maxLabel.length * 5); 
+
     return (
         <ResponsiveContainer width="100%" height={300}>
             <LineChart data={data} margin={{ top: 5, right: 30, left: 20, bottom: 5 }}>
@@ -57,10 +62,11 @@ export const HistoricalChartWidget = ({ ticker, mercado, dias }: HistoricalChart
                 <YAxis
                     domain={[domainMin, domainMax]}
                     tickFormatter={yAxisTickFormatter}
-                    width={75} // Damos un poco más de espacio para números grandes
+                    width={dynamicWidth}
+                    tickMargin={5}
                 />
                 <Tooltip
-                    formatter={(value: number) => [`$${formatCurrency2Decimal(value)}`, 'Precio']}
+                    formatter={(value: number) => [`${formatCurrency2Decimal(value, mercado === 'EEUU' ? 'USD' : 'ARS')}`, 'Precio']}
                     labelFormatter={formatTooltipLabel}
                 />
                 <Legend />