From 17ba3c603e4c522ccca282f6786fff2e0b3f4f6e Mon Sep 17 00:00:00 2001
From: nsfisis <nsfisis@gmail.com>
Date: Sat, 6 Dec 2025 18:01:31 +0900
Subject: feat(client): setup routing with wouter
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Add wouter router with pages for home, login, register, and 404.
Include tests for all routes using @testing-library/react.

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

Co-Authored-By: Claude <noreply@anthropic.com>
---
 src/client/App.test.tsx           | 47 +++++++++++++++++++++++++++++++++++++++
 src/client/App.tsx                | 13 +++++++----
 src/client/pages/HomePage.tsx     |  8 +++++++
 src/client/pages/LoginPage.tsx    |  8 +++++++
 src/client/pages/NotFoundPage.tsx | 11 +++++++++
 src/client/pages/RegisterPage.tsx |  8 +++++++
 src/client/pages/index.ts         |  4 ++++
 7 files changed, 95 insertions(+), 4 deletions(-)
 create mode 100644 src/client/App.test.tsx
 create mode 100644 src/client/pages/HomePage.tsx
 create mode 100644 src/client/pages/LoginPage.tsx
 create mode 100644 src/client/pages/NotFoundPage.tsx
 create mode 100644 src/client/pages/RegisterPage.tsx
 create mode 100644 src/client/pages/index.ts

(limited to 'src')

diff --git a/src/client/App.test.tsx b/src/client/App.test.tsx
new file mode 100644
index 0000000..cd448bf
--- /dev/null
+++ b/src/client/App.test.tsx
@@ -0,0 +1,47 @@
+/**
+ * @vitest-environment jsdom
+ */
+import { cleanup, render, screen } from "@testing-library/react";
+import { afterEach, describe, expect, it } from "vitest";
+import { Router } from "wouter";
+import { memoryLocation } from "wouter/memory-location";
+import { App } from "./App";
+
+function renderWithRouter(path: string) {
+	const { hook } = memoryLocation({ path, static: true });
+	return render(
+		<Router hook={hook}>
+			<App />
+		</Router>,
+	);
+}
+
+afterEach(() => {
+	cleanup();
+});
+
+describe("App routing", () => {
+	it("renders home page at /", () => {
+		renderWithRouter("/");
+		expect(screen.getByRole("heading", { name: "Kioku" })).toBeDefined();
+		expect(screen.getByText("Spaced repetition learning app")).toBeDefined();
+	});
+
+	it("renders login page at /login", () => {
+		renderWithRouter("/login");
+		expect(screen.getByRole("heading", { name: "Login" })).toBeDefined();
+	});
+
+	it("renders register page at /register", () => {
+		renderWithRouter("/register");
+		expect(screen.getByRole("heading", { name: "Register" })).toBeDefined();
+	});
+
+	it("renders 404 page for unknown routes", () => {
+		renderWithRouter("/unknown-route");
+		expect(
+			screen.getByRole("heading", { name: "404 - Not Found" }),
+		).toBeDefined();
+		expect(screen.getByRole("link", { name: "Go to Home" })).toBeDefined();
+	});
+});
diff --git a/src/client/App.tsx b/src/client/App.tsx
index fa42302..01d843a 100644
--- a/src/client/App.tsx
+++ b/src/client/App.tsx
@@ -1,8 +1,13 @@
+import { Route, Switch } from "wouter";
+import { HomePage, LoginPage, NotFoundPage, RegisterPage } from "./pages";
+
 export function App() {
 	return (
-		<div>
-			<h1>Kioku</h1>
-			<p>Spaced repetition learning app</p>
-		</div>
+		<Switch>
+			<Route path="/" component={HomePage} />
+			<Route path="/login" component={LoginPage} />
+			<Route path="/register" component={RegisterPage} />
+			<Route component={NotFoundPage} />
+		</Switch>
 	);
 }
diff --git a/src/client/pages/HomePage.tsx b/src/client/pages/HomePage.tsx
new file mode 100644
index 0000000..1d65484
--- /dev/null
+++ b/src/client/pages/HomePage.tsx
@@ -0,0 +1,8 @@
+export function HomePage() {
+	return (
+		<div>
+			<h1>Kioku</h1>
+			<p>Spaced repetition learning app</p>
+		</div>
+	);
+}
diff --git a/src/client/pages/LoginPage.tsx b/src/client/pages/LoginPage.tsx
new file mode 100644
index 0000000..459e2ce
--- /dev/null
+++ b/src/client/pages/LoginPage.tsx
@@ -0,0 +1,8 @@
+export function LoginPage() {
+	return (
+		<div>
+			<h1>Login</h1>
+			<p>Login page coming soon</p>
+		</div>
+	);
+}
diff --git a/src/client/pages/NotFoundPage.tsx b/src/client/pages/NotFoundPage.tsx
new file mode 100644
index 0000000..289dab5
--- /dev/null
+++ b/src/client/pages/NotFoundPage.tsx
@@ -0,0 +1,11 @@
+import { Link } from "wouter";
+
+export function NotFoundPage() {
+	return (
+		<div>
+			<h1>404 - Not Found</h1>
+			<p>The page you're looking for doesn't exist.</p>
+			<Link href="/">Go to Home</Link>
+		</div>
+	);
+}
diff --git a/src/client/pages/RegisterPage.tsx b/src/client/pages/RegisterPage.tsx
new file mode 100644
index 0000000..a7fbb59
--- /dev/null
+++ b/src/client/pages/RegisterPage.tsx
@@ -0,0 +1,8 @@
+export function RegisterPage() {
+	return (
+		<div>
+			<h1>Register</h1>
+			<p>Registration page coming soon</p>
+		</div>
+	);
+}
diff --git a/src/client/pages/index.ts b/src/client/pages/index.ts
new file mode 100644
index 0000000..99cf046
--- /dev/null
+++ b/src/client/pages/index.ts
@@ -0,0 +1,4 @@
+export { HomePage } from "./HomePage";
+export { LoginPage } from "./LoginPage";
+export { NotFoundPage } from "./NotFoundPage";
+export { RegisterPage } from "./RegisterPage";
-- 
cgit v1.2.3-70-g09d2