Add jury assignment transfer, cap redistribution, and learning hub overhaul

- Add getTransferCandidates/transferAssignments procedures for targeted
  assignment moves between jurors with TOCTOU guards and audit logging
- Add getOverCapPreview/redistributeOverCap for auto-redistributing
  assignments when a juror's cap is lowered below their current load
- Add TransferAssignmentsDialog (2-step: select projects, pick destinations)
- Extend InlineMemberCap with over-cap detection and redistribute banner
- Extend getReassignmentHistory to show ASSIGNMENT_TRANSFER and CAP_REDISTRIBUTE events
- Learning hub: replace ResourceType/CohortLevel enums with accessJson JSONB,
  add coverImageKey, resource detail pages for jury/mentor, shared renderer
- Migration: 20260221200000_learning_hub_overhaul

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

src/app/(admin)/admin/learning/page.tsx

@@ -12,6 +12,7 @@ import {
 import { Badge } from '@/components/ui/badge'
 import { Skeleton } from '@/components/ui/skeleton'
 import { Input } from '@/components/ui/input'
+import { Switch } from '@/components/ui/switch'
 import {
   Select,
   SelectContent,
@@ -22,48 +23,212 @@ import {
 import {
   Plus,
   FileText,
-  Video,
-  Link as LinkIcon,
-  File,
   Pencil,
   ExternalLink,
   Search,
+  GripVertical,
 } from 'lucide-react'
+import {
+  DndContext,
+  closestCenter,
+  KeyboardSensor,
+  PointerSensor,
+  useSensor,
+  useSensors,
+  type DragEndEvent,
+} from '@dnd-kit/core'
+import {
+  arrayMove,
+  SortableContext,
+  sortableKeyboardCoordinates,
+  useSortable,
+  verticalListSortingStrategy,
+} from '@dnd-kit/sortable'
+import { CSS } from '@dnd-kit/utilities'
+import { toast } from 'sonner'
 
-const resourceTypeIcons = {
-  PDF: FileText,
-  VIDEO: Video,
-  DOCUMENT: File,
-  LINK: LinkIcon,
-  OTHER: File,
+type Resource = {
+  id: string
+  title: string
+  description: string | null
+  isPublished: boolean
+  sortOrder: number
+  externalUrl: string | null
+  objectKey: string | null
+  contentJson: unknown
+  accessJson: unknown
+  _count: { accessLogs: number }
+  program: { id: string; name: string; year: number } | null
 }
 
-const cohortColors: Record<string, string> = {
-  ALL: 'bg-gray-100 text-gray-800',
-  SEMIFINALIST: 'bg-blue-100 text-blue-800',
-  FINALIST: 'bg-purple-100 text-purple-800',
+function getAccessSummary(accessJson: unknown): string {
+  if (!accessJson || !Array.isArray(accessJson) || accessJson.length === 0) {
+    return 'Everyone'
+  }
+  const rule = accessJson[0] as { type: string; roles?: string[] }
+  if (rule.type === 'everyone') return 'Everyone'
+  if (rule.type === 'roles' && rule.roles) {
+    if (rule.roles.length === 1) return rule.roles[0].replace('_', ' ').toLowerCase()
+    return `${rule.roles.length} roles`
+  }
+  if (rule.type === 'jury_group') return 'Jury groups'
+  if (rule.type === 'round') return 'By round'
+  return 'Custom'
+}
+
+function SortableResourceCard({
+  resource,
+  onTogglePublished,
+}: {
+  resource: Resource
+  onTogglePublished: (id: string, published: boolean) => void
+}) {
+  const {
+    attributes,
+    listeners,
+    setNodeRef,
+    transform,
+    transition,
+    isDragging,
+  } = useSortable({ id: resource.id })
+
+  const style = {
+    transform: CSS.Transform.toString(transform),
+    transition,
+  }
+
+  return (
+    <Card
+      ref={setNodeRef}
+      style={style}
+      className={isDragging ? 'opacity-50 shadow-lg' : ''}
+    >
+      <CardContent className="flex items-center gap-3 py-3">
+        {/* Drag handle */}
+        <button
+          className="cursor-grab touch-none text-muted-foreground hover:text-foreground"
+          aria-label="Drag to reorder"
+          {...attributes}
+          {...listeners}
+        >
+          <GripVertical className="h-4 w-4" />
+        </button>
+
+        {/* Icon */}
+        <div className="flex h-9 w-9 items-center justify-center rounded-lg bg-muted shrink-0">
+          <FileText className="h-4 w-4" />
+        </div>
+
+        {/* Title & meta */}
+        <div className="flex-1 min-w-0">
+          <div className="flex items-center gap-2">
+            <h3 className="font-medium truncate">{resource.title}</h3>
+            {!resource.isPublished && (
+              <Badge variant="secondary" className="text-xs">Draft</Badge>
+            )}
+          </div>
+          <div className="flex items-center gap-2 text-xs text-muted-foreground mt-0.5">
+            <span className="capitalize">{getAccessSummary(resource.accessJson)}</span>
+            <span>&middot;</span>
+            <span>{resource._count.accessLogs} views</span>
+            {resource.program && (
+              <>
+                <span>&middot;</span>
+                <span>{resource.program.year}</span>
+              </>
+            )}
+          </div>
+        </div>
+
+        {/* Quick publish toggle */}
+        <Switch
+          checked={resource.isPublished}
+          onCheckedChange={(checked) => onTogglePublished(resource.id, checked)}
+          aria-label={resource.isPublished ? 'Unpublish' : 'Publish'}
+        />
+
+        {/* Actions */}
+        <div className="flex items-center gap-1">
+          {resource.externalUrl && (
+            <a
+              href={resource.externalUrl}
+              target="_blank"
+              rel="noopener noreferrer"
+            >
+              <Button variant="ghost" size="icon" className="h-8 w-8">
+                <ExternalLink className="h-4 w-4" />
+              </Button>
+            </a>
+          )}
+          <Link href={`/admin/learning/${resource.id}`}>
+            <Button variant="ghost" size="icon" className="h-8 w-8">
+              <Pencil className="h-4 w-4" />
+            </Button>
+          </Link>
+        </div>
+      </CardContent>
+    </Card>
+  )
 }
 
 export default function LearningHubPage() {
-  const { data, isLoading } = trpc.learningResource.list.useQuery({ perPage: 50 })
-  const resources = data?.data
+  const { data, isLoading } = trpc.learningResource.list.useQuery({ perPage: 100 })
+  const resources = (data?.data || []) as Resource[]
 
   const [search, setSearch] = useState('')
   const debouncedSearch = useDebounce(search, 300)
-  const [typeFilter, setTypeFilter] = useState('all')
-  const [cohortFilter, setCohortFilter] = useState('all')
+  const [publishedFilter, setPublishedFilter] = useState('all')
+
+  const utils = trpc.useUtils()
+  const reorderMutation = trpc.learningResource.reorder.useMutation({
+    onSuccess: () => utils.learningResource.list.invalidate(),
+  })
+  const updateMutation = trpc.learningResource.update.useMutation({
+    onSuccess: () => utils.learningResource.list.invalidate(),
+  })
+
+  const sensors = useSensors(
+    useSensor(PointerSensor),
+    useSensor(KeyboardSensor, {
+      coordinateGetter: sortableKeyboardCoordinates,
+    })
+  )
 
   const filteredResources = useMemo(() => {
-    if (!resources) return []
     return resources.filter((resource) => {
       const matchesSearch =
         !debouncedSearch ||
         resource.title.toLowerCase().includes(debouncedSearch.toLowerCase())
-      const matchesType = typeFilter === 'all' || resource.resourceType === typeFilter
-      const matchesCohort = cohortFilter === 'all' || resource.cohortLevel === cohortFilter
-      return matchesSearch && matchesType && matchesCohort
+      const matchesPublished =
+        publishedFilter === 'all' ||
+        (publishedFilter === 'published' && resource.isPublished) ||
+        (publishedFilter === 'draft' && !resource.isPublished)
+      return matchesSearch && matchesPublished
     })
-  }, [resources, debouncedSearch, typeFilter, cohortFilter])
+  }, [resources, debouncedSearch, publishedFilter])
+
+  const handleDragEnd = (event: DragEndEvent) => {
+    const { active, over } = event
+    if (!over || active.id === over.id) return
+
+    const oldIndex = filteredResources.findIndex((r) => r.id === active.id)
+    const newIndex = filteredResources.findIndex((r) => r.id === over.id)
+    if (oldIndex === -1 || newIndex === -1) return
+
+    const reordered = arrayMove(filteredResources, oldIndex, newIndex)
+    const items = reordered.map((r, i) => ({ id: r.id, sortOrder: i }))
+
+    reorderMutation.mutate({ items }, {
+      onError: () => toast.error('Failed to reorder'),
+    })
+  }
+
+  const handleTogglePublished = (id: string, published: boolean) => {
+    updateMutation.mutate({ id, isPublished: published }, {
+      onSuccess: () => toast.success(published ? 'Published' : 'Unpublished'),
+      onError: () => toast.error('Failed to update'),
+    })
+  }
 
   if (isLoading) {
     return (
@@ -75,25 +240,20 @@ export default function LearningHubPage() {
           </div>
           <Skeleton className="h-9 w-32" />
         </div>
-        {/* Toolbar skeleton */}
         <div className="flex flex-col gap-3 sm:flex-row sm:items-center">
           <Skeleton className="h-10 flex-1" />
-          <div className="flex items-center gap-2">
-            <Skeleton className="h-10 w-[160px]" />
-            <Skeleton className="h-10 w-[160px]" />
-          </div>
+          <Skeleton className="h-10 w-[160px]" />
         </div>
-        {/* Resource list skeleton */}
-        <div className="grid gap-4">
+        <div className="grid gap-3">
           {[...Array(5)].map((_, i) => (
             <Card key={i}>
               <CardContent className="flex items-center gap-4 py-4">
-                <Skeleton className="h-10 w-10 rounded-lg" />
+                <Skeleton className="h-4 w-4" />
+                <Skeleton className="h-9 w-9 rounded-lg" />
                 <div className="flex-1 space-y-2">
                   <Skeleton className="h-5 w-48" />
-                  <Skeleton className="h-4 w-32" />
+                  <Skeleton className="h-3 w-32" />
                 </div>
-                <Skeleton className="h-8 w-8 rounded" />
               </CardContent>
             </Card>
           ))}
@@ -109,7 +269,7 @@ export default function LearningHubPage() {
         <div>
           <h1 className="text-2xl font-bold">Learning Hub</h1>
           <p className="text-muted-foreground">
-            Manage educational resources for jury members
+            Manage educational resources for program participants
           </p>
         </div>
         <Link href="/admin/learning/new">
@@ -131,92 +291,49 @@ export default function LearningHubPage() {
             className="pl-9"
           />
         </div>
-        <div className="flex items-center gap-2">
-          <Select value={typeFilter} onValueChange={setTypeFilter}>
-            <SelectTrigger className="w-[160px]">
-              <SelectValue placeholder="All types" />
-            </SelectTrigger>
-            <SelectContent>
-              <SelectItem value="all">All types</SelectItem>
-              <SelectItem value="PDF">PDF</SelectItem>
-              <SelectItem value="VIDEO">Video</SelectItem>
-              <SelectItem value="DOCUMENT">Document</SelectItem>
-              <SelectItem value="LINK">Link</SelectItem>
-              <SelectItem value="OTHER">Other</SelectItem>
-            </SelectContent>
-          </Select>
-          <Select value={cohortFilter} onValueChange={setCohortFilter}>
-            <SelectTrigger className="w-[160px]">
-              <SelectValue placeholder="All cohorts" />
-            </SelectTrigger>
-            <SelectContent>
-              <SelectItem value="all">All cohorts</SelectItem>
-              <SelectItem value="ALL">All (cohort)</SelectItem>
-              <SelectItem value="SEMIFINALIST">Semifinalist</SelectItem>
-              <SelectItem value="FINALIST">Finalist</SelectItem>
-            </SelectContent>
-          </Select>
-        </div>
+        <Select value={publishedFilter} onValueChange={setPublishedFilter}>
+          <SelectTrigger className="w-[160px]">
+            <SelectValue placeholder="All" />
+          </SelectTrigger>
+          <SelectContent>
+            <SelectItem value="all">All</SelectItem>
+            <SelectItem value="published">Published</SelectItem>
+            <SelectItem value="draft">Drafts</SelectItem>
+          </SelectContent>
+        </Select>
       </div>
 
       {/* Results count */}
-      {resources && (
+      {resources.length > 0 && (
         <p className="text-sm text-muted-foreground">
           {filteredResources.length} of {resources.length} resources
+          {reorderMutation.isPending && ' · Saving order...'}
         </p>
       )}
 
-      {/* Resource List */}
+      {/* Resource List with DnD */}
       {filteredResources.length > 0 ? (
-        <div className="grid gap-4">
-          {filteredResources.map((resource) => {
-            const Icon = resourceTypeIcons[resource.resourceType as keyof typeof resourceTypeIcons] || File
-            return (
-              <Card key={resource.id}>
-                <CardContent className="flex items-center gap-4 py-4">
-                  <div className="flex h-10 w-10 items-center justify-center rounded-lg bg-muted">
-                    <Icon className="h-5 w-5" />
-                  </div>
-                  <div className="flex-1 min-w-0">
-                    <div className="flex items-center gap-2">
-                      <h3 className="font-medium truncate">{resource.title}</h3>
-                      {!resource.isPublished && (
-                        <Badge variant="secondary">Draft</Badge>
-                      )}
-                    </div>
-                    <div className="flex items-center gap-2 text-sm text-muted-foreground">
-                      <Badge className={cohortColors[resource.cohortLevel] || ''} variant="outline">
-                        {resource.cohortLevel}
-                      </Badge>
-                      <span>{resource.resourceType}</span>
-                      <span>-</span>
-                      <span>{resource._count.accessLogs} views</span>
-                    </div>
-                  </div>
-                  <div className="flex items-center gap-2">
-                    {resource.externalUrl && (
-                      <a
-                        href={resource.externalUrl}
-                        target="_blank"
-                        rel="noopener noreferrer"
-                      >
-                        <Button variant="ghost" size="icon">
-                          <ExternalLink className="h-4 w-4" />
-                        </Button>
-                      </a>
-                    )}
-                    <Link href={`/admin/learning/${resource.id}`}>
-                      <Button variant="ghost" size="icon">
-                        <Pencil className="h-4 w-4" />
-                      </Button>
-                    </Link>
-                  </div>
-                </CardContent>
-              </Card>
-            )
-          })}
-        </div>
-      ) : resources && resources.length > 0 ? (
+        <DndContext
+          sensors={sensors}
+          collisionDetection={closestCenter}
+          onDragEnd={handleDragEnd}
+        >
+          <SortableContext
+            items={filteredResources.map((r) => r.id)}
+            strategy={verticalListSortingStrategy}
+          >
+            <div className="grid gap-3">
+              {filteredResources.map((resource) => (
+                <SortableResourceCard
+                  key={resource.id}
+                  resource={resource}
+                  onTogglePublished={handleTogglePublished}
+                />
+              ))}
+            </div>
+          </SortableContext>
+        </DndContext>
+      ) : resources.length > 0 ? (
         <Card>
           <CardContent className="flex flex-col items-center justify-center py-8 text-center">
             <Search className="h-8 w-8 text-muted-foreground/40" />