feat: add header channel selector & adding channel modal menu

app/(dashboard)/page.tsx

@@ -27,26 +27,53 @@ import {
   ShoppingCart,
   Loader2,
 } from "lucide-react";
-import type { AnalyticsOverview } from "@/lib/types/api";
+import type { SpendingAnalytics } from "@/lib/types/api";
+import { useTargetChannel } from "@/components/providers/target-channel-provider";
 
 export default function DashboardPage() {
-  const [overview, setOverview] = useState<AnalyticsOverview | null>(null);
+  const { selectedChannel } = useTargetChannel();
+  const [spending, setSpending] = useState<SpendingAnalytics | null>(null);
   const [loading, setLoading] = useState(true);
 
   useEffect(() => {
-    const loadOverview = async () => {
+    if (!selectedChannel) {
+      setLoading(false);
+      return;
+    }
+
+    const loadData = async () => {
       try {
-        const data = await analyticsApi.overview();
-        setOverview(data);
+        setLoading(true);
+        const data = await analyticsApi.spending({
+          grouping: "week",
+          target_channel_id: selectedChannel.id,
+        });
+        setSpending(data);
       } catch (error) {
-        console.error("Error loading overview:", error);
+        console.error("Error loading spending data:", error);
       } finally {
         setLoading(false);
       }
     };
 
-    loadOverview();
-  }, []);
+    loadData();
+  }, [selectedChannel]);
+
+  if (!selectedChannel) {
+    return (
+      <>
+        <DashboardHeader breadcrumbs={[{ label: "Главная" }]} />
+        <div className="flex flex-1 items-center justify-center">
+          <div className="text-center">
+            <h2 className="text-2xl font-semibold mb-2">Выберите целевой канал</h2>
+            <p className="text-muted-foreground">
+              Для начала работы выберите целевой канал в верхнем меню
+            </p>
+          </div>
+        </div>
+      </>
+    );
+  }
 
   return (
     <>
@@ -66,10 +93,10 @@ export default function DashboardPage() {
               ) : (
                 <>
                   <div className="text-2xl font-bold">
-                    {formatNumber(overview?.totalPurchases)}
+                    {formatNumber(spending?.total_cost)}
                   </div>
                   <p className="text-xs text-muted-foreground">
-                    {formatNumber(overview?.purchasesChange || 0, true)} за
+                    {formatNumber(0 || 0, true)} за
                     прошлый месяц
                   </p>
                 </>
@@ -90,10 +117,10 @@ export default function DashboardPage() {
               ) : (
                 <>
                   <div className="text-2xl font-bold">
-                    {formatNumber(overview?.totalFollowers)}
+                    {formatNumber(spending?.total_subscriptions)}
                   </div>
                   <p className="text-xs text-muted-foreground">
-                    {formatNumber(overview?.followersChange || 0, true)} за
+                    {formatNumber(0 || 0, true)} за
                     прошлый месяц
                   </p>
                 </>
@@ -112,10 +139,10 @@ export default function DashboardPage() {
               ) : (
                 <>
                   <div className="text-2xl font-bold">
-                    ₽{formatMetric(overview?.averageCpf)}
+                    ₽{formatMetric(spending?.avg_cpf)}
                   </div>
                   <p className="text-xs text-muted-foreground">
-                    {formatPercent(overview?.cpfChange || 0, true)} от прошлого
+                    {formatPercent(0 || 0, true)} от прошлого
                     месяца
                   </p>
                 </>
@@ -134,10 +161,10 @@ export default function DashboardPage() {
               ) : (
                 <>
                   <div className="text-2xl font-bold">
-                    ₽{formatMetric(overview?.averageCpm)}
+                    ₽{formatMetric(spending?.avg_cpm)}
                   </div>
                   <p className="text-xs text-muted-foreground">
-                    {formatPercent(overview?.cpmChange || 0, true)} от прошлого
+                    {formatPercent(0 || 0, true)} от прошлого
                     месяца
                   </p>
                 </>