diff options
| author | nsfisis <nsfisis@gmail.com> | 2025-12-07 03:24:42 +0900 |
|---|---|---|
| committer | nsfisis <nsfisis@gmail.com> | 2025-12-07 03:24:46 +0900 |
| commit | 26df54a09d7e195d0e33266e0b34f8e11d072277 (patch) | |
| tree | ca7f47d8beb4fcea7419350852b845b8a3179ec1 /src/client | |
| parent | 39deb471d976d863d2ec803f908025a2366f1486 (diff) | |
| download | kioku-26df54a09d7e195d0e33266e0b34f8e11d072277.tar.gz kioku-26df54a09d7e195d0e33266e0b34f8e11d072277.tar.zst kioku-26df54a09d7e195d0e33266e0b34f8e11d072277.zip | |
feat(client): remove registration page
Diffstat (limited to 'src/client')
| -rw-r--r-- | src/client/App.test.tsx | 6 | ||||
| -rw-r--r-- | src/client/App.tsx | 3 | ||||
| -rw-r--r-- | src/client/api/client.test.ts | 58 | ||||
| -rw-r--r-- | src/client/api/client.ts | 7 | ||||
| -rw-r--r-- | src/client/api/index.ts | 8 | ||||
| -rw-r--r-- | src/client/api/types.ts | 4 | ||||
| -rw-r--r-- | src/client/components/ProtectedRoute.test.tsx | 1 | ||||
| -rw-r--r-- | src/client/pages/LoginPage.test.tsx | 2 | ||||
| -rw-r--r-- | src/client/pages/LoginPage.tsx | 5 | ||||
| -rw-r--r-- | src/client/pages/RegisterPage.test.tsx | 198 | ||||
| -rw-r--r-- | src/client/pages/RegisterPage.tsx | 105 | ||||
| -rw-r--r-- | src/client/pages/index.ts | 1 | ||||
| -rw-r--r-- | src/client/stores/auth.test.tsx | 46 | ||||
| -rw-r--r-- | src/client/stores/auth.tsx | 13 |
14 files changed, 4 insertions, 453 deletions
diff --git a/src/client/App.test.tsx b/src/client/App.test.tsx index 321f073..516cbeb 100644 --- a/src/client/App.test.tsx +++ b/src/client/App.test.tsx @@ -12,7 +12,6 @@ import { AuthProvider } from "./stores"; vi.mock("./api/client", () => ({ apiClient: { login: vi.fn(), - register: vi.fn(), logout: vi.fn(), isAuthenticated: vi.fn(), getTokens: vi.fn(), @@ -86,11 +85,6 @@ describe("App routing", () => { 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( diff --git a/src/client/App.tsx b/src/client/App.tsx index 098ded7..5e749d2 100644 --- a/src/client/App.tsx +++ b/src/client/App.tsx @@ -1,6 +1,6 @@ import { Route, Switch } from "wouter"; import { ProtectedRoute } from "./components"; -import { HomePage, LoginPage, NotFoundPage, RegisterPage } from "./pages"; +import { HomePage, LoginPage, NotFoundPage } from "./pages"; export function App() { return ( @@ -11,7 +11,6 @@ export function App() { </ProtectedRoute> </Route> <Route path="/login" component={LoginPage} /> - <Route path="/register" component={RegisterPage} /> <Route component={NotFoundPage} /> </Switch> ); diff --git a/src/client/api/client.test.ts b/src/client/api/client.test.ts index 3cfe190..16deb28 100644 --- a/src/client/api/client.test.ts +++ b/src/client/api/client.test.ts @@ -56,63 +56,6 @@ describe("ApiClient", () => { vi.restoreAllMocks(); }); - describe("register", () => { - it("sends registration request without auth header", async () => { - const mockStorage = createMockTokenStorage(); - const client = new ApiClient({ - tokenStorage: mockStorage, - baseUrl: "http://localhost:3000", - }); - - const responseBody = { user: { id: "123", username: "testuser" } }; - global.fetch = mockFetch([{ status: 201, body: responseBody }]); - - const result = await client.register("testuser", "password123"); - - expect(result).toEqual(responseBody); - expect(global.fetch).toHaveBeenCalledWith( - "http://localhost:3000/api/auth/register", - expect.objectContaining({ - method: "POST", - body: JSON.stringify({ - username: "testuser", - password: "password123", - }), - }), - ); - - const call = (global.fetch as Mock).mock.calls[0] as [ - string, - RequestInit, - ]; - const headers = call[1].headers as Record<string, string>; - expect(headers.Authorization).toBeUndefined(); - }); - - it("throws ApiClientError on registration failure", async () => { - const mockStorage = createMockTokenStorage(); - const client = new ApiClient({ tokenStorage: mockStorage }); - - global.fetch = mockFetch([ - { - status: 409, - body: { error: "Username already exists", code: "USERNAME_EXISTS" }, - }, - ]); - - try { - await client.register("testuser", "password"); - expect.fail("Expected ApiClientError to be thrown"); - } catch (e) { - expect(e).toBeInstanceOf(ApiClientError); - const error = e as ApiClientError; - expect(error.message).toBe("Username already exists"); - expect(error.status).toBe(409); - expect(error.code).toBe("USERNAME_EXISTS"); - } - }); - }); - describe("login", () => { it("sends login request and stores tokens", async () => { const mockStorage = createMockTokenStorage(); @@ -223,7 +166,6 @@ describe("ApiClient", () => { // RPC client should have auth routes expect(client.rpc.api.auth.login).toBeDefined(); - expect(client.rpc.api.auth.register).toBeDefined(); expect(client.rpc.api.auth.refresh).toBeDefined(); }); }); diff --git a/src/client/api/client.ts b/src/client/api/client.ts index f9b8a61..36a7431 100644 --- a/src/client/api/client.ts +++ b/src/client/api/client.ts @@ -119,13 +119,6 @@ export class ApiClient { } } - async register(username: string, password: string) { - const res = await this.rpc.api.auth.register.$post({ - json: { username, password }, - }); - return this.handleResponse<{ user: { id: string; username: string } }>(res); - } - async login(username: string, password: string): Promise<AuthResponse> { const res = await this.rpc.api.auth.login.$post({ json: { username, password }, diff --git a/src/client/api/index.ts b/src/client/api/index.ts index 2d95c14..fb26b70 100644 --- a/src/client/api/index.ts +++ b/src/client/api/index.ts @@ -6,10 +6,4 @@ export { localStorageTokenStorage, type TokenStorage, } from "./client"; -export type { - ApiError, - AuthResponse, - RegisterResponse, - Tokens, - User, -} from "./types"; +export type { ApiError, AuthResponse, Tokens, User } from "./types"; diff --git a/src/client/api/types.ts b/src/client/api/types.ts index 1ba3624..d5df182 100644 --- a/src/client/api/types.ts +++ b/src/client/api/types.ts @@ -9,10 +9,6 @@ export interface AuthResponse { user: User; } -export interface RegisterResponse { - user: User; -} - export interface ApiError { error: string; code?: string; diff --git a/src/client/components/ProtectedRoute.test.tsx b/src/client/components/ProtectedRoute.test.tsx index 11de411..85a12cd 100644 --- a/src/client/components/ProtectedRoute.test.tsx +++ b/src/client/components/ProtectedRoute.test.tsx @@ -12,7 +12,6 @@ import { ProtectedRoute } from "./ProtectedRoute"; vi.mock("../api/client", () => ({ apiClient: { login: vi.fn(), - register: vi.fn(), logout: vi.fn(), isAuthenticated: vi.fn(), getTokens: vi.fn(), diff --git a/src/client/pages/LoginPage.test.tsx b/src/client/pages/LoginPage.test.tsx index 03cd2f7..724f433 100644 --- a/src/client/pages/LoginPage.test.tsx +++ b/src/client/pages/LoginPage.test.tsx @@ -13,7 +13,6 @@ import { LoginPage } from "./LoginPage"; vi.mock("../api/client", () => ({ apiClient: { login: vi.fn(), - register: vi.fn(), logout: vi.fn(), isAuthenticated: vi.fn(), getTokens: vi.fn(), @@ -60,7 +59,6 @@ describe("LoginPage", () => { expect(screen.getByLabelText("Username")).toBeDefined(); expect(screen.getByLabelText("Password")).toBeDefined(); expect(screen.getByRole("button", { name: "Login" })).toBeDefined(); - expect(screen.getByRole("link", { name: "Register" })).toBeDefined(); }); it("submits form and logs in successfully", async () => { diff --git a/src/client/pages/LoginPage.tsx b/src/client/pages/LoginPage.tsx index f72a6da..cc59105 100644 --- a/src/client/pages/LoginPage.tsx +++ b/src/client/pages/LoginPage.tsx @@ -1,5 +1,5 @@ import { type FormEvent, useEffect, useState } from "react"; -import { Link, useLocation } from "wouter"; +import { useLocation } from "wouter"; import { ApiClientError, useAuth } from "../stores"; export function LoginPage() { @@ -74,9 +74,6 @@ export function LoginPage() { {isSubmitting ? "Logging in..." : "Login"} </button> </form> - <p> - Don't have an account? <Link href="/register">Register</Link> - </p> </div> ); } diff --git a/src/client/pages/RegisterPage.test.tsx b/src/client/pages/RegisterPage.test.tsx deleted file mode 100644 index adce8f0..0000000 --- a/src/client/pages/RegisterPage.test.tsx +++ /dev/null @@ -1,198 +0,0 @@ -/** - * @vitest-environment jsdom - */ -import { cleanup, render, screen, waitFor } from "@testing-library/react"; -import userEvent from "@testing-library/user-event"; -import { afterEach, beforeEach, describe, expect, it, vi } from "vitest"; -import { Router } from "wouter"; -import { memoryLocation } from "wouter/memory-location"; -import { apiClient } from "../api/client"; -import { AuthProvider } from "../stores"; -import { RegisterPage } from "./RegisterPage"; - -vi.mock("../api/client", () => ({ - apiClient: { - login: vi.fn(), - register: vi.fn(), - logout: vi.fn(), - isAuthenticated: vi.fn(), - getTokens: vi.fn(), - }, - ApiClientError: class ApiClientError extends Error { - constructor( - message: string, - public status: number, - public code?: string, - ) { - super(message); - this.name = "ApiClientError"; - } - }, -})); - -function renderWithProviders(path = "/register") { - const { hook } = memoryLocation({ path }); - return render( - <Router hook={hook}> - <AuthProvider> - <RegisterPage /> - </AuthProvider> - </Router>, - ); -} - -describe("RegisterPage", () => { - beforeEach(() => { - vi.clearAllMocks(); - vi.mocked(apiClient.getTokens).mockReturnValue(null); - vi.mocked(apiClient.isAuthenticated).mockReturnValue(false); - }); - - afterEach(() => { - cleanup(); - vi.restoreAllMocks(); - }); - - it("renders register form", async () => { - renderWithProviders(); - - expect(screen.getByRole("heading", { name: "Register" })).toBeDefined(); - expect(screen.getByLabelText("Username")).toBeDefined(); - expect(screen.getByLabelText("Password")).toBeDefined(); - expect(screen.getByLabelText("Confirm Password")).toBeDefined(); - expect(screen.getByRole("button", { name: "Register" })).toBeDefined(); - expect(screen.getByRole("link", { name: "Login" })).toBeDefined(); - }); - - it("validates password match", async () => { - const user = userEvent.setup(); - renderWithProviders(); - - await user.type(screen.getByLabelText("Username"), "testuser"); - await user.type(screen.getByLabelText("Password"), "password123"); - await user.type(screen.getByLabelText("Confirm Password"), "differentpass"); - await user.click(screen.getByRole("button", { name: "Register" })); - - expect(screen.getByRole("alert").textContent).toBe( - "Passwords do not match", - ); - expect(apiClient.register).not.toHaveBeenCalled(); - }); - - it("validates password length", async () => { - const user = userEvent.setup(); - renderWithProviders(); - - await user.type(screen.getByLabelText("Username"), "testuser"); - await user.type(screen.getByLabelText("Password"), "short"); - await user.type(screen.getByLabelText("Confirm Password"), "short"); - await user.click(screen.getByRole("button", { name: "Register" })); - - expect(screen.getByRole("alert").textContent).toBe( - "Password must be at least 8 characters", - ); - expect(apiClient.register).not.toHaveBeenCalled(); - }); - - it("submits form and registers successfully", async () => { - const user = userEvent.setup(); - const mockUser = { id: "user-1", username: "testuser" }; - vi.mocked(apiClient.register).mockResolvedValue({ user: mockUser }); - vi.mocked(apiClient.login).mockResolvedValue({ - accessToken: "access-token", - refreshToken: "refresh-token", - user: mockUser, - }); - - renderWithProviders(); - - await user.type(screen.getByLabelText("Username"), "testuser"); - await user.type(screen.getByLabelText("Password"), "password123"); - await user.type(screen.getByLabelText("Confirm Password"), "password123"); - await user.click(screen.getByRole("button", { name: "Register" })); - - await waitFor(() => { - expect(apiClient.register).toHaveBeenCalledWith( - "testuser", - "password123", - ); - }); - expect(apiClient.login).toHaveBeenCalledWith("testuser", "password123"); - }); - - it("displays error on registration failure", async () => { - const user = userEvent.setup(); - const { ApiClientError } = await import("../api/client"); - vi.mocked(apiClient.register).mockRejectedValue( - new ApiClientError("Username already taken", 409), - ); - - renderWithProviders(); - - await user.type(screen.getByLabelText("Username"), "existinguser"); - await user.type(screen.getByLabelText("Password"), "password123"); - await user.type(screen.getByLabelText("Confirm Password"), "password123"); - await user.click(screen.getByRole("button", { name: "Register" })); - - await waitFor(() => { - expect(screen.getByRole("alert").textContent).toBe( - "Username already taken", - ); - }); - }); - - it("disables form while submitting", async () => { - const user = userEvent.setup(); - vi.mocked(apiClient.register).mockImplementation( - () => new Promise(() => {}), // Never resolves - ); - - renderWithProviders(); - - await user.type(screen.getByLabelText("Username"), "testuser"); - await user.type(screen.getByLabelText("Password"), "password123"); - await user.type(screen.getByLabelText("Confirm Password"), "password123"); - await user.click(screen.getByRole("button", { name: "Register" })); - - await waitFor(() => { - const button = screen.getByRole("button", { name: "Registering..." }); - expect(button.hasAttribute("disabled")).toBe(true); - }); - expect( - (screen.getByLabelText("Username") as HTMLInputElement).disabled, - ).toBe(true); - expect( - (screen.getByLabelText("Password") as HTMLInputElement).disabled, - ).toBe(true); - expect( - (screen.getByLabelText("Confirm Password") as HTMLInputElement).disabled, - ).toBe(true); - }); - - it("calls navigate when already authenticated", async () => { - vi.mocked(apiClient.isAuthenticated).mockReturnValue(true); - vi.mocked(apiClient.getTokens).mockReturnValue({ - accessToken: "access-token", - refreshToken: "refresh-token", - }); - - const { hook } = memoryLocation({ path: "/register" }); - const navigateSpy = vi.fn(); - const hookWithSpy: typeof hook = () => { - const result = hook(); - return [result[0], navigateSpy]; - }; - - render( - <Router hook={hookWithSpy}> - <AuthProvider> - <RegisterPage /> - </AuthProvider> - </Router>, - ); - - await waitFor(() => { - expect(navigateSpy).toHaveBeenCalledWith("/", { replace: true }); - }); - }); -}); diff --git a/src/client/pages/RegisterPage.tsx b/src/client/pages/RegisterPage.tsx deleted file mode 100644 index e6783bd..0000000 --- a/src/client/pages/RegisterPage.tsx +++ /dev/null @@ -1,105 +0,0 @@ -import { type FormEvent, useEffect, useState } from "react"; -import { Link, useLocation } from "wouter"; -import { ApiClientError, useAuth } from "../stores"; - -export function RegisterPage() { - const [, navigate] = useLocation(); - const { register, isAuthenticated } = useAuth(); - const [username, setUsername] = useState(""); - const [password, setPassword] = useState(""); - const [confirmPassword, setConfirmPassword] = useState(""); - const [error, setError] = useState<string | null>(null); - const [isSubmitting, setIsSubmitting] = useState(false); - - // Redirect if already authenticated - useEffect(() => { - if (isAuthenticated) { - navigate("/", { replace: true }); - } - }, [isAuthenticated, navigate]); - - const handleSubmit = async (e: FormEvent) => { - e.preventDefault(); - setError(null); - - if (password !== confirmPassword) { - setError("Passwords do not match"); - return; - } - - if (password.length < 8) { - setError("Password must be at least 8 characters"); - return; - } - - setIsSubmitting(true); - - try { - await register(username, password); - navigate("/", { replace: true }); - } catch (err) { - if (err instanceof ApiClientError) { - setError(err.message); - } else { - setError("Registration failed. Please try again."); - } - } finally { - setIsSubmitting(false); - } - }; - - return ( - <div> - <h1>Register</h1> - <form onSubmit={handleSubmit}> - {error && ( - <div role="alert" style={{ color: "red" }}> - {error} - </div> - )} - <div> - <label htmlFor="username">Username</label> - <input - id="username" - type="text" - value={username} - onChange={(e) => setUsername(e.target.value)} - required - autoComplete="username" - disabled={isSubmitting} - /> - </div> - <div> - <label htmlFor="password">Password</label> - <input - id="password" - type="password" - value={password} - onChange={(e) => setPassword(e.target.value)} - required - autoComplete="new-password" - disabled={isSubmitting} - /> - </div> - <div> - <label htmlFor="confirmPassword">Confirm Password</label> - <input - id="confirmPassword" - type="password" - value={confirmPassword} - onChange={(e) => setConfirmPassword(e.target.value)} - required - autoComplete="new-password" - disabled={isSubmitting} - /> - </div> - <button type="submit" disabled={isSubmitting}> - {isSubmitting ? "Registering..." : "Register"} - </button> - </form> - <p> - Already have an account? <Link href="/login">Login</Link> - </p> - </div> - ); -} diff --git a/src/client/pages/index.ts b/src/client/pages/index.ts index 99cf046..0844b31 100644 --- a/src/client/pages/index.ts +++ b/src/client/pages/index.ts @@ -1,4 +1,3 @@ export { HomePage } from "./HomePage"; export { LoginPage } from "./LoginPage"; export { NotFoundPage } from "./NotFoundPage"; -export { RegisterPage } from "./RegisterPage"; diff --git a/src/client/stores/auth.test.tsx b/src/client/stores/auth.test.tsx index ab6b554..72ab9e3 100644 --- a/src/client/stores/auth.test.tsx +++ b/src/client/stores/auth.test.tsx @@ -11,7 +11,6 @@ import { AuthProvider, useAuth } from "./auth"; vi.mock("../api/client", () => ({ apiClient: { login: vi.fn(), - register: vi.fn(), logout: vi.fn(), isAuthenticated: vi.fn(), getTokens: vi.fn(), @@ -124,51 +123,6 @@ describe("useAuth", () => { }); }); - describe("register", () => { - it("registers and logs in automatically", async () => { - const mockUser = { id: "user-1", username: "newuser" }; - vi.mocked(apiClient.register).mockResolvedValue({ user: mockUser }); - vi.mocked(apiClient.login).mockResolvedValue({ - accessToken: "access-token", - refreshToken: "refresh-token", - user: mockUser, - }); - vi.mocked(apiClient.isAuthenticated).mockReturnValue(true); - - const { result } = renderHook(() => useAuth(), { wrapper }); - - await waitFor(() => { - expect(result.current.isLoading).toBe(false); - }); - - await act(async () => { - await result.current.register("newuser", "password123"); - }); - - expect(apiClient.register).toHaveBeenCalledWith("newuser", "password123"); - expect(apiClient.login).toHaveBeenCalledWith("newuser", "password123"); - expect(result.current.user).toEqual(mockUser); - }); - - it("propagates registration errors", async () => { - vi.mocked(apiClient.register).mockRejectedValue( - new Error("Username taken"), - ); - - const { result } = renderHook(() => useAuth(), { wrapper }); - - await waitFor(() => { - expect(result.current.isLoading).toBe(false); - }); - - await expect( - act(async () => { - await result.current.register("existinguser", "password123"); - }), - ).rejects.toThrow("Username taken"); - }); - }); - describe("logout", () => { it("logs out and clears user", async () => { const mockUser = { id: "user-1", username: "testuser" }; diff --git a/src/client/stores/auth.tsx b/src/client/stores/auth.tsx index cca314a..58e9d40 100644 --- a/src/client/stores/auth.tsx +++ b/src/client/stores/auth.tsx @@ -18,7 +18,6 @@ export interface AuthState { export interface AuthActions { login: (username: string, password: string) => Promise<void>; - register: (username: string, password: string) => Promise<void>; logout: () => void; } @@ -52,15 +51,6 @@ export function AuthProvider({ children }: AuthProviderProps) { setUser(response.user); }, []); - const register = useCallback( - async (username: string, password: string) => { - await apiClient.register(username, password); - // After registration, log in automatically - await login(username, password); - }, - [login], - ); - const logout = useCallback(() => { apiClient.logout(); setUser(null); @@ -74,10 +64,9 @@ export function AuthProvider({ children }: AuthProviderProps) { isAuthenticated, isLoading, login, - register, logout, }), - [user, isAuthenticated, isLoading, login, register, logout], + [user, isAuthenticated, isLoading, login, logout], ); return <AuthContext.Provider value={value}>{children}</AuthContext.Provider>; |
