From cea7703ac440c38636ce2abd5baab35a23d05843 Mon Sep 17 00:00:00 2001
From: nsfisis <nsfisis@gmail.com>
Date: Sun, 15 Feb 2026 16:45:35 +0900
Subject: feat(deck): display new card count on deck detail page

Add newCardCount alongside Total and Due stats in the deck detail view,
queried from cards with state=New via a new countNewCards repository method.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/client/pages/DeckDetailPage.tsx | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

(limited to 'src/client/pages/DeckDetailPage.tsx')

diff --git a/src/client/pages/DeckDetailPage.tsx b/src/client/pages/DeckDetailPage.tsx
index bb8d42a..0a02051 100644
--- a/src/client/pages/DeckDetailPage.tsx
+++ b/src/client/pages/DeckDetailPage.tsx
@@ -33,11 +33,17 @@ function DeckStats({ deckId }: { deckId: string }) {
 
 	return (
 		<div className="bg-white rounded-xl border border-border/50 p-6 mb-6">
-			<div className="grid grid-cols-2 gap-4">
+			<div className="grid grid-cols-3 gap-4">
 				<div>
 					<p className="text-sm text-muted mb-1">Total</p>
 					<p className="text-2xl font-semibold text-ink">{cards.length}</p>
 				</div>
+				<div>
+					<p className="text-sm text-muted mb-1">New</p>
+					<p className="text-2xl font-semibold text-info">
+						{deck.newCardCount}
+					</p>
+				</div>
 				<div>
 					<p className="text-sm text-muted mb-1">Due</p>
 					<p className="text-2xl font-semibold text-primary">
@@ -77,7 +83,11 @@ function DeckContent({
 				<Suspense
 					fallback={
 						<div className="bg-white rounded-xl border border-border/50 p-6 mb-6">
-							<div className="grid grid-cols-2 gap-4">
+							<div className="grid grid-cols-3 gap-4">
+								<div>
+									<div className="h-4 w-12 bg-muted/20 rounded animate-pulse mb-1" />
+									<div className="h-8 w-10 bg-muted/20 rounded animate-pulse" />
+								</div>
 								<div>
 									<div className="h-4 w-12 bg-muted/20 rounded animate-pulse mb-1" />
 									<div className="h-8 w-10 bg-muted/20 rounded animate-pulse" />
-- 
cgit v1.3-1-g0d28

