901 lines
33 KiB
TypeScript
901 lines
33 KiB
TypeScript
'use client'
|
|
|
|
import { Suspense, use, useState, useEffect } from 'react'
|
|
import Link from 'next/link'
|
|
import { useRouter } from 'next/navigation'
|
|
import { useForm } from 'react-hook-form'
|
|
import { zodResolver } from '@hookform/resolvers/zod'
|
|
import { z } from 'zod'
|
|
import { trpc } from '@/lib/trpc/client'
|
|
import {
|
|
Card,
|
|
CardContent,
|
|
CardDescription,
|
|
CardHeader,
|
|
CardTitle,
|
|
} from '@/components/ui/card'
|
|
import { Button } from '@/components/ui/button'
|
|
import { Input } from '@/components/ui/input'
|
|
import { Skeleton } from '@/components/ui/skeleton'
|
|
import { Badge } from '@/components/ui/badge'
|
|
import {
|
|
Form,
|
|
FormControl,
|
|
FormDescription,
|
|
FormField,
|
|
FormItem,
|
|
FormLabel,
|
|
FormMessage,
|
|
} from '@/components/ui/form'
|
|
import {
|
|
EvaluationFormBuilder,
|
|
type Criterion,
|
|
} from '@/components/forms/evaluation-form-builder'
|
|
import { RoundTypeSettings } from '@/components/forms/round-type-settings'
|
|
import { ArrowLeft, Loader2, AlertCircle, AlertTriangle, Bell, GitCompare, MessageSquare, FileText, Calendar } from 'lucide-react'
|
|
import { Switch } from '@/components/ui/switch'
|
|
import { Slider } from '@/components/ui/slider'
|
|
import { Label } from '@/components/ui/label'
|
|
import { DateTimePicker } from '@/components/ui/datetime-picker'
|
|
import {
|
|
Select,
|
|
SelectContent,
|
|
SelectItem,
|
|
SelectTrigger,
|
|
SelectValue,
|
|
} from '@/components/ui/select'
|
|
|
|
// Available notification types for teams entering a round
|
|
const TEAM_NOTIFICATION_OPTIONS = [
|
|
{ value: '', label: 'No automatic notification', description: 'Teams will not receive a notification when entering this round' },
|
|
{ value: 'ADVANCED_SEMIFINAL', label: 'Advanced to Semi-Finals', description: 'Congratulates team for advancing to semi-finals' },
|
|
{ value: 'ADVANCED_FINAL', label: 'Selected as Finalist', description: 'Congratulates team for being selected as finalist' },
|
|
{ value: 'NOT_SELECTED', label: 'Not Selected', description: 'Informs team they were not selected to continue' },
|
|
{ value: 'WINNER_ANNOUNCEMENT', label: 'Winner Announcement', description: 'Announces the team as a winner' },
|
|
]
|
|
|
|
interface PageProps {
|
|
params: Promise<{ id: string }>
|
|
}
|
|
|
|
const updateRoundSchema = z
|
|
.object({
|
|
name: z.string().min(1, 'Name is required').max(255),
|
|
requiredReviews: z.number().int().min(1).max(10),
|
|
minAssignmentsPerJuror: z.number().int().min(1).max(50),
|
|
maxAssignmentsPerJuror: z.number().int().min(1).max(100),
|
|
votingStartAt: z.date().nullable().optional(),
|
|
votingEndAt: z.date().nullable().optional(),
|
|
})
|
|
.refine(
|
|
(data) => {
|
|
if (data.votingStartAt && data.votingEndAt) {
|
|
return data.votingEndAt > data.votingStartAt
|
|
}
|
|
return true
|
|
},
|
|
{
|
|
message: 'End date must be after start date',
|
|
path: ['votingEndAt'],
|
|
}
|
|
)
|
|
.refine(
|
|
(data) => data.minAssignmentsPerJuror <= data.maxAssignmentsPerJuror,
|
|
{
|
|
message: 'Min must be less than or equal to max',
|
|
path: ['minAssignmentsPerJuror'],
|
|
}
|
|
)
|
|
|
|
type UpdateRoundForm = z.infer<typeof updateRoundSchema>
|
|
|
|
function EditRoundContent({ roundId }: { roundId: string }) {
|
|
const router = useRouter()
|
|
const [criteria, setCriteria] = useState<Criterion[]>([])
|
|
const [criteriaInitialized, setCriteriaInitialized] = useState(false)
|
|
const [formInitialized, setFormInitialized] = useState(false)
|
|
const [roundType, setRoundType] = useState<'FILTERING' | 'EVALUATION' | 'LIVE_EVENT'>('EVALUATION')
|
|
const [roundSettings, setRoundSettings] = useState<Record<string, unknown>>({})
|
|
// entryNotificationType removed from schema
|
|
|
|
// Fetch round data - disable refetch on focus to prevent overwriting user's edits
|
|
const { data: round, isLoading: loadingRound } = trpc.round.get.useQuery(
|
|
{ id: roundId },
|
|
{ refetchOnWindowFocus: false }
|
|
)
|
|
|
|
// Fetch evaluation form
|
|
const { data: evaluationForm, isLoading: loadingForm } =
|
|
trpc.round.getEvaluationForm.useQuery({ roundId })
|
|
|
|
// Check if evaluations exist
|
|
const { data: hasEvaluations } = trpc.round.hasEvaluations.useQuery({
|
|
roundId,
|
|
})
|
|
|
|
const utils = trpc.useUtils()
|
|
|
|
// Mutations
|
|
const updateRound = trpc.round.update.useMutation({
|
|
onSuccess: () => {
|
|
// Invalidate cache to ensure fresh data
|
|
utils.round.get.invalidate({ id: roundId })
|
|
utils.round.list.invalidate()
|
|
router.push(`/admin/rounds/${roundId}`)
|
|
},
|
|
})
|
|
|
|
const updateEvaluationForm = trpc.round.updateEvaluationForm.useMutation()
|
|
|
|
// Initialize form with existing data
|
|
const form = useForm<UpdateRoundForm>({
|
|
resolver: zodResolver(updateRoundSchema),
|
|
defaultValues: {
|
|
name: '',
|
|
requiredReviews: 3,
|
|
minAssignmentsPerJuror: 5,
|
|
maxAssignmentsPerJuror: 20,
|
|
votingStartAt: null,
|
|
votingEndAt: null,
|
|
},
|
|
})
|
|
|
|
// Update form when round data loads - only initialize once
|
|
useEffect(() => {
|
|
if (round && !formInitialized) {
|
|
form.reset({
|
|
name: round.name,
|
|
requiredReviews: round.requiredReviews,
|
|
minAssignmentsPerJuror: round.minAssignmentsPerJuror,
|
|
maxAssignmentsPerJuror: round.maxAssignmentsPerJuror,
|
|
votingStartAt: round.votingStartAt ? new Date(round.votingStartAt) : null,
|
|
votingEndAt: round.votingEndAt ? new Date(round.votingEndAt) : null,
|
|
})
|
|
// Set round type, settings, and notification type
|
|
setRoundType((round.roundType as typeof roundType) || 'EVALUATION')
|
|
setRoundSettings((round.settingsJson as Record<string, unknown>) || {})
|
|
setFormInitialized(true)
|
|
}
|
|
}, [round, form, formInitialized])
|
|
|
|
// Initialize criteria from evaluation form
|
|
useEffect(() => {
|
|
if (evaluationForm && !criteriaInitialized) {
|
|
const existingCriteria = evaluationForm.criteriaJson as unknown as Criterion[]
|
|
if (Array.isArray(existingCriteria)) {
|
|
setCriteria(existingCriteria)
|
|
}
|
|
setCriteriaInitialized(true)
|
|
} else if (!loadingForm && !evaluationForm && !criteriaInitialized) {
|
|
setCriteriaInitialized(true)
|
|
}
|
|
}, [evaluationForm, loadingForm, criteriaInitialized])
|
|
|
|
const onSubmit = async (data: UpdateRoundForm) => {
|
|
// Update round with type, settings, and notification
|
|
await updateRound.mutateAsync({
|
|
id: roundId,
|
|
name: data.name,
|
|
requiredReviews: data.requiredReviews,
|
|
minAssignmentsPerJuror: data.minAssignmentsPerJuror,
|
|
maxAssignmentsPerJuror: data.maxAssignmentsPerJuror,
|
|
roundType,
|
|
settingsJson: roundSettings,
|
|
votingStartAt: data.votingStartAt ?? null,
|
|
votingEndAt: data.votingEndAt ?? null,
|
|
})
|
|
|
|
// Update evaluation form if criteria changed and no evaluations exist
|
|
if (!hasEvaluations && criteria.length > 0) {
|
|
await updateEvaluationForm.mutateAsync({
|
|
roundId,
|
|
criteria,
|
|
})
|
|
}
|
|
}
|
|
|
|
const isLoading = loadingRound || loadingForm
|
|
|
|
if (isLoading) {
|
|
return <EditRoundSkeleton />
|
|
}
|
|
|
|
if (!round) {
|
|
return (
|
|
<div className="space-y-6">
|
|
<Button variant="ghost" asChild className="-ml-4">
|
|
<Link href="/admin/rounds">
|
|
<ArrowLeft className="mr-2 h-4 w-4" />
|
|
Back to Rounds
|
|
</Link>
|
|
</Button>
|
|
|
|
<Card>
|
|
<CardContent className="flex flex-col items-center justify-center py-12 text-center">
|
|
<AlertCircle className="h-12 w-12 text-destructive/50" />
|
|
<p className="mt-2 font-medium">Round Not Found</p>
|
|
<Button asChild className="mt-4">
|
|
<Link href="/admin/rounds">Back to Rounds</Link>
|
|
</Button>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
const isPending = updateRound.isPending || updateEvaluationForm.isPending
|
|
const isActive = round.status === 'ACTIVE'
|
|
|
|
return (
|
|
<div className="space-y-6">
|
|
{/* Header */}
|
|
<div className="flex items-center gap-4">
|
|
<Button variant="ghost" asChild className="-ml-4">
|
|
<Link href={`/admin/rounds/${roundId}`}>
|
|
<ArrowLeft className="mr-2 h-4 w-4" />
|
|
Back to Round
|
|
</Link>
|
|
</Button>
|
|
</div>
|
|
|
|
<div className="flex items-center gap-3">
|
|
<h1 className="text-2xl font-semibold tracking-tight">Edit Round</h1>
|
|
<Badge variant={isActive ? 'default' : 'secondary'}>
|
|
{round.status}
|
|
</Badge>
|
|
</div>
|
|
|
|
{/* Form */}
|
|
<Form {...form}>
|
|
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-6">
|
|
{/* Basic Information */}
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle className="text-lg">Basic Information</CardTitle>
|
|
</CardHeader>
|
|
<CardContent className="space-y-4">
|
|
<FormField
|
|
control={form.control}
|
|
name="name"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>Round Name</FormLabel>
|
|
<FormControl>
|
|
<Input
|
|
placeholder="e.g., Round 1 - Semi-Finalists"
|
|
{...field}
|
|
/>
|
|
</FormControl>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
|
|
<FormField
|
|
control={form.control}
|
|
name="requiredReviews"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>Required Reviews per Project</FormLabel>
|
|
<FormControl>
|
|
<Input
|
|
type="number"
|
|
min={1}
|
|
max={10}
|
|
{...field}
|
|
onChange={(e) =>
|
|
field.onChange(parseInt(e.target.value) || 1)
|
|
}
|
|
/>
|
|
</FormControl>
|
|
<FormDescription>
|
|
Minimum number of evaluations each project should receive
|
|
</FormDescription>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
|
|
<div className="grid gap-4 sm:grid-cols-2">
|
|
<FormField
|
|
control={form.control}
|
|
name="minAssignmentsPerJuror"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>Min Projects per Judge</FormLabel>
|
|
<FormControl>
|
|
<Input
|
|
type="number"
|
|
min={1}
|
|
max={50}
|
|
{...field}
|
|
onChange={(e) =>
|
|
field.onChange(parseInt(e.target.value) || 1)
|
|
}
|
|
/>
|
|
</FormControl>
|
|
<FormDescription>
|
|
Target minimum projects each judge should receive
|
|
</FormDescription>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
|
|
<FormField
|
|
control={form.control}
|
|
name="maxAssignmentsPerJuror"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>Max Projects per Judge</FormLabel>
|
|
<FormControl>
|
|
<Input
|
|
type="number"
|
|
min={1}
|
|
max={100}
|
|
{...field}
|
|
onChange={(e) =>
|
|
field.onChange(parseInt(e.target.value) || 1)
|
|
}
|
|
/>
|
|
</FormControl>
|
|
<FormDescription>
|
|
Maximum projects a judge can be assigned
|
|
</FormDescription>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
{/* Round Type & Settings */}
|
|
<RoundTypeSettings
|
|
roundType={roundType}
|
|
onRoundTypeChange={setRoundType}
|
|
settings={roundSettings}
|
|
onSettingsChange={setRoundSettings}
|
|
/>
|
|
|
|
{/* Voting Window */}
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle className="text-lg">Voting Window</CardTitle>
|
|
<CardDescription>
|
|
Set when jury members can submit their evaluations
|
|
</CardDescription>
|
|
</CardHeader>
|
|
<CardContent className="space-y-4">
|
|
{isActive && (
|
|
<div className="flex items-center gap-2 rounded-lg bg-amber-500/10 p-3 text-amber-700">
|
|
<AlertTriangle className="h-4 w-4 shrink-0" />
|
|
<p className="text-sm">
|
|
This round is active. Changing the voting window may affect
|
|
ongoing evaluations.
|
|
</p>
|
|
</div>
|
|
)}
|
|
|
|
<div className="grid gap-4 sm:grid-cols-2">
|
|
<FormField
|
|
control={form.control}
|
|
name="votingStartAt"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>Start Date & Time</FormLabel>
|
|
<FormControl>
|
|
<DateTimePicker
|
|
value={field.value}
|
|
onChange={field.onChange}
|
|
placeholder="Select start date & time"
|
|
/>
|
|
</FormControl>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
|
|
<FormField
|
|
control={form.control}
|
|
name="votingEndAt"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>End Date & Time</FormLabel>
|
|
<FormControl>
|
|
<DateTimePicker
|
|
value={field.value}
|
|
onChange={field.onChange}
|
|
placeholder="Select end date & time"
|
|
/>
|
|
</FormControl>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
</div>
|
|
|
|
<p className="text-sm text-muted-foreground">
|
|
Leave empty to disable the voting window enforcement. Past dates are allowed.
|
|
</p>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
{/* Upload Deadline Policy */}
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle className="text-lg">Upload Deadline Policy</CardTitle>
|
|
<CardDescription>
|
|
Control how file uploads are handled after the round starts
|
|
</CardDescription>
|
|
</CardHeader>
|
|
<CardContent className="space-y-4">
|
|
<Select
|
|
value={(roundSettings.uploadDeadlinePolicy as string) || ''}
|
|
onValueChange={(value) =>
|
|
setRoundSettings((prev) => ({
|
|
...prev,
|
|
uploadDeadlinePolicy: value || undefined,
|
|
}))
|
|
}
|
|
>
|
|
<SelectTrigger>
|
|
<SelectValue placeholder="Default (no restriction)" />
|
|
</SelectTrigger>
|
|
<SelectContent>
|
|
<SelectItem value="NONE">
|
|
Default - No restriction
|
|
</SelectItem>
|
|
<SelectItem value="BLOCK">
|
|
Block uploads after round starts
|
|
</SelectItem>
|
|
<SelectItem value="ALLOW_LATE">
|
|
Allow late uploads (marked as late)
|
|
</SelectItem>
|
|
</SelectContent>
|
|
</Select>
|
|
<p className="text-sm text-muted-foreground">
|
|
When set to “Block”, applicants cannot upload files after the voting start date.
|
|
When set to “Allow late”, uploads are accepted but flagged as late submissions.
|
|
</p>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
{/* Jury Features */}
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle className="text-lg flex items-center gap-2">
|
|
<GitCompare className="h-5 w-5" />
|
|
Jury Features
|
|
</CardTitle>
|
|
<CardDescription>
|
|
Configure project comparison and peer review for jury members
|
|
</CardDescription>
|
|
</CardHeader>
|
|
<CardContent className="space-y-6">
|
|
{/* Comparison settings */}
|
|
<div className="space-y-4">
|
|
<div className="flex items-center justify-between">
|
|
<div className="space-y-0.5">
|
|
<Label className="text-sm font-medium">Enable Project Comparison</Label>
|
|
<p className="text-xs text-muted-foreground">
|
|
Allow jury members to compare projects side by side
|
|
</p>
|
|
</div>
|
|
<Switch
|
|
checked={Boolean(roundSettings.enable_comparison)}
|
|
onCheckedChange={(checked) =>
|
|
setRoundSettings((prev) => ({
|
|
...prev,
|
|
enable_comparison: checked,
|
|
}))
|
|
}
|
|
/>
|
|
</div>
|
|
{!!roundSettings.enable_comparison && (
|
|
<div className="space-y-2 pl-4 border-l-2 border-muted">
|
|
<Label className="text-sm">Max Projects to Compare</Label>
|
|
<Input
|
|
type="number"
|
|
min={2}
|
|
max={5}
|
|
value={Number(roundSettings.comparison_max_projects || 3)}
|
|
onChange={(e) =>
|
|
setRoundSettings((prev) => ({
|
|
...prev,
|
|
comparison_max_projects: parseInt(e.target.value) || 3,
|
|
}))
|
|
}
|
|
className="max-w-[120px]"
|
|
/>
|
|
</div>
|
|
)}
|
|
</div>
|
|
|
|
{/* Peer review settings */}
|
|
<div className="border-t pt-4 space-y-4">
|
|
<div className="flex items-center justify-between">
|
|
<div className="space-y-0.5">
|
|
<Label className="text-sm font-medium flex items-center gap-1">
|
|
<MessageSquare className="h-4 w-4" />
|
|
Enable Peer Review / Discussion
|
|
</Label>
|
|
<p className="text-xs text-muted-foreground">
|
|
Allow jury members to discuss and see aggregated scores
|
|
</p>
|
|
</div>
|
|
<Switch
|
|
checked={Boolean(roundSettings.peer_review_enabled)}
|
|
onCheckedChange={(checked) =>
|
|
setRoundSettings((prev) => ({
|
|
...prev,
|
|
peer_review_enabled: checked,
|
|
}))
|
|
}
|
|
/>
|
|
</div>
|
|
{!!roundSettings.peer_review_enabled && (
|
|
<div className="space-y-4 pl-4 border-l-2 border-muted">
|
|
<div className="space-y-2">
|
|
<Label className="text-sm">Divergence Threshold</Label>
|
|
<p className="text-xs text-muted-foreground">
|
|
Score divergence level that triggers a warning (0.0 - 1.0)
|
|
</p>
|
|
<Input
|
|
type="number"
|
|
min={0}
|
|
max={1}
|
|
step={0.05}
|
|
value={Number(roundSettings.divergence_threshold || 0.3)}
|
|
onChange={(e) =>
|
|
setRoundSettings((prev) => ({
|
|
...prev,
|
|
divergence_threshold: parseFloat(e.target.value) || 0.3,
|
|
}))
|
|
}
|
|
className="max-w-[120px]"
|
|
/>
|
|
</div>
|
|
<div className="space-y-2">
|
|
<Label className="text-sm">Anonymization Level</Label>
|
|
<Select
|
|
value={String(roundSettings.anonymization_level || 'partial')}
|
|
onValueChange={(v) =>
|
|
setRoundSettings((prev) => ({
|
|
...prev,
|
|
anonymization_level: v,
|
|
}))
|
|
}
|
|
>
|
|
<SelectTrigger className="max-w-[200px]">
|
|
<SelectValue />
|
|
</SelectTrigger>
|
|
<SelectContent>
|
|
<SelectItem value="none">No anonymization</SelectItem>
|
|
<SelectItem value="partial">Partial (Juror 1, 2...)</SelectItem>
|
|
<SelectItem value="full">Full anonymization</SelectItem>
|
|
</SelectContent>
|
|
</Select>
|
|
</div>
|
|
<div className="space-y-2">
|
|
<Label className="text-sm">Discussion Window (hours)</Label>
|
|
<Input
|
|
type="number"
|
|
min={1}
|
|
max={720}
|
|
value={Number(roundSettings.discussion_window_hours || 48)}
|
|
onChange={(e) =>
|
|
setRoundSettings((prev) => ({
|
|
...prev,
|
|
discussion_window_hours: parseInt(e.target.value) || 48,
|
|
}))
|
|
}
|
|
className="max-w-[120px]"
|
|
/>
|
|
</div>
|
|
<div className="space-y-2">
|
|
<Label className="text-sm">Max Comment Length</Label>
|
|
<Input
|
|
type="number"
|
|
min={100}
|
|
max={5000}
|
|
value={Number(roundSettings.max_comment_length || 2000)}
|
|
onChange={(e) =>
|
|
setRoundSettings((prev) => ({
|
|
...prev,
|
|
max_comment_length: parseInt(e.target.value) || 2000,
|
|
}))
|
|
}
|
|
className="max-w-[120px]"
|
|
/>
|
|
</div>
|
|
</div>
|
|
)}
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
{/* File Settings */}
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle className="text-lg flex items-center gap-2">
|
|
<FileText className="h-5 w-5" />
|
|
File Settings
|
|
</CardTitle>
|
|
<CardDescription>
|
|
Configure allowed file types and versioning for this round
|
|
</CardDescription>
|
|
</CardHeader>
|
|
<CardContent className="space-y-4">
|
|
<div className="space-y-2">
|
|
<Label className="text-sm">Allowed File Types</Label>
|
|
<p className="text-xs text-muted-foreground">
|
|
Comma-separated MIME types or extensions
|
|
</p>
|
|
<Input
|
|
placeholder="application/pdf, video/mp4, image/jpeg"
|
|
value={String(roundSettings.allowed_file_types || '')}
|
|
onChange={(e) =>
|
|
setRoundSettings((prev) => ({
|
|
...prev,
|
|
allowed_file_types: e.target.value,
|
|
}))
|
|
}
|
|
/>
|
|
</div>
|
|
<div className="space-y-2">
|
|
<Label className="text-sm">Max File Size (MB)</Label>
|
|
<Input
|
|
type="number"
|
|
min={1}
|
|
max={2048}
|
|
value={Number(roundSettings.max_file_size_mb || 500)}
|
|
onChange={(e) =>
|
|
setRoundSettings((prev) => ({
|
|
...prev,
|
|
max_file_size_mb: parseInt(e.target.value) || 500,
|
|
}))
|
|
}
|
|
className="max-w-[150px]"
|
|
/>
|
|
</div>
|
|
<div className="flex items-center justify-between">
|
|
<div className="space-y-0.5">
|
|
<Label className="text-sm font-medium">Enable File Versioning</Label>
|
|
<p className="text-xs text-muted-foreground">
|
|
Keep previous versions when files are replaced
|
|
</p>
|
|
</div>
|
|
<Switch
|
|
checked={Boolean(roundSettings.file_versioning)}
|
|
onCheckedChange={(checked) =>
|
|
setRoundSettings((prev) => ({
|
|
...prev,
|
|
file_versioning: checked,
|
|
}))
|
|
}
|
|
/>
|
|
</div>
|
|
{!!roundSettings.file_versioning && (
|
|
<div className="space-y-2 pl-4 border-l-2 border-muted">
|
|
<Label className="text-sm">Max Versions per File</Label>
|
|
<Input
|
|
type="number"
|
|
min={2}
|
|
max={20}
|
|
value={Number(roundSettings.max_file_versions || 5)}
|
|
onChange={(e) =>
|
|
setRoundSettings((prev) => ({
|
|
...prev,
|
|
max_file_versions: parseInt(e.target.value) || 5,
|
|
}))
|
|
}
|
|
className="max-w-[120px]"
|
|
/>
|
|
</div>
|
|
)}
|
|
</CardContent>
|
|
</Card>
|
|
|
|
{/* Availability Settings */}
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle className="text-lg flex items-center gap-2">
|
|
<Calendar className="h-5 w-5" />
|
|
Jury Availability Settings
|
|
</CardTitle>
|
|
<CardDescription>
|
|
Configure how jury member availability affects assignments
|
|
</CardDescription>
|
|
</CardHeader>
|
|
<CardContent className="space-y-4">
|
|
<div className="flex items-center justify-between">
|
|
<div className="space-y-0.5">
|
|
<Label className="text-sm font-medium">Require Availability</Label>
|
|
<p className="text-xs text-muted-foreground">
|
|
Jury members must set availability before receiving assignments
|
|
</p>
|
|
</div>
|
|
<Switch
|
|
checked={Boolean(roundSettings.require_availability)}
|
|
onCheckedChange={(checked) =>
|
|
setRoundSettings((prev) => ({
|
|
...prev,
|
|
require_availability: checked,
|
|
}))
|
|
}
|
|
/>
|
|
</div>
|
|
|
|
<div className="space-y-2">
|
|
<Label className="text-sm">Availability Mode</Label>
|
|
<Select
|
|
value={String(roundSettings.availability_mode || 'soft_penalty')}
|
|
onValueChange={(v) =>
|
|
setRoundSettings((prev) => ({
|
|
...prev,
|
|
availability_mode: v,
|
|
}))
|
|
}
|
|
>
|
|
<SelectTrigger className="max-w-[250px]">
|
|
<SelectValue />
|
|
</SelectTrigger>
|
|
<SelectContent>
|
|
<SelectItem value="hard_block">
|
|
Hard Block (unavailable jurors excluded)
|
|
</SelectItem>
|
|
<SelectItem value="soft_penalty">
|
|
Soft Penalty (reduce assignment priority)
|
|
</SelectItem>
|
|
</SelectContent>
|
|
</Select>
|
|
</div>
|
|
|
|
<div className="space-y-2">
|
|
<Label className="text-sm">
|
|
Availability Weight ({Number(roundSettings.availability_weight || 50)}%)
|
|
</Label>
|
|
<p className="text-xs text-muted-foreground">
|
|
How much weight to give availability when using soft penalty mode
|
|
</p>
|
|
<Slider
|
|
value={[Number(roundSettings.availability_weight || 50)]}
|
|
min={0}
|
|
max={100}
|
|
step={5}
|
|
onValueChange={([value]) =>
|
|
setRoundSettings((prev) => ({
|
|
...prev,
|
|
availability_weight: value,
|
|
}))
|
|
}
|
|
className="max-w-xs"
|
|
/>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
{/* Evaluation Criteria */}
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle className="text-lg">Evaluation Criteria</CardTitle>
|
|
<CardDescription>
|
|
Define the criteria jurors will use to evaluate projects
|
|
</CardDescription>
|
|
</CardHeader>
|
|
<CardContent>
|
|
{hasEvaluations ? (
|
|
<div className="space-y-4">
|
|
<div className="flex items-center gap-2 rounded-lg bg-amber-500/10 p-3 text-amber-700">
|
|
<AlertTriangle className="h-4 w-4 shrink-0" />
|
|
<p className="text-sm">
|
|
Criteria cannot be modified after evaluations have been
|
|
submitted. {criteria.length} criteria defined.
|
|
</p>
|
|
</div>
|
|
|
|
<EvaluationFormBuilder
|
|
initialCriteria={criteria}
|
|
onChange={() => {}}
|
|
disabled={true}
|
|
/>
|
|
</div>
|
|
) : (
|
|
<EvaluationFormBuilder
|
|
initialCriteria={criteria}
|
|
onChange={setCriteria}
|
|
/>
|
|
)}
|
|
</CardContent>
|
|
</Card>
|
|
|
|
{/* Error Display */}
|
|
{(updateRound.error || updateEvaluationForm.error) && (
|
|
<Card className="border-destructive">
|
|
<CardContent className="flex items-center gap-2 py-4">
|
|
<AlertCircle className="h-5 w-5 text-destructive" />
|
|
<p className="text-sm text-destructive">
|
|
{updateRound.error?.message ||
|
|
updateEvaluationForm.error?.message}
|
|
</p>
|
|
</CardContent>
|
|
</Card>
|
|
)}
|
|
|
|
{/* Actions */}
|
|
<div className="flex justify-end gap-3">
|
|
<Button type="button" variant="outline" asChild>
|
|
<Link href={`/admin/rounds/${roundId}`}>Cancel</Link>
|
|
</Button>
|
|
<Button type="submit" disabled={isPending}>
|
|
{isPending && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
|
|
Save Changes
|
|
</Button>
|
|
</div>
|
|
</form>
|
|
</Form>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
function EditRoundSkeleton() {
|
|
return (
|
|
<div className="space-y-6">
|
|
<Skeleton className="h-9 w-36" />
|
|
|
|
<div className="flex items-center gap-3">
|
|
<Skeleton className="h-8 w-32" />
|
|
<Skeleton className="h-6 w-16" />
|
|
</div>
|
|
|
|
<Card>
|
|
<CardHeader>
|
|
<Skeleton className="h-5 w-40" />
|
|
</CardHeader>
|
|
<CardContent className="space-y-4">
|
|
<div className="space-y-2">
|
|
<Skeleton className="h-4 w-24" />
|
|
<Skeleton className="h-10 w-full" />
|
|
</div>
|
|
<div className="space-y-2">
|
|
<Skeleton className="h-4 w-40" />
|
|
<Skeleton className="h-10 w-32" />
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Card>
|
|
<CardHeader>
|
|
<Skeleton className="h-5 w-32" />
|
|
</CardHeader>
|
|
<CardContent className="space-y-4">
|
|
<div className="grid gap-4 sm:grid-cols-2">
|
|
<Skeleton className="h-10 w-full" />
|
|
<Skeleton className="h-10 w-full" />
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Card>
|
|
<CardHeader>
|
|
<Skeleton className="h-5 w-40" />
|
|
</CardHeader>
|
|
<CardContent>
|
|
<Skeleton className="h-32 w-full" />
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default function EditRoundPage({ params }: PageProps) {
|
|
const { id } = use(params)
|
|
|
|
return (
|
|
<Suspense fallback={<EditRoundSkeleton />}>
|
|
<EditRoundContent roundId={id} />
|
|
</Suspense>
|
|
)
|
|
}
|