From 2060f82348cc3112b44623ac7d922fd2ccb5c078 Mon Sep 17 00:00:00 2001
From: "christian.vidal" <christianvidalwolf@gmail.com>
Date: Thu, 29 Jan 2026 20:50:31 +0100
Subject: [PATCH] Fix Forecast View discrepancy: Align Chart/Summary with
 Search Filters

---
 components/ForecastView.tsx | 69 ++++++++++++++++++++-----------------
 1 file changed, 37 insertions(+), 32 deletions(-)

diff --git a/components/ForecastView.tsx b/components/ForecastView.tsx
index 2b8d614..da0dc16 100644
--- a/components/ForecastView.tsx
+++ b/components/ForecastView.tsx
@@ -218,37 +218,8 @@ const ForecastView: React.FC<ForecastViewProps> = ({
         return result;
     }, [data, filters.line, filters.asin, filters.sku]);
 
-    const globalSummary = useMemo(() => {
-        return baseFilteredData.reduce((acc, curr) => {
-            const itemPeriodForecast = activeMonths.reduce((sum, month) => {
-                return sum + (curr.monthlyData?.[month]?.forecastUnits || 0);
-            }, 0);
-
-            return {
-                actualUnits: acc.actualUnits + (curr.actualUnits || 0),
-                forecastUnits: acc.forecastUnits + itemPeriodForecast,
-                annualForecast: acc.annualForecast + (curr.annualForecast || 0),
-            };
-        }, { actualUnits: 0, forecastUnits: 0, annualForecast: 0 });
-    }, [baseFilteredData, activeMonths]);
-
-    const chartData = useMemo(() => {
-        const dataMap = new Map<string, { name: string; actual: number; forecast: number }>();
-        MONTH_ORDER.forEach(m => dataMap.set(m, { name: m, actual: 0, forecast: 0 }));
-
-        baseFilteredData.forEach(item => {
-            if (item.monthlyData) {
-                Object.values(item.monthlyData).forEach((m: any) => {
-                    const entry = dataMap.get(m.month);
-                    if (entry) {
-                        entry.actual += m.actualUnits || 0;
-                        entry.forecast += m.forecastUnits || 0;
-                    }
-                });
-            }
-        });
-        return Array.from(dataMap.values());
-    }, [baseFilteredData]);
+    // [MOVED] chartData moved below processedData to depend on it
+    // [MOVED] globalSummary moved below processedData to depend on it
 
     const calculatedData = useMemo(() => {
         return baseFilteredData.map(item => {
@@ -333,7 +304,41 @@ const ForecastView: React.FC<ForecastViewProps> = ({
         });
 
         return result;
-    }, [calculatedData, debouncedSearch, showOnlyTop50, top50Ranking, top50Mode, sortConfig]);
+    }, [calculatedData, debouncedSearch, showOnlyTop50, top50Ranking, top50Mode, sortConfig, wocFilter, vendorStockMap]);
+
+    // [MOVED HERE] Global Summary - Now respects all filters including Search/WOC
+    const globalSummary = useMemo(() => {
+        return processedData.reduce((acc, curr) => {
+            const itemPeriodForecast = activeMonths.reduce((sum, month) => {
+                return sum + (curr.monthlyData?.[month]?.forecastUnits || 0);
+            }, 0);
+
+            return {
+                actualUnits: acc.actualUnits + (curr.actualUnits || 0),
+                forecastUnits: acc.forecastUnits + itemPeriodForecast,
+                annualForecast: acc.annualForecast + (curr.annualForecast || 0),
+            };
+        }, { actualUnits: 0, forecastUnits: 0, annualForecast: 0 });
+    }, [processedData, activeMonths]);
+
+    // [MOVED HERE] Chart Data - Now respects all filters including Search/WOC
+    const chartData = useMemo(() => {
+        const dataMap = new Map<string, { name: string; actual: number; forecast: number }>();
+        MONTH_ORDER.forEach(m => dataMap.set(m, { name: m, actual: 0, forecast: 0 }));
+
+        processedData.forEach(item => {
+            if (item.monthlyData) {
+                Object.values(item.monthlyData).forEach((m: any) => {
+                    const entry = dataMap.get(m.month);
+                    if (entry) {
+                        entry.actual += m.actualUnits || 0;
+                        entry.forecast += m.forecastUnits || 0;
+                    }
+                });
+            }
+        });
+        return Array.from(dataMap.values());
+    }, [processedData]);
 
     const paginatedData = useMemo(() => processedData.slice(0, displayCount), [processedData, displayCount]);