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

feat: allow drill-down from Weekly Sales to Ads tab via SKU

Browse Source 
- WeeklyGrid.tsx: Add onDrillDown prop and make SKU identifiers clickable
- App.tsx: Implement handleSkuDrillDown to switch view and filter by SKU
This commit is contained in:
Christian Vidal Wolf
2026-01-22 14:06:53 +01:00
parent 25756ae763
commit b23b2fba96
2 changed files with 12 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
App.tsx
+10 -1
View File
@@ -132,6 +132,15 @@ const App: React.FC = () => {
}); });
}; };
const handleSkuDrillDown = useCallback((sku: string) => {
if (!sku) return;
setFilters(prev => ({
...prev,
sku: [sku]
}));
setView('ads');
}, []);
// 1. Initial Load from Cache (IndexedDB) or Auto-Fetch Permanent URL // 1. Initial Load from Cache (IndexedDB) or Auto-Fetch Permanent URL
useEffect(() => { useEffect(() => {
const initApp = async () => { const initApp = async () => {
@@ -491,7 +500,7 @@ const App: React.FC = () => {
)} )}
<Suspense fallback={<LoadingSpinner />}> <Suspense fallback={<LoadingSpinner />}>
{view === 'table' && <DataGrid data={combinedAdsData} hasCustomerFilter={filters.customer.length > 0} adsData={filteredAdsData} />} {view === 'table' && <DataGrid data={combinedAdsData} hasCustomerFilter={filters.customer.length > 0} adsData={filteredAdsData} />}
{view === 'weekly' && <WeeklyGrid data={combinedAdsData} top50Ranking={top50Ranking2025} />} {view === 'weekly' && <WeeklyGrid data={combinedAdsData} top50Ranking={top50Ranking2025} onDrillDown={handleSkuDrillDown} />}
{view === 'movers' && <TopMovers data={filteredData} />} {view === 'movers' && <TopMovers data={filteredData} />}
{view === 'ads' && <AdsPerformance data={combinedAdsData} filters={filters} />} {view === 'ads' && <AdsPerformance data={combinedAdsData} filters={filters} />}
</Suspense> </Suspense>
components/WeeklyGrid.tsx
+2 -1
View File
@@ -11,6 +11,7 @@ interface WeeklyGridProps {
eu?: Map<string, number>; eu?: Map<string, number>;
uk?: Map<string, number>; uk?: Map<string, number>;
}; };
onDrillDown?: (sku: string) => void;
} }
type SortConfig = { type SortConfig = {
@@ -52,7 +53,7 @@ const Top50Badge: React.FC<{ rank: number; label?: string; theme?: 'amber' | 'bl
); );
}; };
const WeeklyGrid: React.FC<WeeklyGridProps> = ({ data, top50Ranking }) => { const WeeklyGrid: React.FC<WeeklyGridProps> = ({ data, top50Ranking, onDrillDown }) => {
// Pivot data - memoized // Pivot data - memoized
const { rows, weeks: allWeeks } = useMemo(() => pivotWeeklySalesData(data), [data]); const { rows, weeks: allWeeks } = useMemo(() => pivotWeeklySalesData(data), [data]);