From f0635f9beb0ff85bbea2264a1b19160f0beed257 Mon Sep 17 00:00:00 2001
From: nsfisis <nsfisis@gmail.com>
Date: Sun, 7 Dec 2025 23:41:28 +0900
Subject: feat(client): add offline mode banner indicator
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Displays a prominent banner at the top of all pages when the user
is offline, informing them that changes will sync when reconnected.
Shows pending change count when applicable.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 src/client/App.tsx | 43 +++++++++++++++++++++++--------------------
 1 file changed, 23 insertions(+), 20 deletions(-)

(limited to 'src/client/App.tsx')

diff --git a/src/client/App.tsx b/src/client/App.tsx
index f774003..3c20c54 100644
--- a/src/client/App.tsx
+++ b/src/client/App.tsx
@@ -1,5 +1,5 @@
 import { Route, Switch } from "wouter";
-import { ProtectedRoute } from "./components";
+import { OfflineBanner, ProtectedRoute } from "./components";
 import {
 	DeckDetailPage,
 	HomePage,
@@ -10,24 +10,27 @@ import {
 
 export function App() {
 	return (
-		<Switch>
-			<Route path="/">
-				<ProtectedRoute>
-					<HomePage />
-				</ProtectedRoute>
-			</Route>
-			<Route path="/decks/:deckId">
-				<ProtectedRoute>
-					<DeckDetailPage />
-				</ProtectedRoute>
-			</Route>
-			<Route path="/decks/:deckId/study">
-				<ProtectedRoute>
-					<StudyPage />
-				</ProtectedRoute>
-			</Route>
-			<Route path="/login" component={LoginPage} />
-			<Route component={NotFoundPage} />
-		</Switch>
+		<>
+			<OfflineBanner />
+			<Switch>
+				<Route path="/">
+					<ProtectedRoute>
+						<HomePage />
+					</ProtectedRoute>
+				</Route>
+				<Route path="/decks/:deckId">
+					<ProtectedRoute>
+						<DeckDetailPage />
+					</ProtectedRoute>
+				</Route>
+				<Route path="/decks/:deckId/study">
+					<ProtectedRoute>
+						<StudyPage />
+					</ProtectedRoute>
+				</Route>
+				<Route path="/login" component={LoginPage} />
+				<Route component={NotFoundPage} />
+			</Switch>
+		</>
 	);
 }
-- 
cgit v1.2.3-70-g09d2