From 1e622a164deba74ea76031d17a8db8e8f4a1afa4 Mon Sep 17 00:00:00 2001
From: Cho Young-Hwi <cyh76507707@gmail.com>
Date: Mon, 16 Mar 2026 16:16:35 +0000
Subject: [PATCH] [#193] Show deadline countdown in days/hours/minutes/seconds
 format

Replace raw hours format (161:48:23) with human-readable format:
- 1+ days: "6d 23h 13m 21s"
- Under 24h: "23h 13m 21s"
- Under 1h: "13m 21s"

Fixes #193

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/components/DeadlineCountdown.tsx | 19 +++++++++++++------
 1 file changed, 13 insertions(+), 6 deletions(-)

diff --git a/src/components/DeadlineCountdown.tsx b/src/components/DeadlineCountdown.tsx
index 133423d8..de829df8 100644
--- a/src/components/DeadlineCountdown.tsx
+++ b/src/components/DeadlineCountdown.tsx
@@ -20,7 +20,7 @@ export function DeadlineCountdown({ lastPlotTime }: { lastPlotTime: string }) {
     return (
       <div className="border-border bg-surface mt-4 rounded border px-3 py-2 text-xs">
         <span className="text-muted">Next plot due in </span>
-        <span className="text-accent font-medium">--:--:--</span>
+        <span className="text-accent font-medium">--</span>
       </div>
     );
   }
@@ -33,17 +33,24 @@ export function DeadlineCountdown({ lastPlotTime }: { lastPlotTime: string }) {
     );
   }
 
-  const hours = Math.floor(remaining / 3600);
+  const days = Math.floor(remaining / 86400);
+  const hours = Math.floor((remaining % 86400) / 3600);
   const minutes = Math.floor((remaining % 3600) / 60);
   const seconds = remaining % 60;
 
+  let formatted: string;
+  if (days > 0) {
+    formatted = `${days}d ${hours}h ${minutes}m ${seconds}s`;
+  } else if (hours > 0) {
+    formatted = `${hours}h ${minutes}m ${seconds}s`;
+  } else {
+    formatted = `${minutes}m ${seconds}s`;
+  }
+
   return (
     <div className="border-border bg-surface mt-4 rounded border px-3 py-2 text-xs">
       <span className="text-muted">Next plot due in </span>
-      <span className="text-accent font-medium">
-        {String(hours).padStart(2, "0")}:{String(minutes).padStart(2, "0")}:
-        {String(seconds).padStart(2, "0")}
-      </span>
+      <span className="text-accent font-medium">{formatted}</span>
     </div>
   );
 }