From 0cbcab65975d25257f344bf333619a5ee20d7fc5 Mon Sep 17 00:00:00 2001 From: john Date: Tue, 20 May 2025 11:47:16 +0200 Subject: [PATCH] injext client --- src/app/api/client.ts | 31 +++++++++++++++--------------- src/app/auth/authService.ts | 16 +++++++-------- src/app/feed/posts/postsService.ts | 10 +++++----- src/app/media/mediaService.ts | 6 +++--- src/initApp.ts | 9 ++++++--- 5 files changed, 38 insertions(+), 34 deletions(-) diff --git a/src/app/api/client.ts b/src/app/api/client.ts index b8ca07f..54da36f 100644 --- a/src/app/api/client.ts +++ b/src/app/api/client.ts @@ -1,20 +1,21 @@ import { paths } from './schema.ts' -import createClient, { Middleware } from 'openapi-fetch' +import createClient, { Client, Middleware } from 'openapi-fetch' import { dispatchMessage } from '../messageBus/messageBus.ts' -const client = createClient({ baseUrl: import.meta.env.VITE_API_URL }) +export type ApiClient = Client -const UnauthorizedHandlerMiddleware: Middleware = { - async onResponse({ response }) { - console.debug(response.headers.getSetCookie()) - console.debug(response.headers.get('set-cookie')) - if (response.status === 401) { - dispatchMessage('auth:unauthorized', null) - } - }, +export function initClient(): ApiClient { + const client = createClient({ baseUrl: import.meta.env.VITE_API_URL }) + const UnauthorizedHandlerMiddleware: Middleware = { + async onResponse({ response }) { + console.debug(response.headers.getSetCookie()) + console.debug(response.headers.get('set-cookie')) + if (response.status === 401) { + dispatchMessage('auth:unauthorized', null) + } + }, + } + + client.use(UnauthorizedHandlerMiddleware) + return client } - -client.use(UnauthorizedHandlerMiddleware) - -// todo inject this if necessary -export default client diff --git a/src/app/auth/authService.ts b/src/app/auth/authService.ts index 3557c52..7916caf 100644 --- a/src/app/auth/authService.ts +++ b/src/app/auth/authService.ts @@ -1,14 +1,14 @@ import { dispatchMessage } from '../messageBus/messageBus.ts' -import client from '../api/client.ts' import { ProblemDetails } from '../../types' import { SignupCode } from './signupCode.ts' import { getCookie } from './cookies.ts' +import { ApiClient } from '../api/client.ts' export class AuthService { - constructor() {} + constructor(private readonly client: ApiClient) {} async login(username: string, password: string) { - const res = await client.POST('/auth/login', { + const res = await this.client.POST('/auth/login', { body: { username, password }, credentials: 'include', }) @@ -21,7 +21,7 @@ export class AuthService { } async signup(username: string, password: string, signupCode: string) { - const res = await client.POST('/auth/register', { + const res = await this.client.POST('/auth/register', { body: { username, password, signupCode, email: null }, credentials: 'include', }) @@ -35,13 +35,13 @@ export class AuthService { } async logout() { - await client.DELETE('/auth/session', { credentials: 'include' }) + await this.client.DELETE('/auth/session', { credentials: 'include' }) dispatchMessage('auth:logged-out', null) } async createSignupCode(code: string, email: string, name: string) { - const res = await client.POST('/auth/signup-codes', { + const res = await this.client.POST('/auth/signup-codes', { body: { code, email, name }, credentials: 'include', }) @@ -53,7 +53,7 @@ export class AuthService { } async listSignupCodes() { - const res = await client.GET('/auth/signup-codes', { + const res = await this.client.GET('/auth/signup-codes', { credentials: 'include', }) @@ -70,7 +70,7 @@ export class AuthService { return null } - await client.GET(`/auth/user/{userId}`, { + await this.client.GET(`/auth/user/{userId}`, { params: { path: { userId }, }, diff --git a/src/app/feed/posts/postsService.ts b/src/app/feed/posts/postsService.ts index f7da251..6eaf4cc 100644 --- a/src/app/feed/posts/postsService.ts +++ b/src/app/feed/posts/postsService.ts @@ -1,8 +1,8 @@ import { Post } from './posts.ts' -import client from '../../api/client.ts' +import { ApiClient } from '../../api/client.ts' export class PostsService { - constructor() {} + constructor(private readonly client: ApiClient) {} async createNew( authorId: string, @@ -10,7 +10,7 @@ export class PostsService { media: CreatePostMedia[], isPublic: boolean, ): Promise { - const response = await client.POST('/posts', { + const response = await this.client.POST('/posts', { body: { authorId, content, @@ -30,7 +30,7 @@ export class PostsService { } async loadPublicFeed(cursor: string | null, amount: number | null): Promise { - const response = await client.GET('/posts', { + const response = await this.client.GET('/posts', { query: { cursor, amount }, credentials: 'include', }) @@ -47,7 +47,7 @@ export class PostsService { cursor: string | null, amount: number | null, ): Promise { - const response = await client.GET('/posts', { + const response = await this.client.GET('/posts', { params: { query: { From: cursor ?? undefined, Amount: amount ?? undefined, Author: username }, }, diff --git a/src/app/media/mediaService.ts b/src/app/media/mediaService.ts index c63c627..9c83d2b 100644 --- a/src/app/media/mediaService.ts +++ b/src/app/media/mediaService.ts @@ -1,12 +1,12 @@ -import client from '../api/client.ts' +import { ApiClient } from '../api/client.ts' export class MediaService { - constructor() {} + constructor(private readonly client: ApiClient) {} async uploadFile(file: File): Promise<{ mediaId: string; url: URL }> { const body = new FormData() body.append('file', file) - const response = await client.POST('/media', { + const response = await this.client.POST('/media', { // @ts-expect-error this endpoint takes multipart/form-data which means passing a FormData as the body // maybe openapi-fetch only wants to handle JSON? who knows body, diff --git a/src/initApp.ts b/src/initApp.ts index 44bec96..de47b56 100644 --- a/src/initApp.ts +++ b/src/initApp.ts @@ -3,14 +3,17 @@ import { setGlobal } from './app/femtoApp.ts' import { PostsService } from './app/feed/posts/postsService.ts' import { MediaService } from './app/media/mediaService.ts' import { AuthService } from './app/auth/authService.ts' +import { initClient } from './app/api/client.ts' export function initApp() { setGlobal('version', import.meta.env.VITE_FEMTO_VERSION) initUser() - const postService = new PostsService() - const mediaService = new MediaService() - const authService = new AuthService() + const client = initClient() + + const postService = new PostsService(client) + const mediaService = new MediaService(client) + const authService = new AuthService(client) return { postService, mediaService, authService } }