feat: multi-role jury fix, country flags, applicant deadline banner, timeline

- Fix project list returning empty for users with both SUPER_ADMIN and
  JURY_MEMBER roles (jury filter now skips admins) in project, assignment,
  and evaluation routers
- Add CountryDisplay component showing flag emoji + name everywhere
  country is displayed (admin, observer, jury, mentor views — 17 files)
- Add countdown deadline banner on applicant dashboard for INTAKE,
  SUBMISSION, and MENTORING rounds with live timer
- Remove quick action buttons from applicant dashboard
- Fix competition timeline sidebar: green dots/connectors only up to
  current round, yellow dot for current round, red connector into
  rejected round, grey after

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

src/components/admin/members-content.tsx

@@ -5,6 +5,7 @@ import Link from 'next/link'
 import { useSearchParams, usePathname } from 'next/navigation'
 import { trpc } from '@/lib/trpc/client'
 import { Badge } from '@/components/ui/badge'
+import { CountryDisplay } from '@/components/shared/country-display'
 import { Button } from '@/components/ui/button'
 import { Input } from '@/components/ui/input'
 import { Checkbox } from '@/components/ui/checkbox'
@@ -805,7 +806,7 @@ function ApplicantsTabContent({ search, searchInput, setSearchInput }: { search:
                   )}
                 </TableCell>
                 <TableCell>
-                  <span className="text-sm">{user.nationality || <span className="text-muted-foreground">-</span>}</span>
+                  <span className="text-sm">{user.nationality ? <CountryDisplay country={user.nationality} /> : <span className="text-muted-foreground">-</span>}</span>
                 </TableCell>
                 <TableCell>
                   <span className="text-sm">{user.institution || <span className="text-muted-foreground">-</span>}</span>

src/components/admin/round/award-shortlist.tsx

@@ -35,6 +35,7 @@ import {
   AlertTriangle,
   Search,
 } from 'lucide-react'
