diff --git a/frontend/src/api/angular-client.ts b/frontend/src/api/angular-client.ts index add41c1..7c43c26 100644 --- a/frontend/src/api/angular-client.ts +++ b/frontend/src/api/angular-client.ts @@ -1,4 +1,13 @@ -import type { ApiFailure, ApiResult, HealthResponse, SessionDetailResponse } from './types'; +import type { + ApiFailure, + ApiResult, + HealthResponse, + JoinSessionRequest, + JoinSessionResponse, + SessionDetailResponse, + StartRoundRequest, + StartRoundResponse +} from './types'; export interface AngularHttpError { status?: number; @@ -8,11 +17,14 @@ export interface AngularHttpError { export interface AngularHttpClientLike { get(url: string, options?: { withCredentials?: boolean }): Promise; + post(url: string, body: unknown, options?: { withCredentials?: boolean }): Promise; } export interface AngularApiClient { health(): Promise>; getSession(code: string): Promise>; + joinSession(payload: JoinSessionRequest): Promise>; + startRound(code: string, payload: StartRoundRequest): Promise>; } function toFailure(error: unknown): ApiFailure { @@ -40,23 +52,54 @@ function normalizeCode(code: string): string { return code.trim().toUpperCase(); } -async function wrapGet(call: () => Promise): Promise> { +function normalizeBaseUrl(baseUrl: string): string { + return baseUrl.endsWith('/') ? baseUrl.slice(0, -1) : baseUrl; +} + +function buildUrl(baseUrl: string, path: string): string { + return `${normalizeBaseUrl(baseUrl)}${path}`; +} + +async function wrap(call: () => Promise): Promise> { try { const data = await call(); return { ok: true, status: 200, data }; } catch (error: unknown) { - return { ok: false, status: typeof (error as AngularHttpError)?.status === 'number' ? (error as AngularHttpError).status! : 0, error: toFailure(error) }; + return { + ok: false, + status: typeof (error as AngularHttpError)?.status === 'number' ? (error as AngularHttpError).status! : 0, + error: toFailure(error) + }; } } export function createAngularApiClient(http: AngularHttpClientLike, baseUrl = ''): AngularApiClient { return { - health: () => wrapGet(() => http.get(`${baseUrl}/healthz`, { withCredentials: true })), + health: () => wrap(() => http.get(buildUrl(baseUrl, '/healthz'), { withCredentials: true })), getSession: (code: string) => - wrapGet(() => - http.get(`${baseUrl}/lobby/sessions/${encodeURIComponent(normalizeCode(code))}`, { + wrap(() => + http.get(buildUrl(baseUrl, `/lobby/sessions/${encodeURIComponent(normalizeCode(code))}`), { withCredentials: true }) + ), + joinSession: (payload: JoinSessionRequest) => + wrap(() => + http.post( + buildUrl(baseUrl, '/lobby/sessions/join'), + { + code: normalizeCode(payload.code), + nickname: payload.nickname.trim() + }, + { withCredentials: true } + ) + ), + startRound: (code: string, payload: StartRoundRequest) => + wrap(() => + http.post( + buildUrl(baseUrl, `/lobby/sessions/${encodeURIComponent(normalizeCode(code))}/rounds/start`), + payload, + { withCredentials: true } + ) ) }; } diff --git a/frontend/tests/angular-api-client.test.ts b/frontend/tests/angular-api-client.test.ts index 1020362..20f0bac 100644 --- a/frontend/tests/angular-api-client.test.ts +++ b/frontend/tests/angular-api-client.test.ts @@ -49,7 +49,27 @@ describe('createAngularApiClient', () => { throw { status: 404, error: { error: 'Not found' } }; }); - const http = { get }; + const post = vi.fn(async (url: string, body: unknown) => { + if (url === '/lobby/sessions/join') { + expect(body).toEqual({ code: 'ABCD12', nickname: 'Maja' }); + return { + player: { id: 9, nickname: 'Maja', session_token: 'token-1', score: 0 }, + session: { code: 'ABCD12', status: 'lobby' } + } as T; + } + + if (url === '/lobby/sessions/ABCD12/rounds/start') { + expect(body).toEqual({ category_slug: 'history' }); + return { + session: { code: 'ABCD12', status: 'lie', current_round: 1 }, + round: { number: 1, category: { slug: 'history', name: 'History' } } + } as T; + } + + throw { status: 404, error: { error: 'Not found' } }; + }); + + const http = { get, post }; const client = createAngularApiClient(http as AngularHttpClientLike); const health = await client.health(); @@ -67,26 +87,135 @@ describe('createAngularApiClient', () => { expect(session.data.phase_view_model.host.can_start_round).toBe(true); } + const join = await client.joinSession({ code: ' abcd12 ', nickname: ' Maja ' }); + expect(join.ok).toBe(true); + + const start = await client.startRound(' abcd12 ', { category_slug: 'history' }); + expect(start.ok).toBe(true); + expect(get).toHaveBeenNthCalledWith(1, '/healthz', { withCredentials: true }); expect(get).toHaveBeenNthCalledWith(2, '/lobby/sessions/ABCD12', { withCredentials: true }); + expect(post).toHaveBeenNthCalledWith( + 1, + '/lobby/sessions/join', + { code: 'ABCD12', nickname: 'Maja' }, + { withCredentials: true } + ); + expect(post).toHaveBeenNthCalledWith( + 2, + '/lobby/sessions/ABCD12/rounds/start', + { category_slug: 'history' }, + { withCredentials: true } + ); + }); + + it('normalizes baseUrl with trailing slash to keep Django endpoint paths canonical', async () => { + const get = vi.fn(async (url: string) => { + if (url === '/api/healthz') { + return { ok: true, service: 'partyhub' } as T; + } + if (url === '/api/lobby/sessions/ABCD12') { + return { + session: { code: 'ABCD12', status: 'lobby', host_id: 1, current_round: 1, players_count: 2 }, + players: [], + round_question: null, + phase_view_model: { + status: 'lobby', + round_number: 1, + players_count: 2, + constraints: { + min_players_to_start: 2, + max_players_mvp: 8, + min_players_reached: true, + max_players_allowed: true + }, + host: { + can_start_round: true, + can_show_question: false, + can_mix_answers: false, + can_calculate_scores: false, + can_reveal_scoreboard: false, + can_start_next_round: false, + can_finish_game: false + }, + player: { + can_join: true, + can_submit_lie: false, + can_submit_guess: false, + can_view_final_result: false + } + } + } as T; + } + throw { status: 404, error: { error: 'Not found' } }; + }); + + const post = vi.fn(async (url: string) => { + if (url === '/api/lobby/sessions/join') { + return { + player: { id: 9, nickname: 'Maja', session_token: 'token-1', score: 0 }, + session: { code: 'ABCD12', status: 'lobby' } + } as T; + } + if (url === '/api/lobby/sessions/ABCD12/rounds/start') { + return { + session: { code: 'ABCD12', status: 'lie', current_round: 1 }, + round: { number: 1, category: { slug: 'history', name: 'History' } } + } as T; + } + throw { status: 404, error: { error: 'Not found' } }; + }); + + const client = createAngularApiClient({ get, post } as AngularHttpClientLike, '/api/'); + + await client.health(); + await client.getSession('abcd12'); + await client.joinSession({ code: 'abcd12', nickname: 'Maja' }); + await client.startRound('abcd12', { category_slug: 'history' }); + + expect(get).toHaveBeenNthCalledWith(1, '/api/healthz', { withCredentials: true }); + expect(get).toHaveBeenNthCalledWith(2, '/api/lobby/sessions/ABCD12', { withCredentials: true }); + expect(post).toHaveBeenNthCalledWith( + 1, + '/api/lobby/sessions/join', + { code: 'ABCD12', nickname: 'Maja' }, + { withCredentials: true } + ); + expect(post).toHaveBeenNthCalledWith( + 2, + '/api/lobby/sessions/ABCD12/rounds/start', + { category_slug: 'history' }, + { withCredentials: true } + ); }); it('maps HttpErrorResponse-style failures to ApiResult errors', async () => { const http = { get: vi.fn(async () => { throw { status: 503, message: 'Service unavailable', error: { error: 'maintenance' } }; + }), + post: vi.fn(async () => { + throw { status: 403, message: 'Forbidden', error: { error: 'Only host can start round' } }; }) }; const client = createAngularApiClient(http as AngularHttpClientLike); - const result = await client.health(); + const health = await client.health(); - expect(result.ok).toBe(false); - if (!result.ok) { - expect(result.status).toBe(503); - expect(result.error.kind).toBe('http'); - expect(result.error.payload).toEqual({ error: 'maintenance' }); - expect(result.error.message).toContain('Service unavailable'); + expect(health.ok).toBe(false); + if (!health.ok) { + expect(health.status).toBe(503); + expect(health.error.kind).toBe('http'); + expect(health.error.payload).toEqual({ error: 'maintenance' }); + expect(health.error.message).toContain('Service unavailable'); + } + + const start = await client.startRound('ABCD12', { category_slug: 'history' }); + expect(start.ok).toBe(false); + if (!start.ok) { + expect(start.status).toBe(403); + expect(start.error.kind).toBe('http'); + expect(start.error.payload).toEqual({ error: 'Only host can start round' }); } }); });