feat(final-docs): Final Documents panel on team + mentor views

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-06-09 15:53:39 +02:00
parent 8c6a59bad9
commit 24c7c4bc6c
3 changed files with 67 additions and 0 deletions
--- a/src/components/applicant/final-documents-panel.tsx
+++ b/src/components/applicant/final-documents-panel.tsx
@@ -0,0 +1,59 @@
+'use client'
+
+import Link from 'next/link'
+import { trpc } from '@/lib/trpc/client'
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
+import { Button } from '@/components/ui/button'
+import { Badge } from '@/components/ui/badge'
+import { FileCheck2, Clock, Upload, CheckCircle2, Circle } from 'lucide-react'
+
+type Props =
+  | { variant: 'team' }
+  | { variant: 'mentor'; projectId: string }
+
+export function FinalDocumentsPanel(props: Props) {
+  const teamQuery = trpc.applicant.getFinalDocumentStatus.useQuery(undefined, { enabled: props.variant === 'team' })
+  const mentorQuery = trpc.mentor.getProjectFinalDocuments.useQuery(
+    { projectId: props.variant === 'mentor' ? props.projectId : '' },
+    { enabled: props.variant === 'mentor' },
+  )
+  const status = props.variant === 'team' ? teamQuery.data : mentorQuery.data
+  if (!status) return null
+
+  const fmt = new Intl.DateTimeFormat(undefined, { dateStyle: 'long', timeStyle: 'short' })
+  return (
+    <Card>
+      <CardHeader>
+        <div className="flex items-center justify-between flex-wrap gap-2">
+          <CardTitle className="flex items-center gap-2 text-lg"><FileCheck2 className="h-5 w-5" /> Final Documents</CardTitle>
+          {status.allRequiredUploaded
+            ? <Badge className="bg-emerald-50 text-emerald-700 border-emerald-200">Submitted</Badge>
+            : status.deadline && (
+              <span className={`flex items-center gap-1.5 text-sm ${status.deadlinePassed ? 'text-destructive' : 'text-muted-foreground'}`}>
+                <Clock className="h-4 w-4" /> Due {fmt.format(new Date(status.deadline))}
+              </span>
+            )}
+        </div>
+        <CardDescription>
+          {props.variant === 'team' ? 'Your final deliverables for the Grand Finale.' : 'This team\'s final deliverables for the Grand Finale.'}
+        </CardDescription>
+      </CardHeader>
+      <CardContent className="space-y-2">
+        {status.requirements.map((r) => (
+          <div key={r.id} className="flex items-center justify-between rounded-lg border p-3">
+            <span className="flex items-center gap-2 text-sm">
+              {r.uploaded ? <CheckCircle2 className="h-4 w-4 text-emerald-600" /> : <Circle className="h-4 w-4 text-muted-foreground/50" />}
+              {r.name}
+            </span>
+            <span className="text-xs text-muted-foreground truncate max-w-[50%]">{r.file?.fileName ?? 'Not yet uploaded'}</span>
+          </div>
+        ))}
+        {props.variant === 'team' && !status.allRequiredUploaded && (
+          <Button asChild size="sm" className="mt-2 bg-brand-blue hover:bg-brand-blue-light">
+            <Link href="/applicant/documents"><Upload className="mr-2 h-4 w-4" /> Upload documents</Link>
+          </Button>
+        )}
+      </CardContent>
+    </Card>
+  )
+}