From 7a81665f960d02e792d0321a0a1a4ae0428b1eaf Mon Sep 17 00:00:00 2001
From: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Date: Tue, 28 Jul 2026 23:35:08 +0000
Subject: [PATCH] Show the countdown badge on the events list

Co-Authored-By: Nader Dabit <dabit3@gmail.com>
---
 app/page.tsx      | 10 ++++++++--
 lib/event-date.ts |  3 +--
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/app/page.tsx b/app/page.tsx
index 7c9ee78..788a001 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -4,10 +4,11 @@ import Link from "next/link";
 import { ArrowUpRight, Ticket } from "lucide-react";
 import { useQuery } from "convex/react";
 import { api } from "@/convex/_generated/api";
-import { formatEventDate } from "@/lib/event-date";
+import { eventCountdownLabel, formatEventDate } from "@/lib/event-date";
 import SiteHeader from "@/components/SiteHeader";
 import DotGridCanvas from "@/components/DotGridCanvas";
 import SiteFooter from "@/components/SiteFooter";
+import { Badge } from "@/components/ui/badge";
 import { Skeleton } from "@/components/ui/skeleton";
 import {
   Empty,
@@ -98,8 +99,13 @@ export default function Home() {
                         {event.name}
                       </div>
                       {event.eventDate ? (
-                        <p className="mt-1 font-mono text-xs text-muted-dim tabular-nums">
+                        <p className="mt-1 flex items-center gap-2 font-mono text-xs text-muted-dim tabular-nums">
                           {formatEventDate(event.eventDate)}
+                          {eventCountdownLabel(event.eventDate) ? (
+                            <Badge variant="secondary">
+                              {eventCountdownLabel(event.eventDate)}
+                            </Badge>
+                          ) : null}
                         </p>
                       ) : null}
                       {event.description ? (
diff --git a/lib/event-date.ts b/lib/event-date.ts
index 50acc60..65e8a02 100644
--- a/lib/event-date.ts
+++ b/lib/event-date.ts
@@ -18,8 +18,7 @@ export function daysUntilEvent(date: string, now: Date = new Date()): number {
   const [year, month, day] = date.split("-").map(Number);
   if (!year || !month || !day) return 0;
   const eventDay = new Date(year, month - 1, day);
-  const today = new Date(now.getFullYear(), now.getMonth(), now.getDate());
-  return Math.round((eventDay.getTime() - today.getTime()) / MS_PER_DAY);
+  return Math.floor((eventDay.getTime() - now.getTime()) / MS_PER_DAY);
 }
 
 // Short countdown label for upcoming events; null once the event has passed.