Add predictions and forecasting analytics

Introduces a new PredictionsChart component and integrates it into the AnalyticsDashboard with a new tab for AI-powered sales, demand, and stock forecasting. Expands analytics-service with types and service functions for predictions, enabling comprehensive future insights for revenue, demand, and inventory.

components/analytics/AnalyticsDashboard.tsx

@@ -75,6 +75,10 @@ const GrowthAnalyticsChart = dynamic(() => import("./GrowthAnalyticsChart"), {
   loading: () => <ChartSkeleton />,
 });
 
+const PredictionsChart = dynamic(() => import("./PredictionsChart"), {
+  loading: () => <ChartSkeleton />,
+});
+
 // Chart loading skeleton
 function ChartSkeleton() {
   return (
@@ -315,7 +319,7 @@ export default function AnalyticsDashboard({
       {/* Analytics Tabs */}
       <div className="space-y-6">
         <Tabs defaultValue="growth" className="space-y-6">
-          <TabsList className="grid w-full grid-cols-2 sm:grid-cols-3 lg:grid-cols-6">
+          <TabsList className="grid w-full grid-cols-2 sm:grid-cols-3 lg:grid-cols-7">
             <TabsTrigger value="growth" className="flex items-center gap-2">
               <Activity className="h-4 w-4" />
               Growth
@@ -340,6 +344,10 @@ export default function AnalyticsDashboard({
               <BarChart3 className="h-4 w-4" />
               Orders
             </TabsTrigger>
+            <TabsTrigger value="predictions" className="flex items-center gap-2">
+              <TrendingUp className="h-4 w-4" />
+              Predictions
+            </TabsTrigger>
           </TabsList>
 
           <TabsContent value="growth" className="space-y-6">
@@ -415,6 +423,12 @@ export default function AnalyticsDashboard({
               <OrderAnalyticsChart timeRange={timeRange} />
             </Suspense>
           </TabsContent>
+
+          <TabsContent value="predictions" className="space-y-6">
+            <Suspense fallback={<ChartSkeleton />}>
+              <PredictionsChart timeRange={parseInt(timeRange)} />
+            </Suspense>
+          </TabsContent>
         </Tabs>
       </div>
     </div>