+import { CountryDisplay } from '@/components/shared/country-display'
 
 type AwardShortlistProps = {
   awardId: string
@@ -342,7 +343,13 @@ export function AwardShortlist({
                                       </a>
                                     </p>
                                     <p className="text-xs text-muted-foreground">
-                                      {[e.project.teamName, e.project.country, e.project.competitionCategory].filter(Boolean).join(', ') || '—'}
+                                      {[e.project.teamName, e.project.competitionCategory].filter(Boolean).length > 0 || e.project.country ? (
+                                        <>
+                                          {[e.project.teamName, e.project.competitionCategory].filter(Boolean).join(', ')}
+                                          {(e.project.teamName || e.project.competitionCategory) && e.project.country ? ', ' : ''}
+                                          {e.project.country && <CountryDisplay country={e.project.country} />}
+                                        </>
+                                      ) : '—'}
                                     </p>
                                   </div>
                                 </td>

src/components/admin/round/filtering-dashboard.tsx

@@ -74,6 +74,7 @@ import { motion, AnimatePresence } from 'motion/react'
 import Link from 'next/link'
 import type { Route } from 'next'
 import { AwardShortlist } from './award-shortlist'
+import { CountryDisplay } from '@/components/shared/country-display'
 
 type FilteringDashboardProps = {
   competitionId: string
@@ -924,7 +925,7 @@ export function FilteringDashboard({ competitionId, roundId }: FilteringDashboar
                             </div>
                             <p className="text-xs text-muted-foreground truncate">
                               {result.project?.teamName}
-                              {result.project?.country && ` \u00b7 ${result.project.country}`}
+                              {result.project?.country && <> · <CountryDisplay country={result.project.country} /></>}
                             </p>
                           </div>
                         </div>

src/components/admin/round/finalization-tab.tsx

@@ -44,6 +44,7 @@ import {
 import { cn } from '@/lib/utils'
 import { projectStateConfig } from '@/lib/round-config'
 import { EmailPreviewDialog } from './email-preview-dialog'
+import { CountryDisplay } from '@/components/shared/country-display'
 
 // ── Types ──────────────────────────────────────────────────────────────────
 
@@ -233,7 +234,7 @@ export function FinalizationTab({ roundId, roundStatus }: FinalizationTabProps)
         {project.category === 'STARTUP' ? 'Startup' : project.category === 'BUSINESS_CONCEPT' ? 'Concept' : project.category ?? '-'}
       </td>
       <td className="px-3 py-2.5 hidden md:table-cell text-muted-foreground">
-        {project.country ?? '-'}
+        {project.country ? <CountryDisplay country={project.country} /> : '-'}
       </td>
       <td className="px-3 py-2.5 text-center">
         <Badge variant="secondary" className={cn('text-xs', stateLabelColors[project.currentState] ?? '')}>

src/components/admin/round/project-states-table.tsx

@@ -63,6 +63,7 @@ import {
 } from 'lucide-react'
 import Link from 'next/link'
 import type { Route } from 'next'
+import { CountryDisplay } from '@/components/shared/country-display'
 
 const PROJECT_STATES = ['PENDING', 'IN_PROGRESS', 'PASSED', 'REJECTED', 'COMPLETED', 'WITHDRAWN'] as const
 type ProjectState = (typeof PROJECT_STATES)[number]
@@ -448,7 +449,7 @@ export function ProjectStatesTable({ competitionId, roundId, roundStatus, compet
                 </Badge>
               </div>
               <div className="text-xs text-muted-foreground truncate">
-                {ps.project?.country || '—'}
+                {ps.project?.country ? <CountryDisplay country={ps.project.country} /> : '—'}
               </div>
               <div>
                 <Badge variant="outline" className={`text-xs ${cfg.color}`}>
@@ -1087,7 +1088,7 @@ function AddProjectDialog({
                           <p className="text-sm font-medium truncate">{project.title}</p>
                           <p className="text-xs text-muted-foreground truncate">
                             {project.teamName}
-                            {project.country && <> &middot; {project.country}</>}
+                            {project.country && <> &middot; <CountryDisplay country={project.country} /></>}
                           </p>
                         </div>
                         {project.competitionCategory && (
@@ -1237,7 +1238,7 @@ function AddProjectDialog({
                                 <p className="text-sm font-medium truncate">{project.title}</p>
                                 <p className="text-xs text-muted-foreground truncate">
                                   {project.teamName}
-                                  {project.country && <> &middot; {project.country}</>}
+                                  {project.country && <> &middot; <CountryDisplay country={project.country} /></>}
                                 </p>
                               </div>
                               <div className="flex items-center gap-1.5 ml-2 shrink-0">

src/components/admin/round/ranking-dashboard.tsx

@@ -55,6 +55,7 @@ import {
   Download,
 } from 'lucide-react'
 import type { RankedProjectEntry } from '@/server/services/ai-ranking'
+import { CountryDisplay } from '@/components/shared/country-display'
 
 // ─── Types ────────────────────────────────────────────────────────────────────
 
@@ -163,7 +164,7 @@ function SortableProjectRow({
         {projectInfo?.teamName && (
           <p className="text-xs text-muted-foreground truncate">
             {projectInfo.teamName}
-            {projectInfo.country ? ` · ${projectInfo.country}` : ''}
+            {projectInfo.country ? <> · <CountryDisplay country={projectInfo.country} /></> : ''}
           </p>
         )}
       </div>

src/components/admin/semi-finalists-content.tsx

@@ -6,6 +6,7 @@ import type { Route } from 'next'
 import { useRouter } from 'next/navigation'
 import { trpc } from '@/lib/trpc/client'
 import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
+import { CountryDisplay } from '@/components/shared/country-display'
 import { Input } from '@/components/ui/input'
 import { Badge } from '@/components/ui/badge'
 import { Button } from '@/components/ui/button'
@@ -214,7 +215,7 @@ export function SemiFinalistsContent({ editionId }: SemiFinalistsContentProps) {
                           {categoryLabels[project.category ?? ''] ?? project.category}
                         </Badge>
                       </TableCell>
-                      <TableCell className="text-sm">{project.country || '—'}</TableCell>
+                      <TableCell className="text-sm">{project.country ? <CountryDisplay country={project.country} /> : '—'}</TableCell>
                       <TableCell className="text-sm">{project.currentRound}</TableCell>
                       <TableCell>
                         <TooltipProvider>

src/components/applicant/competition-timeline.tsx

@@ -202,13 +202,35 @@ export function CompetitionTimelineSidebar() {
           // Is this entry after the elimination point?
           const isAfterElimination = eliminationIndex >= 0 && index > eliminationIndex
 
-          // Is this the current round the project is in (regardless of round status)?
-          const isCurrent = !!entry.projectState && entry.projectState !== 'PASSED' && entry.projectState !== 'COMPLETED' && entry.projectState !== 'REJECTED'
+          // Is this the current round? Either has an active project state,
+          // or is the first round the project hasn't passed yet (for seed data
+          // where project states may be missing).
+          const hasActiveProjectState = !!entry.projectState && entry.projectState !== 'PASSED' && entry.projectState !== 'COMPLETED' && entry.projectState !== 'REJECTED'
+          const isCurrent = !isAfterElimination && (hasActiveProjectState || (
+            !isPassed && !isRejected && !isCompleted &&
+            data.entries.slice(0, index).every((prev) =>
+              prev.projectState === 'PASSED' || prev.projectState === 'COMPLETED' ||
+              prev.status === 'ROUND_CLOSED' || prev.status === 'ROUND_ARCHIVED'
+            ) && index > 0
+          ))
 
-          // Determine connector segment color (no icons, just colored lines)
+          // Connector color: green up to and including the current round,
+          // red leading into the rejected round, neutral after.
           let connectorColor = 'bg-border'
-          if ((isPassed || isCompleted) && !isAfterElimination) connectorColor = 'bg-emerald-400'
-          else if (isRejected) connectorColor = 'bg-destructive/30'
+          const nextEntry = data.entries[index + 1]
+          const nextIsRejected = nextEntry?.projectState === 'REJECTED'
+          if (isAfterElimination) {
+            connectorColor = 'bg-border'
+          } else if (isRejected) {
+            // From rejected round onward = neutral
+            connectorColor = 'bg-border'
+          } else if (nextIsRejected) {
+            // Connector leading INTO the rejected round = red
+            connectorColor = 'bg-destructive/40'
+          } else if (isCompleted || isPassed) {
+            // Rounds the project has passed through = green
+            connectorColor = 'bg-emerald-400'
+          }
 
           // Dot inner content
           let dotInner: React.ReactNode = null
@@ -222,7 +244,7 @@ export function CompetitionTimelineSidebar() {
           } else if (isGrandFinale && (isCompleted || isPassed)) {
             dotClasses = 'bg-yellow-500 border-2 border-yellow-500'
             dotInner = <Trophy className="h-3.5 w-3.5 text-white" />
-          } else if (isCompleted || isPassed) {
+          } else if (isPassed || (isCompleted && !isCurrent)) {
             dotClasses = 'bg-emerald-500 border-2 border-emerald-500'
             dotInner = <Check className="h-3.5 w-3.5 text-white" />
           } else if (isCurrent) {

src/components/observer/dashboard/filtering-panel.tsx

@@ -9,6 +9,7 @@ import { Badge } from '@/components/ui/badge'
 import { Skeleton } from '@/components/ui/skeleton'
 import { Button } from '@/components/ui/button'
 import { AnimatedCard } from '@/components/shared/animated-container'
+import { CountryDisplay } from '@/components/shared/country-display'
 import {
   Select,
   SelectContent,
@@ -200,7 +201,7 @@ export function FilteringPanel({ roundId }: { roundId: string }) {
                               {r.project?.title ?? 'Unknown'}
                             </Link>
                             <p className="text-xs text-muted-foreground truncate">
-                              {formatCategory(r.project?.competitionCategory)} · {r.project?.country ?? ''}
+                              {formatCategory(r.project?.competitionCategory)} · {r.project?.country ? <CountryDisplay country={r.project.country} /> : ''}
                             </p>
                           </div>
                           <div className="flex items-center gap-2 shrink-0">

src/components/observer/dashboard/intake-panel.tsx

@@ -7,6 +7,7 @@ import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
 import { Skeleton } from '@/components/ui/skeleton'
 import { Badge } from '@/components/ui/badge'
 import { AnimatedCard } from '@/components/shared/animated-container'
+import { CountryDisplay } from '@/components/shared/country-display'
 import { Inbox, Globe, FolderOpen } from 'lucide-react'
 
 function relativeTime(date: Date | string): string {
@@ -87,11 +88,11 @@ export function IntakePanel({ roundId, programId }: { roundId: string; programId
                     <div className="min-w-0 flex-1">
                       <p className="text-sm font-medium truncate">{p.title}</p>
                       <p className="text-xs text-muted-foreground truncate">
-                        {p.teamName ?? 'No team'} · {p.country ?? ''}
+                        {p.teamName ?? 'No team'} · {p.country ? <CountryDisplay country={p.country} /> : ''}
                       </p>
                     </div>
                     <span className="text-[11px] tabular-nums text-muted-foreground shrink-0">
-                      {p.country ?? ''}
+                      {p.country ? <CountryDisplay country={p.country} /> : ''}
                     </span>
                   </Link>
                 ))}

src/components/observer/dashboard/previous-round-section.tsx

@@ -6,6 +6,7 @@ import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
 import { Badge } from '@/components/ui/badge'
 import { Skeleton } from '@/components/ui/skeleton'
 import { AnimatedCard } from '@/components/shared/animated-container'
+import { CountryDisplay } from '@/components/shared/country-display'
 import { ArrowDown, ChevronDown, ChevronUp, TrendingDown } from 'lucide-react'
 import { cn, formatCategory } from '@/lib/utils'
 
@@ -107,7 +108,7 @@ export function PreviousRoundSection({ currentRoundId }: { currentRoundId: strin
                 <div className="grid grid-cols-2 gap-x-4 gap-y-1">
                   {countryAttrition.map((c: any) => (
                     <div key={c.country} className="flex items-center justify-between text-sm py-0.5">
-                      <span className="truncate">{c.country}</span>
+                      <span className="truncate"><CountryDisplay country={c.country} /></span>
                       <Badge variant="destructive" className="tabular-nums text-xs">
                         -{c.lost}
                       </Badge>

src/components/observer/dashboard/submission-panel.tsx

@@ -7,6 +7,7 @@ import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
 import { Skeleton } from '@/components/ui/skeleton'
 import { Badge } from '@/components/ui/badge'
 import { AnimatedCard } from '@/components/shared/animated-container'
+import { CountryDisplay } from '@/components/shared/country-display'
 import { FileText, Upload, Users } from 'lucide-react'
 
 function relativeTime(date: Date | string): string {
@@ -146,11 +147,11 @@ export function SubmissionPanel({ roundId, programId }: { roundId: string; progr
                     <div className="min-w-0 flex-1">
                       <p className="text-sm font-medium truncate">{p.title}</p>
                       <p className="text-xs text-muted-foreground truncate">
-                        {p.teamName ?? 'No team'} · {p.country ?? ''}
+                        {p.teamName ?? 'No team'} · {p.country ? <CountryDisplay country={p.country} /> : ''}
                       </p>
                     </div>
                     <Badge variant="outline" className="text-xs shrink-0">
-                      {p.country ?? '—'}
+                      {p.country ? <CountryDisplay country={p.country} /> : '—'}
                     </Badge>
                   </Link>
                 ))}

src/components/observer/observer-project-detail.tsx

@@ -22,6 +22,7 @@ import { ProjectLogoWithUrl } from '@/components/shared/project-logo-with-url'
 import { UserAvatar } from '@/components/shared/user-avatar'
 import { StatusBadge } from '@/components/shared/status-badge'
 import { AnimatedCard } from '@/components/shared/animated-container'
+import { CountryDisplay } from '@/components/shared/country-display'
 import {
   AlertCircle,
   Users,
@@ -174,7 +175,7 @@ export function ObserverProjectDetail({ projectId }: { projectId: string }) {
               {(project.country || project.geographicZone) && (
                 <Badge variant="outline" className="gap-1">
                   <MapPin className="h-3 w-3" />
-                  {project.country || project.geographicZone}
+                  {project.country ? <CountryDisplay country={project.country} /> : project.geographicZone}
                 </Badge>
               )}
               {project.competitionCategory && (
@@ -392,7 +393,7 @@ export function ObserverProjectDetail({ projectId }: { projectId: string }) {
                       <MapPin className="h-4 w-4 text-muted-foreground mt-0.5" />
                       <div>
                         <p className="text-sm font-medium text-muted-foreground">Location</p>
-                        <p className="text-sm">{project.geographicZone || project.country}</p>
+                        <p className="text-sm">{project.geographicZone}{project.geographicZone && project.country ? ', ' : ''}{project.country ? <CountryDisplay country={project.country} /> : null}</p>
                       </div>
                     </div>
                   )}

src/components/observer/observer-projects-content.tsx

@@ -13,6 +13,7 @@ import {
   CardDescription,
 } from '@/components/ui/card'
 import { Badge } from '@/components/ui/badge'
+import { CountryDisplay } from '@/components/shared/country-display'
 import { Button } from '@/components/ui/button'
 import { Input } from '@/components/ui/input'
 import { Skeleton } from '@/components/ui/skeleton'
@@ -394,7 +395,7 @@ export function ObserverProjectsContent() {
                           </div>
                         </TableCell>
                         <TableCell className="text-sm">
-                          {project.country ?? '-'}
+                          {project.country ? <CountryDisplay country={project.country} /> : '-'}
                         </TableCell>
                         <TableCell>
                           <Badge variant="outline" className="text-xs whitespace-nowrap">

src/components/observer/reports/filtering-report-tabs.tsx

@@ -26,6 +26,7 @@ import { ChevronLeft, ChevronRight, ChevronDown, ChevronUp } from 'lucide-react'
 import { RoundTypeStatsCards } from '@/components/observer/round-type-stats'
 import { FilteringScreeningBar } from './filtering-screening-bar'
 import { ProjectPreviewDialog } from './project-preview-dialog'
+import { CountryDisplay } from '@/components/shared/country-display'
 
 interface FilteringReportTabsProps {
   roundId: string
@@ -176,7 +177,7 @@ export function FilteringReportTabs({ roundId }: FilteringReportTabsProps) {
                           {formatCategory(r.project.competitionCategory) || '—'}
                         </TableCell>
                         <TableCell className="text-muted-foreground">
-                          {r.project.country ?? '—'}
+                          {r.project.country ? <CountryDisplay country={r.project.country} /> : '—'}
                         </TableCell>
                         <TableCell>{outcomeBadge(effectiveOutcome)}</TableCell>
                       </TableRow>
@@ -258,7 +259,7 @@ export function FilteringReportTabs({ roundId }: FilteringReportTabsProps) {
                       </div>
                       <div className="flex gap-3 text-xs text-muted-foreground mt-1">
                         {r.project.competitionCategory && <span>{formatCategory(r.project.competitionCategory)}</span>}
-                        {r.project.country && <span>{r.project.country}</span>}
+                        {r.project.country && <span><CountryDisplay country={r.project.country} /></span>}
                       </div>
                     </div>
 

src/components/observer/reports/project-preview-dialog.tsx

@@ -13,6 +13,7 @@ import { Button } from '@/components/ui/button'
 import { Skeleton } from '@/components/ui/skeleton'
 import { Separator } from '@/components/ui/separator'
 import { StatusBadge } from '@/components/shared/status-badge'
+import { CountryDisplay } from '@/components/shared/country-display'
 import { ExternalLink, MapPin, Waves, Users } from 'lucide-react'
 import Link from 'next/link'
 import type { Route } from 'next'
@@ -78,7 +79,7 @@ export function ProjectPreviewDialog({ projectId, open, onOpenChange }: ProjectP
                 {data.project.country && (
                   <Badge variant="outline" className="gap-1">
                     <MapPin className="h-3 w-3" />
-                    {data.project.country}
+                    <CountryDisplay country={data.project.country} />
                   </Badge>
                 )}
                 {data.project.competitionCategory && (

src/components/shared/country-display.tsx

@@ -0,0 +1,30 @@
+'use client'
+
+import { getCountryFlag, getCountryName, normalizeCountryToCode } from '@/lib/countries'
+
+/**
+ * Displays a country flag emoji followed by the country name.
+ * Accepts either an ISO-2 code or a full country name.
+ */
+export function CountryDisplay({
+  country,
+  showName = true,
+  className,
+}: {
+  country: string | null | undefined
+  showName?: boolean
+  className?: string
+}) {
+  if (!country) return null
+
+  const code = normalizeCountryToCode(country)
+  const flag = code ? getCountryFlag(code) : null
+  const name = code ? getCountryName(code) : country
+
+  return (
+    <span className={className}>
+      {flag && <span className="mr-1">{flag}</span>}
+      {showName && name}
+    </span>
+  )
+}