christianV/CrazeAnalytix
1
0
Fork 0
mirror of https://github.com/christianvidalwolf-prog/CrazeAnalytix.git synced 2026-08-03 15:35:22 +02:00
Code Issues Packages Projects Releases Wiki Activity

Feat: add hover tooltip on TOTALS row in Weekly Sales with WoW and YoY comparison

Browse Source 
Shows previous week and same week prior year values (Units, Revenue, Ads Spend, GV) with % change indicators when hovering any week cell in the TOTALS row.

Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Christian Vidal Wolf
2026-04-27 11:22:53 +02:00
co-authored by Claude Sonnet 4.6
parent 550269724a
commit eadbaf3492
7 changed files with 172 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/ForecastView.tsx
+7 -3
View File
@@ -30,6 +30,7 @@ interface ForecastViewProps {
wocFilter: string[];
onWocFilterChange: (newFilters: string[]) => void;
buyBoxLostMap?: Map<string, { countries: string[]; reasons: Record<string, string> }>;
velocityMap?: Map<string, number>;
}
const MONTH_ORDER = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
@@ -42,7 +43,8 @@ const ForecastRow: React.FC<{
stockMap?: Map<string, number>;
vendorStockMap?: Map<string, { eu: number; uk: number }>;
buyBoxLostMap?: Map<string, { countries: string[]; reasons: Record<string, string> }>;
}> = React.memo(({ item, activeMonths, top50Ranking, top50Mode, stockMap, vendorStockMap, buyBoxLostMap }) => {
velocityMap?: Map<string, number>;
}> = React.memo(({ item, activeMonths, top50Ranking, top50Mode, stockMap, vendorStockMap, buyBoxLostMap, velocityMap }) => {
const asin = item.asin.trim().toUpperCase();
const ranks: { rank: number; label: string; theme: 'amber' | 'blue' | 'indigo' }[] = [];
@@ -109,7 +111,7 @@ const ForecastRow: React.FC<{
<StockBadge stock={stockMap.get(item.sku?.replace(/(DE|EN)$/i, ''))} />
)}
{/* WOC Indicator preserved */}
<VendorStockBadge asin={item.asin} vendorStockMap={vendorStockMap} mode={top50Mode} avgWeeklySales={item.avgWeeklySales} />
<VendorStockBadge asin={item.asin} vendorStockMap={vendorStockMap} mode={top50Mode} avgWeeklySales={velocityMap?.get(asin)} />
<BuyBoxWarningBadge asin={asin} buyBoxLostMap={buyBoxLostMap} />
</div>
</div>
@@ -181,7 +183,8 @@ const ForecastView: React.FC<ForecastViewProps> = ({
wocFilter,
onWocFilterChange,
top50Mode,
buyBoxLostMap
buyBoxLostMap,
velocityMap
}) => {
const [searchTerm, setSearchTerm] = useState('');
const [debouncedSearch, setDebouncedSearch] = useState('');
@@ -660,6 +663,7 @@ const ForecastView: React.FC<ForecastViewProps> = ({
stockMap={stockMap}
vendorStockMap={vendorStockMap}
buyBoxLostMap={buyBoxLostMap}
velocityMap={velocityMap}
/>
))}
</tbody>