Pool page: add bulk assign-to-round, enhance project pool UI
- Add assignAllToRound mutation to project-pool router - Rewrite pool page with round selector, bulk assignment, and better layout - Add pool navigation link to admin projects page Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
4c0efb232c
commit
2fb26d4734
|
|
@ -622,6 +622,12 @@ export default function ProjectsPage() {
|
|||
<Bot className="mr-2 h-4 w-4" />
|
||||
AI Tags
|
||||
</Button>
|
||||
<Button variant="outline" asChild>
|
||||
<Link href="/admin/projects/pool">
|
||||
<Layers className="mr-2 h-4 w-4" />
|
||||
Assign to Round
|
||||
</Link>
|
||||
</Button>
|
||||
<Button variant="outline" asChild>
|
||||
<Link href="/admin/projects/bulk-upload">
|
||||
<FileUp className="mr-2 h-4 w-4" />
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
'use client'
|
||||
|
||||
import { useState } from 'react'
|
||||
import Link from 'next/link'
|
||||
import type { Route } from 'next'
|
||||
import { trpc } from '@/lib/trpc/client'
|
||||
import { Button } from '@/components/ui/button'
|
||||
import { Checkbox } from '@/components/ui/checkbox'
|
||||
|
|
@ -24,14 +26,14 @@ import { Input } from '@/components/ui/input'
|
|||
import { Card } from '@/components/ui/card'
|
||||
import { Skeleton } from '@/components/ui/skeleton'
|
||||
import { toast } from 'sonner'
|
||||
import { ChevronLeft, ChevronRight, Loader2 } from 'lucide-react'
|
||||
import Link from 'next/link'
|
||||
import { ArrowLeft, ChevronLeft, ChevronRight, Loader2 } from 'lucide-react'
|
||||
|
||||
export default function ProjectPoolPage() {
|
||||
const [selectedProgramId, setSelectedProgramId] = useState<string>('')
|
||||
const [selectedProjects, setSelectedProjects] = useState<string[]>([])
|
||||
const [assignDialogOpen, setAssignDialogOpen] = useState(false)
|
||||
const [targetStageId, setTargetStageId] = useState<string>('')
|
||||
const [assignAllDialogOpen, setAssignAllDialogOpen] = useState(false)
|
||||
const [targetRoundId, setTargetRoundId] = useState<string>('')
|
||||
const [searchQuery, setSearchQuery] = useState('')
|
||||
const [categoryFilter, setCategoryFilter] = useState<'STARTUP' | 'BUSINESS_CONCEPT' | 'all'>('all')
|
||||
const [currentPage, setCurrentPage] = useState(1)
|
||||
|
|
@ -50,34 +52,61 @@ export default function ProjectPoolPage() {
|
|||
{ enabled: !!selectedProgramId }
|
||||
)
|
||||
|
||||
// Get stages from the selected program (program.list includes rounds/stages)
|
||||
const { data: selectedProgramData, isLoading: isLoadingStages } = trpc.program.get.useQuery(
|
||||
// Load rounds from program (program.get returns rounds from all competitions)
|
||||
const { data: programData, isLoading: isLoadingRounds } = trpc.program.get.useQuery(
|
||||
{ id: selectedProgramId },
|
||||
{ enabled: !!selectedProgramId }
|
||||
)
|
||||
const stages = (selectedProgramData?.stages || []) as Array<{ id: string; name: string }>
|
||||
const rounds = (programData?.rounds || []) as Array<{ id: string; name: string; roundType: string; sortOrder: number }>
|
||||
|
||||
const utils = trpc.useUtils()
|
||||
|
||||
const assignMutation = trpc.projectPool.assignToRound.useMutation({
|
||||
onSuccess: (result) => {
|
||||
utils.project.list.invalidate()
|
||||
utils.program.get.invalidate()
|
||||
utils.projectPool.listUnassigned.invalidate()
|
||||
toast.success(`Assigned ${result.assignedCount} project${result.assignedCount !== 1 ? 's' : ''} to round`)
|
||||
setSelectedProjects([])
|
||||
setAssignDialogOpen(false)
|
||||
setTargetStageId('')
|
||||
setTargetRoundId('')
|
||||
refetch()
|
||||
},
|
||||
onError: (error: any) => {
|
||||
toast.error(error.message || 'Failed to assign projects')
|
||||
onError: (error: unknown) => {
|
||||
toast.error((error as { message?: string }).message || 'Failed to assign projects')
|
||||
},
|
||||
})
|
||||
|
||||
const assignAllMutation = trpc.projectPool.assignAllToRound.useMutation({
|
||||
onSuccess: (result) => {
|
||||
utils.project.list.invalidate()
|
||||
utils.projectPool.listUnassigned.invalidate()
|
||||
toast.success(`Assigned all ${result.assignedCount} projects to round`)
|
||||
setSelectedProjects([])
|
||||
setAssignAllDialogOpen(false)
|
||||
setTargetRoundId('')
|
||||
refetch()
|
||||
},
|
||||
onError: (error: unknown) => {
|
||||
toast.error((error as { message?: string }).message || 'Failed to assign projects')
|
||||
},
|
||||
})
|
||||
|
||||
const isPending = assignMutation.isPending || assignAllMutation.isPending
|
||||
|
||||
const handleBulkAssign = () => {
|
||||
if (selectedProjects.length === 0 || !targetStageId) return
|
||||
if (selectedProjects.length === 0 || !targetRoundId) return
|
||||
assignMutation.mutate({
|
||||
projectIds: selectedProjects,
|
||||
roundId: targetStageId,
|
||||
roundId: targetRoundId,
|
||||
})
|
||||
}
|
||||
|
||||
const handleAssignAll = () => {
|
||||
if (!targetRoundId || !selectedProgramId) return
|
||||
assignAllMutation.mutate({
|
||||
programId: selectedProgramId,
|
||||
roundId: targetRoundId,
|
||||
competitionCategory: categoryFilter === 'all' ? undefined : categoryFilter,
|
||||
})
|
||||
}
|
||||
|
||||
|
|
@ -108,14 +137,21 @@ export default function ProjectPoolPage() {
|
|||
return (
|
||||
<div className="space-y-6">
|
||||
{/* Header */}
|
||||
<div>
|
||||
<h1 className="text-2xl font-semibold">Project Pool</h1>
|
||||
<p className="text-muted-foreground">
|
||||
Assign unassigned projects to evaluation stages
|
||||
</p>
|
||||
<div className="flex items-start gap-3">
|
||||
<Link href={"/admin/projects" as Route} className="mt-1 shrink-0">
|
||||
<Button variant="ghost" size="icon" className="h-8 w-8">
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
</Button>
|
||||
</Link>
|
||||
<div>
|
||||
<h1 className="text-2xl font-semibold">Project Pool</h1>
|
||||
<p className="text-muted-foreground">
|
||||
Assign unassigned projects to competition rounds
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Program Selector */}
|
||||
{/* Filters */}
|
||||
<Card className="p-4">
|
||||
<div className="flex flex-col gap-4 md:flex-row md:items-end">
|
||||
<div className="flex-1 space-y-2">
|
||||
|
|
@ -140,8 +176,8 @@ export default function ProjectPoolPage() {
|
|||
|
||||
<div className="flex-1 space-y-2">
|
||||
<label className="text-sm font-medium">Category</label>
|
||||
<Select value={categoryFilter} onValueChange={(value: any) => {
|
||||
setCategoryFilter(value)
|
||||
<Select value={categoryFilter} onValueChange={(value: string) => {
|
||||
setCategoryFilter(value as 'STARTUP' | 'BUSINESS_CONCEPT' | 'all')
|
||||
setCurrentPage(1)
|
||||
}}>
|
||||
<SelectTrigger>
|
||||
|
|
@ -166,15 +202,32 @@ export default function ProjectPoolPage() {
|
|||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{selectedProjects.length > 0 && (
|
||||
<Button onClick={() => setAssignDialogOpen(true)} className="whitespace-nowrap">
|
||||
Assign {selectedProjects.length} Project{selectedProjects.length > 1 ? 's' : ''}
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
{/* Action bar */}
|
||||
{selectedProgramId && poolData && poolData.total > 0 && (
|
||||
<div className="flex items-center justify-between">
|
||||
<p className="text-sm text-muted-foreground">
|
||||
<span className="font-medium text-foreground">{poolData.total}</span> unassigned project{poolData.total !== 1 ? 's' : ''}
|
||||
</p>
|
||||
<div className="flex items-center gap-2">
|
||||
{selectedProjects.length > 0 && (
|
||||
<Button onClick={() => setAssignDialogOpen(true)} size="sm">
|
||||
Assign {selectedProjects.length} Selected
|
||||
</Button>
|
||||
)}
|
||||
<Button
|
||||
variant="default"
|
||||
size="sm"
|
||||
onClick={() => setAssignAllDialogOpen(true)}
|
||||
>
|
||||
Assign All {poolData.total} to Round
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Projects Table */}
|
||||
{selectedProgramId && (
|
||||
<>
|
||||
|
|
@ -195,7 +248,7 @@ export default function ProjectPoolPage() {
|
|||
<tr className="text-sm">
|
||||
<th className="p-3 text-left">
|
||||
<Checkbox
|
||||
checked={selectedProjects.length === poolData.projects.length && poolData.projects.length > 0}
|
||||
checked={poolData.projects.length > 0 && selectedProjects.length === poolData.projects.length}
|
||||
onCheckedChange={toggleSelectAll}
|
||||
/>
|
||||
</th>
|
||||
|
|
@ -203,7 +256,7 @@ export default function ProjectPoolPage() {
|
|||
<th className="p-3 text-left font-medium">Category</th>
|
||||
<th className="p-3 text-left font-medium">Country</th>
|
||||
<th className="p-3 text-left font-medium">Submitted</th>
|
||||
<th className="p-3 text-left font-medium">Action</th>
|
||||
<th className="p-3 text-left font-medium">Quick Assign</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
|
@ -217,7 +270,7 @@ export default function ProjectPoolPage() {
|
|||
</td>
|
||||
<td className="p-3">
|
||||
<Link
|
||||
href={`/admin/projects/${project.id}`}
|
||||
href={`/admin/projects/${project.id}` as Route}
|
||||
className="hover:underline"
|
||||
>
|
||||
<div className="font-medium">{project.title}</div>
|
||||
|
|
@ -225,9 +278,11 @@ export default function ProjectPoolPage() {
|
|||
</Link>
|
||||
</td>
|
||||
<td className="p-3">
|
||||
<Badge variant="outline">
|
||||
{project.competitionCategory === 'STARTUP' ? 'Startup' : 'Business Concept'}
|
||||
</Badge>
|
||||
{project.competitionCategory && (
|
||||
<Badge variant="outline">
|
||||
{project.competitionCategory === 'STARTUP' ? 'Startup' : 'Business Concept'}
|
||||
</Badge>
|
||||
)}
|
||||
</td>
|
||||
<td className="p-3 text-sm text-muted-foreground">
|
||||
{project.country || '-'}
|
||||
|
|
@ -238,20 +293,20 @@ export default function ProjectPoolPage() {
|
|||
: '-'}
|
||||
</td>
|
||||
<td className="p-3">
|
||||
{isLoadingStages ? (
|
||||
{isLoadingRounds ? (
|
||||
<Skeleton className="h-9 w-[200px]" />
|
||||
) : (
|
||||
<Select
|
||||
onValueChange={(roundId) => handleQuickAssign(project.id, roundId)}
|
||||
disabled={assignMutation.isPending}
|
||||
disabled={isPending}
|
||||
>
|
||||
<SelectTrigger className="w-[200px]">
|
||||
<SelectValue placeholder="Assign to stage..." />
|
||||
<SelectValue placeholder="Assign to round..." />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{stages?.map((stage: { id: string; name: string }) => (
|
||||
<SelectItem key={stage.id} value={stage.id}>
|
||||
{stage.name}
|
||||
{rounds.map((round) => (
|
||||
<SelectItem key={round.id} value={round.id}>
|
||||
{round.name}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
|
|
@ -269,7 +324,7 @@ export default function ProjectPoolPage() {
|
|||
{poolData.totalPages > 1 && (
|
||||
<div className="flex items-center justify-between">
|
||||
<p className="text-sm text-muted-foreground">
|
||||
Showing {((currentPage - 1) * perPage) + 1} to {Math.min(currentPage * perPage, poolData.total)} of {poolData.total} projects
|
||||
Showing {((currentPage - 1) * perPage) + 1} to {Math.min(currentPage * perPage, poolData.total)} of {poolData.total}
|
||||
</p>
|
||||
<div className="flex gap-2">
|
||||
<Button
|
||||
|
|
@ -308,24 +363,24 @@ export default function ProjectPoolPage() {
|
|||
</Card>
|
||||
)}
|
||||
|
||||
{/* Bulk Assignment Dialog */}
|
||||
{/* Bulk Assignment Dialog (selected projects) */}
|
||||
<Dialog open={assignDialogOpen} onOpenChange={setAssignDialogOpen}>
|
||||
<DialogContent>
|
||||
<DialogHeader>
|
||||
<DialogTitle>Assign Projects to Stage</DialogTitle>
|
||||
<DialogTitle>Assign Selected Projects</DialogTitle>
|
||||
<DialogDescription>
|
||||
Assign {selectedProjects.length} selected project{selectedProjects.length > 1 ? 's' : ''} to:
|
||||
Assign {selectedProjects.length} selected project{selectedProjects.length > 1 ? 's' : ''} to a round:
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
<div className="space-y-4 py-4">
|
||||
<Select value={targetStageId} onValueChange={setTargetStageId}>
|
||||
<Select value={targetRoundId} onValueChange={setTargetRoundId}>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select stage..." />
|
||||
<SelectValue placeholder="Select round..." />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{stages?.map((stage: { id: string; name: string }) => (
|
||||
<SelectItem key={stage.id} value={stage.id}>
|
||||
{stage.name}
|
||||
{rounds.map((round) => (
|
||||
<SelectItem key={round.id} value={round.id}>
|
||||
{round.name}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
|
|
@ -337,10 +392,48 @@ export default function ProjectPoolPage() {
|
|||
</Button>
|
||||
<Button
|
||||
onClick={handleBulkAssign}
|
||||
disabled={!targetStageId || assignMutation.isPending}
|
||||
disabled={!targetRoundId || isPending}
|
||||
>
|
||||
{assignMutation.isPending && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
|
||||
Assign
|
||||
Assign {selectedProjects.length} Projects
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
|
||||
{/* Assign ALL Dialog */}
|
||||
<Dialog open={assignAllDialogOpen} onOpenChange={setAssignAllDialogOpen}>
|
||||
<DialogContent>
|
||||
<DialogHeader>
|
||||
<DialogTitle>Assign All Unassigned Projects</DialogTitle>
|
||||
<DialogDescription>
|
||||
This will assign all {poolData?.total || 0}{categoryFilter !== 'all' ? ` ${categoryFilter === 'STARTUP' ? 'Startup' : 'Business Concept'}` : ''} unassigned projects to a round in one operation.
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
<div className="space-y-4 py-4">
|
||||
<Select value={targetRoundId} onValueChange={setTargetRoundId}>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select round..." />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{rounds.map((round) => (
|
||||
<SelectItem key={round.id} value={round.id}>
|
||||
{round.name}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<DialogFooter>
|
||||
<Button variant="outline" onClick={() => setAssignAllDialogOpen(false)}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button
|
||||
onClick={handleAssignAll}
|
||||
disabled={!targetRoundId || isPending}
|
||||
>
|
||||
{assignAllMutation.isPending && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
|
||||
Assign All {poolData?.total || 0} Projects
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
|
|
|
|||
|
|
@ -198,4 +198,84 @@ export const projectPoolRouter = router({
|
|||
roundId,
|
||||
}
|
||||
}),
|
||||
|
||||
/**
|
||||
* Assign ALL unassigned projects in a program to a round (server-side, no ID limit)
|
||||
*/
|
||||
assignAllToRound: adminProcedure
|
||||
.input(
|
||||
z.object({
|
||||
programId: z.string(),
|
||||
roundId: z.string(),
|
||||
competitionCategory: z.enum(['STARTUP', 'BUSINESS_CONCEPT']).optional(),
|
||||
})
|
||||
)
|
||||
.mutation(async ({ ctx, input }) => {
|
||||
const { programId, roundId, competitionCategory } = input
|
||||
|
||||
// Verify round exists
|
||||
await ctx.prisma.round.findUniqueOrThrow({
|
||||
where: { id: roundId },
|
||||
select: { id: true },
|
||||
})
|
||||
|
||||
// Find all unassigned projects
|
||||
const where: Record<string, unknown> = {
|
||||
programId,
|
||||
projectRoundStates: { none: {} },
|
||||
}
|
||||
if (competitionCategory) {
|
||||
where.competitionCategory = competitionCategory
|
||||
}
|
||||
|
||||
const projects = await ctx.prisma.project.findMany({
|
||||
where,
|
||||
select: { id: true },
|
||||
})
|
||||
|
||||
if (projects.length === 0) {
|
||||
return { success: true, assignedCount: 0, roundId }
|
||||
}
|
||||
|
||||
const projectIds = projects.map((p) => p.id)
|
||||
|
||||
const result = await ctx.prisma.$transaction(async (tx) => {
|
||||
await tx.projectRoundState.createMany({
|
||||
data: projectIds.map((projectId) => ({ projectId, roundId })),
|
||||
skipDuplicates: true,
|
||||
})
|
||||
|
||||
const updated = await tx.project.updateMany({
|
||||
where: { id: { in: projectIds } },
|
||||
data: { status: 'ASSIGNED' },
|
||||
})
|
||||
|
||||
await tx.projectStatusHistory.createMany({
|
||||
data: projectIds.map((projectId) => ({
|
||||
projectId,
|
||||
status: 'ASSIGNED',
|
||||
changedBy: ctx.user?.id,
|
||||
})),
|
||||
})
|
||||
|
||||
await logAudit({
|
||||
prisma: tx,
|
||||
userId: ctx.user?.id,
|
||||
action: 'BULK_ASSIGN_ALL_TO_ROUND',
|
||||
entityType: 'Project',
|
||||
detailsJson: {
|
||||
roundId,
|
||||
programId,
|
||||
competitionCategory: competitionCategory || 'ALL',
|
||||
projectCount: projectIds.length,
|
||||
},
|
||||
ipAddress: ctx.ip,
|
||||
userAgent: ctx.userAgent,
|
||||
})
|
||||
|
||||
return updated
|
||||
})
|
||||
|
||||
return { success: true, assignedCount: result.count, roundId }
|
||||
}),
|
||||
})
|
||||
|
|
|
|||
Loading…
Reference in New Issue