Add support for multiple deadlines per conference

CLAUDE.md

@@ -0,0 +1,77 @@
+# CLAUDE.md
+
+This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
+
+## Project Overview
+This is an AI Conference Deadlines web application that displays submission deadlines for top AI conferences like NeurIPS and ICLR. It's a React/TypeScript web app built with Vite, using shadcn-ui components and Tailwind CSS.
+
+## Development Commands
+```bash
+# Install dependencies
+npm i
+
+# Start development server (runs on http://localhost:8080)
+npm run dev
+
+# Build for production
+npm run build
+
+# Build for development
+npm run build:dev
+
+# Lint code
+npm run lint
+
+# Preview production build
+npm preview
+```
+
+## Architecture
+
+### Core Structure
+- **Frontend**: React 18 + TypeScript + Vite
+- **UI Framework**: shadcn-ui components with Radix UI primitives
+- **Styling**: Tailwind CSS with custom animations
+- **Data Source**: Static YAML file (`src/data/conferences.yml`) updated via GitHub Actions
+- **State Management**: React hooks, no external state management library
+
+### Key Directories
+- `src/components/` - React components (UI components in `ui/` subdirectory)
+- `src/pages/` - Route components (Index, Calendar, NotFound)
+- `src/data/` - Conference data in YAML format
+- `src/types/` - TypeScript type definitions
+- `src/utils/` - Utility functions for date handling and conference processing
+- `src/hooks/` - Custom React hooks
+
+### Main Components
+- `ConferenceList` - Primary list view of conferences
+- `ConferenceCard` - Individual conference display card
+- `ConferenceDialog` - Detailed conference information modal
+- `FilterBar` - Conference filtering and search functionality
+- `ConferenceCalendar` - Calendar view of conferences
+- `Header` - Navigation and app header
+
+### Data Model
+Conferences are defined by the `Conference` interface in `src/types/conference.ts` with properties including:
+- Basic info: `title`, `year`, `id`, `full_name`, `link`
+- Dates: `deadline`, `abstract_deadline`, `date`, `start`, `end`
+- Location: `city`, `country`, `venue`
+- Metadata: `tags`, `hindex`, `note`
+
+### Configuration Files
+- `vite.config.ts` - Vite configuration with YAML plugin for loading conference data
+- `tailwind.config.ts` - Tailwind CSS configuration with custom theme
+- `components.json` - shadcn-ui component configuration
+- `tsconfig.json` - TypeScript configuration
+
+### Data Updates
+Conference data is automatically updated via GitHub Actions workflow (`.github/workflows/update-conferences.yml`) that fetches from ccfddl repository and creates pull requests with updates.
+
+### Path Aliases
+- `@/*` maps to `src/*` for cleaner imports
+
+## Development Notes
+- The app uses a YAML plugin to import conference data directly in components
+- All UI components follow shadcn-ui patterns and conventions
+- The project uses React Router for client-side routing
+- Date handling uses `date-fns` and `date-fns-tz` for timezone support

src/components/ConferenceCard.tsx

@@ -4,6 +4,7 @@ import { formatDistanceToNow, parseISO, isValid, isPast } from "date-fns";
 import ConferenceDialog from "./ConferenceDialog";
 import { useState } from "react";
 import { getDeadlineInLocalTime } from '@/utils/dateUtils';
