feat: projects selector replace
This commit is contained in:
@@ -16,6 +16,7 @@ import {
|
|||||||
import { DashboardHeader } from "@/components/layout/dashboard-header";
|
import { DashboardHeader } from "@/components/layout/dashboard-header";
|
||||||
import { useWorkspace } from "@/components/providers/workspace-provider";
|
import { useWorkspace } from "@/components/providers/workspace-provider";
|
||||||
import { demoAwareAnalyticsApi } from "@/lib/demo";
|
import { demoAwareAnalyticsApi } from "@/lib/demo";
|
||||||
|
import { ProjectSelector } from "@/components/project-selector";
|
||||||
import {
|
import {
|
||||||
Card,
|
Card,
|
||||||
CardContent,
|
CardContent,
|
||||||
@@ -169,6 +170,7 @@ export default function ChannelsAnalyticsPage() {
|
|||||||
/>
|
/>
|
||||||
|
|
||||||
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4">
|
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4">
|
||||||
|
<div className="flex items-center justify-between">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-2xl font-bold tracking-tight">
|
<h1 className="text-2xl font-bold tracking-tight">
|
||||||
Аналитика по каналам
|
Аналитика по каналам
|
||||||
@@ -177,6 +179,8 @@ export default function ChannelsAnalyticsPage() {
|
|||||||
Эффективность каналов размещения
|
Эффективность каналов размещения
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
<ProjectSelector />
|
||||||
|
</div>
|
||||||
|
|
||||||
{loading ? (
|
{loading ? (
|
||||||
<div className="flex items-center justify-center py-12">
|
<div className="flex items-center justify-center py-12">
|
||||||
|
|||||||
@@ -17,6 +17,7 @@ import {
|
|||||||
import { DashboardHeader } from "@/components/layout/dashboard-header";
|
import { DashboardHeader } from "@/components/layout/dashboard-header";
|
||||||
import { useWorkspace } from "@/components/providers/workspace-provider";
|
import { useWorkspace } from "@/components/providers/workspace-provider";
|
||||||
import { demoAwareAnalyticsApi } from "@/lib/demo";
|
import { demoAwareAnalyticsApi } from "@/lib/demo";
|
||||||
|
import { ProjectSelector } from "@/components/project-selector";
|
||||||
import {
|
import {
|
||||||
Card,
|
Card,
|
||||||
CardContent,
|
CardContent,
|
||||||
@@ -189,6 +190,7 @@ export default function CreativesAnalyticsPage() {
|
|||||||
/>
|
/>
|
||||||
|
|
||||||
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4">
|
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4">
|
||||||
|
<div className="flex items-center justify-between">
|
||||||
<div>
|
<div>
|
||||||
<h1 className="text-2xl font-bold tracking-tight">
|
<h1 className="text-2xl font-bold tracking-tight">
|
||||||
Аналитика по креативам
|
Аналитика по креативам
|
||||||
@@ -197,6 +199,8 @@ export default function CreativesAnalyticsPage() {
|
|||||||
Сравнение эффективности рекламных материалов
|
Сравнение эффективности рекламных материалов
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
<ProjectSelector />
|
||||||
|
</div>
|
||||||
|
|
||||||
{loading ? (
|
{loading ? (
|
||||||
<div className="flex items-center justify-center py-12">
|
<div className="flex items-center justify-center py-12">
|
||||||
|
|||||||
@@ -19,6 +19,7 @@ import {
|
|||||||
import { DashboardHeader } from "@/components/layout/dashboard-header";
|
import { DashboardHeader } from "@/components/layout/dashboard-header";
|
||||||
import { useWorkspace } from "@/components/providers/workspace-provider";
|
import { useWorkspace } from "@/components/providers/workspace-provider";
|
||||||
import { demoAwareAnalyticsApi } from "@/lib/demo";
|
import { demoAwareAnalyticsApi } from "@/lib/demo";
|
||||||
|
import { ProjectSelector } from "@/components/project-selector";
|
||||||
import {
|
import {
|
||||||
Card,
|
Card,
|
||||||
CardContent,
|
CardContent,
|
||||||
@@ -26,7 +27,6 @@ import {
|
|||||||
CardHeader,
|
CardHeader,
|
||||||
CardTitle,
|
CardTitle,
|
||||||
} from "@/components/ui/card";
|
} from "@/components/ui/card";
|
||||||
import { Badge } from "@/components/ui/badge";
|
|
||||||
import { Alert, AlertDescription } from "@/components/ui/alert";
|
import { Alert, AlertDescription } from "@/components/ui/alert";
|
||||||
import type { SpendingAnalytics } from "@/lib/types/api";
|
import type { SpendingAnalytics } from "@/lib/types/api";
|
||||||
|
|
||||||
@@ -97,13 +97,6 @@ export default function AnalyticsPage() {
|
|||||||
? (spending.total_cost / spending.total_views) * 1000
|
? (spending.total_cost / spending.total_views) * 1000
|
||||||
: null;
|
: null;
|
||||||
|
|
||||||
// Selection info text
|
|
||||||
const selectionText = allProjectsSelected
|
|
||||||
? "Все проекты"
|
|
||||||
: selectedProjects.length === 1
|
|
||||||
? selectedProjects[0].title
|
|
||||||
: `${selectedProjects.length} проекта`;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<DashboardHeader
|
<DashboardHeader
|
||||||
@@ -121,9 +114,7 @@ export default function AnalyticsPage() {
|
|||||||
Обзор эффективности рекламных размещений
|
Обзор эффективности рекламных размещений
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<Badge variant="outline" className="text-sm">
|
<ProjectSelector />
|
||||||
{selectionText}
|
|
||||||
</Badge>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{selectedProjects.length > 1 && !allProjectsSelected && (
|
{selectedProjects.length > 1 && !allProjectsSelected && (
|
||||||
|
|||||||
@@ -20,6 +20,7 @@ import {
|
|||||||
import { DashboardHeader } from "@/components/layout/dashboard-header";
|
import { DashboardHeader } from "@/components/layout/dashboard-header";
|
||||||
import { useWorkspace } from "@/components/providers/workspace-provider";
|
import { useWorkspace } from "@/components/providers/workspace-provider";
|
||||||
import { demoAwareAnalyticsApi } from "@/lib/demo";
|
import { demoAwareAnalyticsApi } from "@/lib/demo";
|
||||||
|
import { ProjectSelector } from "@/components/project-selector";
|
||||||
import {
|
import {
|
||||||
Card,
|
Card,
|
||||||
CardContent,
|
CardContent,
|
||||||
@@ -288,6 +289,8 @@ export default function SpendingAnalyticsPage() {
|
|||||||
<h1 className="text-2xl font-bold tracking-tight">Динамика расходов</h1>
|
<h1 className="text-2xl font-bold tracking-tight">Динамика расходов</h1>
|
||||||
<p className="text-muted-foreground">Анализ расходов по периодам</p>
|
<p className="text-muted-foreground">Анализ расходов по периодам</p>
|
||||||
</div>
|
</div>
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
<ProjectSelector />
|
||||||
<Select value={grouping} onValueChange={(v) => setGrouping(v as DateGrouping)}>
|
<Select value={grouping} onValueChange={(v) => setGrouping(v as DateGrouping)}>
|
||||||
<SelectTrigger className="w-[180px]">
|
<SelectTrigger className="w-[180px]">
|
||||||
<SelectValue />
|
<SelectValue />
|
||||||
@@ -299,6 +302,7 @@ export default function SpendingAnalyticsPage() {
|
|||||||
</SelectContent>
|
</SelectContent>
|
||||||
</Select>
|
</Select>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
{loading ? (
|
{loading ? (
|
||||||
<div className="flex items-center justify-center py-12">
|
<div className="flex items-center justify-center py-12">
|
||||||
|
|||||||
@@ -168,7 +168,6 @@ export default function ChannelsCatalogPage() {
|
|||||||
{ label: "Главная", href: `/dashboard/${workspaceId}` },
|
{ label: "Главная", href: `/dashboard/${workspaceId}` },
|
||||||
{ label: "Каталог каналов" },
|
{ label: "Каталог каналов" },
|
||||||
]}
|
]}
|
||||||
showProjectSelector={false}
|
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4">
|
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4">
|
||||||
|
|||||||
@@ -71,6 +71,7 @@ import {
|
|||||||
DialogTitle,
|
DialogTitle,
|
||||||
} from "@/components/ui/dialog";
|
} from "@/components/ui/dialog";
|
||||||
import { BOT_USERNAME } from "@/lib/utils/constants";
|
import { BOT_USERNAME } from "@/lib/utils/constants";
|
||||||
|
import { ProjectSelector } from "@/components/project-selector";
|
||||||
import type { Creative, CreativeAnalyticsItem } from "@/lib/types/api";
|
import type { Creative, CreativeAnalyticsItem } from "@/lib/types/api";
|
||||||
|
|
||||||
// ============================================================================
|
// ============================================================================
|
||||||
@@ -287,6 +288,7 @@ export default function CreativesPage() {
|
|||||||
className="pl-10"
|
className="pl-10"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
<ProjectSelector />
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<Checkbox
|
<Checkbox
|
||||||
id="include-archived"
|
id="include-archived"
|
||||||
|
|||||||
@@ -35,6 +35,7 @@ type DateRangeType = {
|
|||||||
import { DashboardHeader } from "@/components/layout/dashboard-header";
|
import { DashboardHeader } from "@/components/layout/dashboard-header";
|
||||||
import { useWorkspace } from "@/components/providers/workspace-provider";
|
import { useWorkspace } from "@/components/providers/workspace-provider";
|
||||||
import { demoAwareAnalyticsApi } from "@/lib/demo";
|
import { demoAwareAnalyticsApi } from "@/lib/demo";
|
||||||
|
import { ProjectSelector } from "@/components/project-selector";
|
||||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||||
import {
|
import {
|
||||||
ChartContainer,
|
ChartContainer,
|
||||||
@@ -300,6 +301,8 @@ export default function DashboardPage() {
|
|||||||
<p className="text-sm text-muted-foreground">Статистика за период</p>
|
<p className="text-sm text-muted-foreground">Статистика за период</p>
|
||||||
<p className="text-base font-semibold">{dateRangeLabel}</p>
|
<p className="text-base font-semibold">{dateRangeLabel}</p>
|
||||||
</div>
|
</div>
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
<ProjectSelector />
|
||||||
<Popover>
|
<Popover>
|
||||||
<PopoverTrigger asChild>
|
<PopoverTrigger asChild>
|
||||||
<Button
|
<Button
|
||||||
@@ -337,6 +340,7 @@ export default function DashboardPage() {
|
|||||||
</PopoverContent>
|
</PopoverContent>
|
||||||
</Popover>
|
</Popover>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
{/* Строка 1 — компактные показатели */}
|
{/* Строка 1 — компактные показатели */}
|
||||||
<div className="grid gap-4 md:grid-cols-2 xl:grid-cols-6">
|
<div className="grid gap-4 md:grid-cols-2 xl:grid-cols-6">
|
||||||
|
|||||||
@@ -55,6 +55,7 @@ import {
|
|||||||
} from "@/components/ui/tooltip";
|
} from "@/components/ui/tooltip";
|
||||||
import { Checkbox } from "@/components/ui/checkbox";
|
import { Checkbox } from "@/components/ui/checkbox";
|
||||||
import { Label } from "@/components/ui/label";
|
import { Label } from "@/components/ui/label";
|
||||||
|
import { ProjectSelector } from "@/components/project-selector";
|
||||||
import type { Placement } from "@/lib/types/api";
|
import type { Placement } from "@/lib/types/api";
|
||||||
|
|
||||||
// ============================================================================
|
// ============================================================================
|
||||||
@@ -498,6 +499,7 @@ export default function PlacementsPage() {
|
|||||||
className="pl-10"
|
className="pl-10"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
<ProjectSelector />
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<Checkbox
|
<Checkbox
|
||||||
id="include-archived"
|
id="include-archived"
|
||||||
|
|||||||
@@ -148,7 +148,6 @@ export default function ProjectsPage() {
|
|||||||
{ label: "Главная", href: `/dashboard/${currentWorkspace?.id}` },
|
{ label: "Главная", href: `/dashboard/${currentWorkspace?.id}` },
|
||||||
{ label: "Проекты" },
|
{ label: "Проекты" },
|
||||||
]}
|
]}
|
||||||
showProjectSelector={false}
|
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4">
|
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4">
|
||||||
|
|||||||
@@ -329,7 +329,7 @@ export default function PurchasePlanDetailPage() {
|
|||||||
if (loading) {
|
if (loading) {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<DashboardHeader breadcrumbs={[{ label: "Загрузка..." }]} showProjectSelector={false} />
|
<DashboardHeader breadcrumbs={[{ label: "Загрузка..." }]} />
|
||||||
<div className="flex items-center justify-center py-12">
|
<div className="flex items-center justify-center py-12">
|
||||||
<Loader2 className="h-8 w-8 animate-spin text-muted-foreground" />
|
<Loader2 className="h-8 w-8 animate-spin text-muted-foreground" />
|
||||||
</div>
|
</div>
|
||||||
@@ -345,7 +345,6 @@ export default function PurchasePlanDetailPage() {
|
|||||||
{ label: "Планы закупок", href: `/dashboard/${workspaceId}/purchase-plans` },
|
{ label: "Планы закупок", href: `/dashboard/${workspaceId}/purchase-plans` },
|
||||||
{ label: project?.title || "План закупок" },
|
{ label: project?.title || "План закупок" },
|
||||||
]}
|
]}
|
||||||
showProjectSelector={false}
|
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4">
|
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4">
|
||||||
|
|||||||
@@ -118,7 +118,6 @@ export default function PurchasePlansPage() {
|
|||||||
{ label: "Главная", href: `/dashboard/${workspaceId}` },
|
{ label: "Главная", href: `/dashboard/${workspaceId}` },
|
||||||
{ label: "Планы закупок" },
|
{ label: "Планы закупок" },
|
||||||
]}
|
]}
|
||||||
showProjectSelector={false}
|
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4">
|
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4">
|
||||||
|
|||||||
@@ -132,7 +132,6 @@ export default function InvitesPage() {
|
|||||||
{ label: "Настройки", href: `/dashboard/${workspaceId}/settings` },
|
{ label: "Настройки", href: `/dashboard/${workspaceId}/settings` },
|
||||||
{ label: "Приглашения" },
|
{ label: "Приглашения" },
|
||||||
]}
|
]}
|
||||||
showProjectSelector={false}
|
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4">
|
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4">
|
||||||
|
|||||||
@@ -136,7 +136,6 @@ export default function MembersPage() {
|
|||||||
{ label: "Настройки", href: `/dashboard/${workspaceId}/settings` },
|
{ label: "Настройки", href: `/dashboard/${workspaceId}/settings` },
|
||||||
{ label: "Участники" },
|
{ label: "Участники" },
|
||||||
]}
|
]}
|
||||||
showProjectSelector={false}
|
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4">
|
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4">
|
||||||
|
|||||||
@@ -86,7 +86,6 @@ export default function SettingsPage() {
|
|||||||
{ label: "Главная", href: `/dashboard/${workspaceId}` },
|
{ label: "Главная", href: `/dashboard/${workspaceId}` },
|
||||||
{ label: "Настройки" },
|
{ label: "Настройки" },
|
||||||
]}
|
]}
|
||||||
showProjectSelector={false}
|
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4 max-w-2xl">
|
<div className="flex flex-1 flex-col gap-4 p-4 pt-0 mt-4 max-w-2xl">
|
||||||
|
|||||||
@@ -15,7 +15,6 @@ import {
|
|||||||
BreadcrumbSeparator,
|
BreadcrumbSeparator,
|
||||||
} from "@/components/ui/breadcrumb";
|
} from "@/components/ui/breadcrumb";
|
||||||
import { ThemeToggle } from "@/components/theme-toggle";
|
import { ThemeToggle } from "@/components/theme-toggle";
|
||||||
import { ProjectSelector } from "@/components/project-selector";
|
|
||||||
import React from "react";
|
import React from "react";
|
||||||
|
|
||||||
interface BreadcrumbItemType {
|
interface BreadcrumbItemType {
|
||||||
@@ -25,12 +24,10 @@ interface BreadcrumbItemType {
|
|||||||
|
|
||||||
interface DashboardHeaderProps {
|
interface DashboardHeaderProps {
|
||||||
breadcrumbs?: BreadcrumbItemType[];
|
breadcrumbs?: BreadcrumbItemType[];
|
||||||
showProjectSelector?: boolean;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export const DashboardHeader: React.FC<DashboardHeaderProps> = ({
|
export const DashboardHeader: React.FC<DashboardHeaderProps> = ({
|
||||||
breadcrumbs = [],
|
breadcrumbs = [],
|
||||||
showProjectSelector = true,
|
|
||||||
}) => {
|
}) => {
|
||||||
return (
|
return (
|
||||||
<header className="flex h-16 shrink-0 items-center gap-2 border-b px-4">
|
<header className="flex h-16 shrink-0 items-center gap-2 border-b px-4">
|
||||||
@@ -55,7 +52,6 @@ export const DashboardHeader: React.FC<DashboardHeaderProps> = ({
|
|||||||
</Breadcrumb>
|
</Breadcrumb>
|
||||||
)}
|
)}
|
||||||
<div className="ml-auto flex items-center gap-2">
|
<div className="ml-auto flex items-center gap-2">
|
||||||
{showProjectSelector && <ProjectSelector />}
|
|
||||||
<ThemeToggle />
|
<ThemeToggle />
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|||||||
Reference in New Issue
Block a user