From b42cdc7e80a9b1d0c0ed72f0cf552dfeedba15ed Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marcos=20Ben=C3=ADtez?= <marcos.benitez@inquality.com.py>
Date: Wed, 24 Jun 2026 20:45:24 -0300
Subject: [PATCH] =?UTF-8?q?fix(sprint-6/etapa-2):=20mover=20gr=C3=A1ficos?=
 =?UTF-8?q?=20antes=20de=20ComparisonTable=20en=20tab=20ROI?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

SensitivityPanel y CumulativeSavingsChart deben ser adyacentes: el slider afecta
el gráfico (doble línea) y el usuario no debe scrollear a través de la tabla de
comparación para ver el efecto. Reordenamiento de JSX puro, sin cambios de lógica.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 src/features/report/ReportPage.tsx | 29 +++++++++++++++--------------
 1 file changed, 15 insertions(+), 14 deletions(-)

diff --git a/src/features/report/ReportPage.tsx b/src/features/report/ReportPage.tsx
index 5f30f42..1883371 100644
--- a/src/features/report/ReportPage.tsx
+++ b/src/features/report/ReportPage.tsx
@@ -545,20 +545,8 @@ export function ReportPage() {
                     onReset={() => { setVolumeAdjust(0); setInvestmentAdjust(0) }}
                   />
 
-                  {/* Tabla de comparación actividad por actividad — per-ejecución, no varía con los sliders */}
-                  <div className="mb-6">
-                    <h2 className="text-base font-semibold text-slate-800 mb-4">
-                      Comparación por actividad
-                    </h2>
-                    <ComparisonTable
-                      perActivityActual={result.perActivity}
-                      perActivityAutomated={resultAutomated!.perActivity}
-                      automatableIds={automatableIds}
-                      currency={process.currency}
-                    />
-                  </div>
-
-                  {/* Gráficos: ahorro acumulado + top ahorros */}
+                  {/* Gráficos: ahorro acumulado + top ahorros — adyacente al SensitivityPanel
+                      para que el efecto de los sliders sea visible sin scrollear */}
                   <div className="grid grid-cols-1 lg:grid-cols-2 gap-4 mb-6">
                     <div className="bg-white rounded-xl border border-slate-200 shadow-sm p-5">
                       <h3 className="text-xs font-semibold text-slate-600 uppercase tracking-wide mb-4">
@@ -584,6 +572,19 @@ export function ReportPage() {
                     </div>
                   </div>
 
+                  {/* Tabla de comparación actividad por actividad — per-ejecución, no varía con los sliders */}
+                  <div className="mb-6">
+                    <h2 className="text-base font-semibold text-slate-800 mb-4">
+                      Comparación por actividad
+                    </h2>
+                    <ComparisonTable
+                      perActivityActual={result.perActivity}
+                      perActivityAutomated={resultAutomated!.perActivity}
+                      automatableIds={automatableIds}
+                      currency={process.currency}
+                    />
+                  </div>
+
                   {/* Transparencia metodológica (condicional) */}
                   <div className="mb-6">
                     <TransparencySection