feat: add Detail Level BSR metric to experiments analysis

components/Dashboard.tsx

@@ -1,15 +1,17 @@
 
 import React, { useState, useMemo, useEffect } from 'react';
-import { AggregatedData, GrowthMetric, AdsRecord } from '../types';
+import { AggregatedData, GrowthMetric, AdsRecord, SalesRecord } from '../types';
 import {
     BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer,
     LineChart, Line, Legend
 } from 'recharts';
+import TopMovers from './TopMovers';
 
 interface DashboardProps {
     data: AggregatedData;
     contextData?: AggregatedData | null;
     adsData?: AdsRecord[];
+    rawData?: SalesRecord[];
 }
 
 const COLORS = ['#6366f1', '#ec4899', '#10b981', '#f59e0b', '#8b5cf6', '#0ea5e9'];
@@ -457,7 +459,7 @@ const GrowthTable: React.FC<{
     );
 }
 
-const Dashboard: React.FC<DashboardProps> = ({ data, contextData, adsData = [] }) => {
+const Dashboard: React.FC<DashboardProps> = ({ data, contextData, adsData = [], rawData = [] }) => {
     const [seasonalityMetric, setSeasonalityMetric] = useState<'sellOut' | 'units'>('sellOut');
     const [top10Metric, setTop10Metric] = useState<'sellOut' | 'units'>('sellOut');
 
@@ -808,6 +810,13 @@ const Dashboard: React.FC<DashboardProps> = ({ data, contextData, adsData = [] }
                     </ExpandableCard>
                 </div>
             </div>
+
+            {/* Top Movers Table - Full Width */}
+            {rawData && rawData.length > 0 && (
+                <div className="mt-6">
+                    <TopMovers data={rawData} />
+                </div>
+            )}
         </div>
     );
 };