+import { getNextUpcomingDeadline, getPrimaryDeadline } from '@/utils/deadlineUtils';
 
 const ConferenceCard = ({
   title,
@@ -22,7 +23,15 @@ const ConferenceCard = ({
   ...conferenceProps
 }: Conference) => {
   const [dialogOpen, setDialogOpen] = useState(false);
-  const deadlineDate = getDeadlineInLocalTime(deadline, timezone);
+  
+  // Get the next upcoming deadline or primary deadline for display
+  const conference = {
+    title, full_name, year, date, deadline, timezone, tags, link, note,
+    abstract_deadline, city, country, venue, ...conferenceProps
+  };
+  
+  const nextDeadline = getNextUpcomingDeadline(conference) || getPrimaryDeadline(conference);
+  const deadlineDate = nextDeadline ? getDeadlineInLocalTime(nextDeadline.date, nextDeadline.timezone || timezone) : null;
   
   // Add validation before using formatDistanceToNow
   const getTimeRemaining = () => {
@@ -128,7 +137,7 @@ const ConferenceCard = ({
           <div className="flex items-center text-neutral">
             <Clock className="h-4 w-4 mr-2 flex-shrink-0" />
             <span className="text-sm truncate">
-              {deadline === 'TBD' ? 'TBD' : deadline}
+              {nextDeadline ? `${nextDeadline.label}: ${nextDeadline.date}` : (deadline === 'TBD' ? 'TBD' : deadline)}
             </span>
           </div>
           <div className="flex items-center">

src/components/ConferenceDialog.tsx

@@ -17,6 +17,7 @@ import {
 } from "@/components/ui/dropdown-menu";
 import { useState, useEffect } from "react";
 import { getDeadlineInLocalTime } from '@/utils/dateUtils';
+import { getAllDeadlines, getNextUpcomingDeadline, getUpcomingDeadlines } from '@/utils/deadlineUtils';
 
 interface ConferenceDialogProps {
   conference: Conference;
@@ -26,7 +27,12 @@ interface ConferenceDialogProps {
 
 const ConferenceDialog = ({ conference, open, onOpenChange }: ConferenceDialogProps) => {
   console.log('Conference object:', conference);
-  const deadlineDate = getDeadlineInLocalTime(conference.deadline, conference.timezone);
+  
+  // Get upcoming deadlines and the next upcoming one
+  const upcomingDeadlines = getUpcomingDeadlines(conference);
+  const nextDeadline = getNextUpcomingDeadline(conference);
+  const deadlineDate = nextDeadline ? getDeadlineInLocalTime(nextDeadline.date, nextDeadline.timezone || conference.timezone) : null;
+  
   const [countdown, setCountdown] = useState<string>('');
 
   // Replace the current location string creation with this more verbose version
@@ -236,7 +242,7 @@ END:VCALENDAR`;
             <div className="flex items-start gap-2">
               <Globe className="h-5 w-5 mt-0.5 text-gray-500" />
               <div>
-                <p className="font-medium">Location</p>
+                <p className="font-medium">Venue</p>
                 <p className="text-sm text-gray-500">
                   {conference.venue || [conference.city, conference.country].filter(Boolean).join(", ")}
                 </p>
@@ -248,32 +254,24 @@ END:VCALENDAR`;
               <div className="space-y-2 flex-1">
                 <p className="font-medium">Important Deadlines</p>
                 <div className="text-sm text-gray-500 space-y-2">
-                  {conference.abstract_deadline && (
+                  {upcomingDeadlines.length > 0 ? (
+                    upcomingDeadlines.map((deadline, index) => {
+                      const isNext = nextDeadline && deadline.date === nextDeadline.date && deadline.type === nextDeadline.type;
+                      return (
+                        <div 
+                          key={`${deadline.type}-${index}`} 
+                          className={`rounded-md p-2 ${isNext ? 'bg-blue-100 border border-blue-200' : 'bg-gray-100'}`}
+                        >
+                          <p className={isNext ? 'font-medium text-blue-800' : ''}>
+                            {deadline.label}: {formatDeadlineDate(deadline.date)}
+                            {isNext && <span className="ml-2 text-xs">(Next)</span>}
+                          </p>
+                        </div>
+                      );
+                    })
+                  ) : (
                     <div className="bg-gray-100 rounded-md p-2">
-                      <p>Abstract: {formatDeadlineDate(conference.abstract_deadline)}</p>
-                    </div>
-                  )}
-                  <div className="bg-gray-100 rounded-md p-2">
-                    <p>Submission: {formatDeadlineDate(conference.deadline)}</p>
-                  </div>
-                  {conference.commitment_deadline && (
-                    <div className="bg-gray-100 rounded-md p-2">
-                      <p>Commitment: {formatDeadlineDate(conference.commitment_deadline)}</p>
-                    </div>
-                  )}
-                  {conference.review_release_date && (
-                    <div className="bg-gray-100 rounded-md p-2">
-                      <p>Reviews Released: {formatDeadlineDate(conference.review_release_date)}</p>
-                    </div>
-                  )}
-                  {(conference.rebuttal_period_start || conference.rebuttal_period_end) && (
-                    <div className="bg-gray-100 rounded-md p-2">
-                      <p>Rebuttal Period: {formatDeadlineDate(conference.rebuttal_period_start)} - {formatDeadlineDate(conference.rebuttal_period_end)}</p>
-                    </div>
-                  )}
-                  {conference.final_decision_date && (
-                    <div className="bg-gray-100 rounded-md p-2">
-                      <p>Final Decision: {formatDeadlineDate(conference.final_decision_date)}</p>
+                      <p>No upcoming deadlines</p>
                     </div>
                   )}
                 </div>

src/data/conferences.yml

@@ -5,6 +5,30 @@
   link: https://www2026.thewebconf.org/
   deadline: '2025-10-07 23:59:59'
   abstract_deadline: '2025-09-30 23:59:59'
+  deadlines:
+    - type: abstract
+      label: Abstract Submission
+      date: '2025-09-30 23:59:59'
+      timezone: UTC-12
+    - type: submission
+      label: Paper Submission
+      date: '2025-10-07 23:59:59'
+      timezone: UTC-12
+    - type: rebuttal_start
+      label: Rebuttal Period Start
+      date: '2025-11-24 00:00:00'
+      timezone: UTC-12
+    - type: rebuttal_end
+      label: Rebuttal Period End
+      date: '2025-12-01 23:59:59'
+    - type: notification
+      label: Notification
+      date: '2026-01-13 23:59:59'
+      timezone: UTC-12
+    - type: camera_ready
+      label: Camera Ready
+      date: '2026-01-15 23:59:59'
+      timezone: UTC-12
   timezone: UTC-12
   city: Dubai
   country: UAE
@@ -135,6 +159,23 @@
   link: https://iclr.cc/Conferences/2026
   deadline: '2025-09-24 23:59:59'
   abstract_deadline: '2025-09-19 23:59:59'
+  deadlines:
+    - type: abstract
+      label: Abstract Submission
+      date: '2025-09-19 23:59:59'
+      timezone: UTC-12
+    - type: submission
+      label: Paper Submission
+      date: '2025-09-24 23:59:59'
+      timezone: UTC-12
+    - type: review_release
+      label: Reviews Released
+      date: '2026-01-20 23:59:59'
+      timezone: UTC-12
+    - type: notification
+      label: Notification
+      date: '2026-02-01 23:59:59'
+      timezone: UTC-12
   timezone: UTC-12
   city: Rio de Janeiro
   country: Brazil

src/types/conference.ts

@@ -1,10 +1,18 @@
+export interface Deadline {
+  type: string;
+  label: string;
+  date: string;
+  timezone?: string;
+}
+
 export interface Conference {
   id: string;
   title: string;
   full_name?: string;
   year: number;
   link?: string;
-  deadline: string;
+  deadline: string; // Keep for backward compatibility
+  deadlines?: Deadline[]; // New multiple deadlines support
   timezone?: string;
   date: string;
   place?: string;
@@ -13,7 +21,7 @@ export interface Conference {
   venue?: string;
   tags?: string[];
   note?: string;
-  abstract_deadline?: string;
+  abstract_deadline?: string; // Keep for backward compatibility
   start?: string;
   end?: string;
   rankings?: string;

src/utils/conferenceUtils.ts

@@ -1,24 +1,36 @@
 import { Conference } from "@/types/conference";
 import { getDeadlineInLocalTime } from './dateUtils';
+import { getPrimaryDeadline } from './deadlineUtils';
 
 /**
- * Sort conferences by their adjusted deadline (accounting for timezone)
+ * Sort conferences by their primary deadline (next upcoming or most recent past)
  */
 export function sortConferencesByDeadline(conferences: Conference[]): Conference[] {
   return [...conferences].sort((a, b) => {
-    const aDeadline = getDeadlineInLocalTime(a.deadline, a.timezone);
-    const bDeadline = getDeadlineInLocalTime(b.deadline, b.timezone);
+    const aPrimaryDeadline = getPrimaryDeadline(a);
+    const bPrimaryDeadline = getPrimaryDeadline(b);
     
-    // If either date is invalid, place it later in the list
-    if (!aDeadline || !bDeadline) {
-      if (!aDeadline && !bDeadline) return 0;
-      if (!aDeadline) return 1;
-      if (!bDeadline) return -1;
+    // If either conference has no deadlines, place it later in the list
+    if (!aPrimaryDeadline || !bPrimaryDeadline) {
+      if (!aPrimaryDeadline && !bPrimaryDeadline) return 0;
+      if (!aPrimaryDeadline) return 1;
+      if (!bPrimaryDeadline) return -1;
     }
     
-    // Both dates are valid, compare them
-    if (aDeadline && bDeadline) {
-      return aDeadline.getTime() - bDeadline.getTime();
+    // Both have deadlines, compare them
+    if (aPrimaryDeadline && bPrimaryDeadline) {
+      const aDeadline = getDeadlineInLocalTime(aPrimaryDeadline.date, aPrimaryDeadline.timezone || a.timezone);
+      const bDeadline = getDeadlineInLocalTime(bPrimaryDeadline.date, bPrimaryDeadline.timezone || b.timezone);
+      
+      if (!aDeadline || !bDeadline) {
+        if (!aDeadline && !bDeadline) return 0;
+        if (!aDeadline) return 1;
+        if (!bDeadline) return -1;
+      }
+      
+      if (aDeadline && bDeadline) {
+        return aDeadline.getTime() - bDeadline.getTime();
+      }
     }
     
     return 0;

src/utils/deadlineUtils.ts

@@ -0,0 +1,195 @@
+import { Conference, Deadline } from "@/types/conference";
+import { getDeadlineInLocalTime } from './dateUtils';
+import { isValid, isPast } from "date-fns";
+
+/**
+ * Get all deadlines for a conference, including both new format and legacy format
+ */
+export function getAllDeadlines(conference: Conference): Deadline[] {
+  const deadlines: Deadline[] = [];
+  const seenTypes = new Set<string>();
+  
+  // Add new format deadlines first (they take priority)
+  if (conference.deadlines && conference.deadlines.length > 0) {
+    conference.deadlines.forEach(deadline => {
+      deadlines.push(deadline);
+      seenTypes.add(deadline.type);
+    });
+  }
+  
+  // Add legacy format deadlines for backward compatibility, but only if not already present
+  if (conference.abstract_deadline && !seenTypes.has('abstract')) {
+    deadlines.push({
+      type: 'abstract',
+      label: 'Abstract Submission',
+      date: conference.abstract_deadline,
+      timezone: conference.timezone
+    });
+  }
+  
+  if (conference.deadline && !seenTypes.has('submission')) {
+    deadlines.push({
+      type: 'submission',
+      label: 'Paper Submission',
+      date: conference.deadline,
+      timezone: conference.timezone
+    });
+  }
+  
+  if (conference.commitment_deadline && !seenTypes.has('commitment')) {
+    deadlines.push({
+      type: 'commitment',
+      label: 'Commitment',
+      date: conference.commitment_deadline,
+      timezone: conference.timezone
+    });
+  }
+  
+  if (conference.review_release_date && !seenTypes.has('review_release')) {
+    deadlines.push({
+      type: 'review_release',
+      label: 'Reviews Released',
+      date: conference.review_release_date,
+      timezone: conference.timezone
+    });
+  }
+  
+  if (conference.rebuttal_period_start && !seenTypes.has('rebuttal_start')) {
+    deadlines.push({
+      type: 'rebuttal_start',
+      label: 'Rebuttal Period Start',
+      date: conference.rebuttal_period_start,
+      timezone: conference.timezone
+    });
+  }
+  
+  if (conference.rebuttal_period_end && !seenTypes.has('rebuttal_end')) {
+    deadlines.push({
+      type: 'rebuttal_end',
+      label: 'Rebuttal Period End',
+      date: conference.rebuttal_period_end,
+      timezone: conference.timezone
+    });
+  }
+  
+  if (conference.final_decision_date && !seenTypes.has('final_decision')) {
+    deadlines.push({
+      type: 'final_decision',
+      label: 'Final Decision',
+      date: conference.final_decision_date,
+      timezone: conference.timezone
+    });
+  }
+  
+  // Sort deadlines by date
+  deadlines.sort((a, b) => {
+    const aDate = getDeadlineInLocalTime(a.date, a.timezone || conference.timezone);
+    const bDate = getDeadlineInLocalTime(b.date, b.timezone || conference.timezone);
+    
+    if (!aDate || !bDate) return 0;
+    return aDate.getTime() - bDate.getTime();
+  });
+  
+  return deadlines;
+}
+
+/**
+ * Get the next upcoming deadline for a conference
+ */
+export function getNextUpcomingDeadline(conference: Conference): Deadline | null {
+  const allDeadlines = getAllDeadlines(conference);
+  
+  if (allDeadlines.length === 0) {
+    return null;
+  }
+  
+  // Filter out past deadlines and invalid dates
+  const upcomingDeadlines = allDeadlines.filter(deadline => {
+    const deadlineDate = getDeadlineInLocalTime(deadline.date, deadline.timezone || conference.timezone);
+    return deadlineDate && isValid(deadlineDate) && !isPast(deadlineDate);
+  });
+  
+  if (upcomingDeadlines.length === 0) {
+    return null;
+  }
+  
+  // Sort by date and return the earliest
+  upcomingDeadlines.sort((a, b) => {
+    const aDate = getDeadlineInLocalTime(a.date, a.timezone || conference.timezone);
+    const bDate = getDeadlineInLocalTime(b.date, b.timezone || conference.timezone);
+    
+    if (!aDate || !bDate) return 0;
+    return aDate.getTime() - bDate.getTime();
+  });
+  
+  return upcomingDeadlines[0];
+}
+
+/**
+ * Get the primary deadline for sorting purposes (next upcoming or most recent past)
+ */
+export function getPrimaryDeadline(conference: Conference): Deadline | null {
+  const nextDeadline = getNextUpcomingDeadline(conference);
+  
+  if (nextDeadline) {
+    return nextDeadline;
+  }
+  
+  // If no upcoming deadlines, return the most recent past deadline
+  const allDeadlines = getAllDeadlines(conference);
+  
+  if (allDeadlines.length === 0) {
+    return null;
+  }
+  
+  // Filter valid dates and sort by date (most recent first)
+  const validDeadlines = allDeadlines.filter(deadline => {
+    const deadlineDate = getDeadlineInLocalTime(deadline.date, deadline.timezone || conference.timezone);
+    return deadlineDate && isValid(deadlineDate);
+  });
+  
+  if (validDeadlines.length === 0) {
+    return null;
+  }
+  
+  validDeadlines.sort((a, b) => {
+    const aDate = getDeadlineInLocalTime(a.date, a.timezone || conference.timezone);
+    const bDate = getDeadlineInLocalTime(b.date, b.timezone || conference.timezone);
+    
+    if (!aDate || !bDate) return 0;
+    return bDate.getTime() - aDate.getTime(); // Most recent first
+  });
+  
+  return validDeadlines[0];
+}
+
+/**
+ * Check if a conference has any upcoming deadlines
+ */
+export function hasUpcomingDeadlines(conference: Conference): boolean {
+  return getNextUpcomingDeadline(conference) !== null;
+}
+
+/**
+ * Get all upcoming deadlines sorted by date
+ */
+export function getUpcomingDeadlines(conference: Conference): Deadline[] {
+  const allDeadlines = getAllDeadlines(conference);
+  
+  // Filter out past deadlines and invalid dates
+  const upcomingDeadlines = allDeadlines.filter(deadline => {
+    const deadlineDate = getDeadlineInLocalTime(deadline.date, deadline.timezone || conference.timezone);
+    return deadlineDate && isValid(deadlineDate) && !isPast(deadlineDate);
+  });
+  
+  // Sort by date
+  upcomingDeadlines.sort((a, b) => {
+    const aDate = getDeadlineInLocalTime(a.date, a.timezone || conference.timezone);
+    const bDate = getDeadlineInLocalTime(b.date, b.timezone || conference.timezone);
+    
+    if (!aDate || !bDate) return 0;
+    return aDate.getTime() - bDate.getTime();
+  });
+  
+  return upcomingDeadlines;
+}