diff --git a/src/app/(admin)/admin/rounds/pipelines/page.tsx b/src/app/(admin)/admin/rounds/pipelines/page.tsx index ad50cb7..c76cd46 100644 --- a/src/app/(admin)/admin/rounds/pipelines/page.tsx +++ b/src/app/(admin)/admin/rounds/pipelines/page.tsx @@ -1,244 +1,257 @@ -'use client' - -import Link from 'next/link' -import type { Route } from 'next' -import { trpc } from '@/lib/trpc/client' -import { Badge } from '@/components/ui/badge' -import { Button } from '@/components/ui/button' -import { - Card, - CardContent, - CardHeader, - CardTitle, -} from '@/components/ui/card' -import { Skeleton } from '@/components/ui/skeleton' +'use client' + +import Link from 'next/link' +import type { Route } from 'next' +import { trpc } from '@/lib/trpc/client' +import { Badge } from '@/components/ui/badge' +import { Button } from '@/components/ui/button' +import { + Card, + CardContent, + CardHeader, + CardTitle, +} from '@/components/ui/card' +import { Skeleton } from '@/components/ui/skeleton' import { Plus, Layers, GitBranch, Calendar, Workflow, + Pencil, + Settings2, } from 'lucide-react' -import { cn } from '@/lib/utils' -import { formatDistanceToNow } from 'date-fns' -import { useEdition } from '@/contexts/edition-context' - -const statusConfig = { - DRAFT: { - label: 'Draft', - bgClass: 'bg-gray-100 text-gray-700', - dotClass: 'bg-gray-500', - }, - ACTIVE: { - label: 'Active', - bgClass: 'bg-emerald-100 text-emerald-700', - dotClass: 'bg-emerald-500', - }, - CLOSED: { - label: 'Closed', - bgClass: 'bg-blue-100 text-blue-700', - dotClass: 'bg-blue-500', - }, - ARCHIVED: { - label: 'Archived', - bgClass: 'bg-muted text-muted-foreground', - dotClass: 'bg-muted-foreground', - }, -} as const - -export default function PipelineListPage() { - const { currentEdition } = useEdition() - const programId = currentEdition?.id - - const { data: pipelines, isLoading } = trpc.pipeline.list.useQuery( - { programId: programId! }, - { enabled: !!programId } - ) - - if (!programId) { - return ( -
-
-
-

Pipelines

-

- Select an edition to view pipelines -

-
-
- - - -

No Edition Selected

-

- Select an edition from the sidebar to view its pipelines -

-
-
-
- ) - } - - return ( -
- {/* Header */} -
-
-

Pipelines

-

- Manage evaluation pipelines for {currentEdition?.name} -

-
-
- - - -
-
- - {/* Loading */} - {isLoading && ( -
- {[1, 2, 3].map((i) => ( - - - - - - - - - - - ))} -
- )} - - {/* Empty State */} - {!isLoading && (!pipelines || pipelines.length === 0) && ( - - -
- -
-

No Pipelines Yet

-

- Pipelines organize your project evaluation workflow into tracks and stages. - Create your first pipeline to get started with managing project evaluations. -

- - - -
-
- )} - - {/* Pipeline Cards */} - {pipelines && pipelines.length > 0 && ( -
- {pipelines.map((pipeline) => { - const status = pipeline.status as keyof typeof statusConfig - const config = statusConfig[status] || statusConfig.DRAFT - const description = (pipeline.settingsJson as Record | null)?.description as string | undefined - +import { cn } from '@/lib/utils' +import { formatDistanceToNow } from 'date-fns' +import { useEdition } from '@/contexts/edition-context' + +const statusConfig = { + DRAFT: { + label: 'Draft', + bgClass: 'bg-gray-100 text-gray-700', + dotClass: 'bg-gray-500', + }, + ACTIVE: { + label: 'Active', + bgClass: 'bg-emerald-100 text-emerald-700', + dotClass: 'bg-emerald-500', + }, + CLOSED: { + label: 'Closed', + bgClass: 'bg-blue-100 text-blue-700', + dotClass: 'bg-blue-500', + }, + ARCHIVED: { + label: 'Archived', + bgClass: 'bg-muted text-muted-foreground', + dotClass: 'bg-muted-foreground', + }, +} as const + +export default function PipelineListPage() { + const { currentEdition } = useEdition() + const programId = currentEdition?.id + + const { data: pipelines, isLoading } = trpc.pipeline.list.useQuery( + { programId: programId! }, + { enabled: !!programId } + ) + + if (!programId) { + return ( +
+
+
+

Pipelines

+

+ Select an edition to view pipelines +

+
+
+ + + +

No Edition Selected

+

+ Select an edition from the sidebar to view its pipelines +

+
+
+
+ ) + } + + return ( +
+ {/* Header */} +
+
+

Pipelines

+

+ Manage evaluation pipelines for {currentEdition?.name} +

+
+
+ + + +
+
+ + {/* Loading */} + {isLoading && ( +
+ {[1, 2, 3].map((i) => ( + + + + + + + + + + + ))} +
+ )} + + {/* Empty State */} + {!isLoading && (!pipelines || pipelines.length === 0) && ( + + +
+ +
+

No Pipelines Yet

+

+ Pipelines organize your project evaluation workflow into tracks and stages. + Create your first pipeline to get started with managing project evaluations. +

+ + + +
+
+ )} + + {/* Pipeline Cards */} + {pipelines && pipelines.length > 0 && ( +
+ {pipelines.map((pipeline) => { + const status = pipeline.status as keyof typeof statusConfig + const config = statusConfig[status] || statusConfig.DRAFT + const description = (pipeline.settingsJson as Record | null)?.description as string | undefined + return ( - - +
- {pipeline.name} + + {pipeline.name} +

{pipeline.slug}

-
- - - {config.label} - -
- - {/* Description */} - {description && ( -

- {description} -

- )} -
- +
+ + + {config.label} + +
+ + {/* Description */} + {description && ( +

+ {description} +

+ )} + + - {/* Track Indicator - Simplified visualization */} -
-
- - - {pipeline._count.tracks === 0 - ? 'No tracks' - : pipeline._count.tracks === 1 - ? '1 track' - : `${pipeline._count.tracks} tracks`} - -
- {pipeline._count.tracks > 0 && ( -
- {Array.from({ length: Math.min(pipeline._count.tracks, 5) }).map((_, i) => ( -
-
-
- ))} - {pipeline._count.tracks > 5 && ( - - +{pipeline._count.tracks - 5} - - )} -
- )} -
- - {/* Stats */} + {/* Track Indicator - Simplified visualization */} +
+
+ + + {pipeline._count.tracks === 0 + ? 'No tracks' + : pipeline._count.tracks === 1 + ? '1 track' + : `${pipeline._count.tracks} tracks`} + +
+ {pipeline._count.tracks > 0 && ( +
+ {Array.from({ length: Math.min(pipeline._count.tracks, 5) }).map((_, i) => ( +
+
+
+ ))} + {pipeline._count.tracks > 5 && ( + + +{pipeline._count.tracks - 5} + + )} +
+ )} +
+ + {/* Stats */}
-
-
- - Routing rules -
- - {pipeline._count.routingRules} - -
- +
+
+ + Routing rules +
+ + {pipeline._count.routingRules} + +
+
Updated {formatDistanceToNow(new Date(pipeline.updatedAt))} ago
+ +
+ + + + + + +
- ) })}
)} -
- ) -} +
+ ) +}