araemer/recipe-app
1
0
Fork 0
Code Issues 4 Pull requests Projects Releases Packages Wiki Activity Actions

Add the API Client to all rest resources

Browse source
This commit is contained in:
araemer 2026-02-22 13:15:48 +01:00
parent 0dc3264a22
commit 709cb23f3d
6 changed files with 29 additions and 53 deletions
Download patch file Download diff file Expand all files Collapse all files

2
frontend/src/api/apiClient.ts
View file

@ -90,8 +90,6 @@ export const apiClient = {
get: <T>(endpoint: string) => apiRequest<T>(endpoint, {method: "GET"}),
post: <T>(endpoint: string, body: object) =>
apiRequest<T>(endpoint, {method: "POST", body: JSON.stringify(body)}),
put: <T>(endpoint: string, body: object) =>
apiRequest<T>(endpoint, {method: "PUT", body: JSON.stringify(body)}),
delete: <T>(endpoint: string) =>
apiRequest<T>(endpoint, {method: "DELETE"}),
};

14
frontend/src/api/endpoints/AuthRestResource.ts
View file

@ -1,18 +1,11 @@
import type {LoginRequest} from "../dtos/LoginRequest.ts";
import type {LoginResponse} from "../dtos/LoginResponse.ts";
import {postJson} from "../utils/requests";
/**
* Util for handling the recipe api
*/
// read base url from .env file
const BASE_URL = import.meta.env.VITE_API_BASE;
import {apiClient} from "../apiClient.ts";
/**
* URL for handling recipes
*/
const AUTH_URL = `${BASE_URL}/auth`
const AUTH_URL = `/auth`
/**
@ -21,6 +14,5 @@ const AUTH_URL = `${BASE_URL}/auth`
* @returns LoginResponse
*/
export async function login(loginRequest: LoginRequest): Promise<LoginResponse> {
const res = await postJson(`${AUTH_URL}/login`, JSON.stringify(loginRequest), false);
return res.json();
return apiClient.post(`${AUTH_URL}/login`, loginRequest);
}

23
frontend/src/api/endpoints/CompactRecipeRestResource.ts
View file

@ -1,29 +1,22 @@
import type { RecipeModel } from "../../models/RecipeModel"
import { get } from "../utils/requests";
import type {RecipeModel} from "../../models/RecipeModel"
import {apiClient} from "../apiClient.ts";
/**
* Util for handling the recipe api
*/
// read base url from .env file
const BASE_URL = import.meta.env.VITE_API_BASE;
/**
* URL for handling recipes header data
*/
const RECIPE_URL = `${BASE_URL}/compact-recipe`
const RECIPE_URL = "/compact-recipe"
/**
* Load list of all recipes
* @param searchString Search string for filtering recipeList
* @returns Array of recipe
*/
export async function fetchRecipeList(searchString : string): Promise<RecipeModel[]> {
let url : string = RECIPE_URL; // add an s to the base URL as we want to load a list
export async function fetchRecipeList(searchString: string): Promise<RecipeModel[]> {
let url: string = RECIPE_URL; // add an s to the base URL as we want to load a list
// if there's a search string add it as query parameter
if(searchString && searchString !== ""){
url +="?search=" + searchString;
if (searchString && searchString !== "") {
url += "?search=" + searchString;
}
const res = await get(url);
return res.json();
return apiClient.get(url);
}

19
frontend/src/api/endpoints/RecipeRestResource.ts
View file

@ -1,17 +1,10 @@
import type { RecipeDto } from "../dtos/RecipeDto";
import { get, postJson } from "../utils/requests";
/**
* Util for handling the recipe api
*/
// read base url from .env file
const BASE_URL = import.meta.env.VITE_API_BASE;
import type {RecipeDto} from "../dtos/RecipeDto";
import {apiClient} from "../apiClient.ts";
/**
* URL for handling recipes
*/
const RECIPE_URL = `${BASE_URL}/recipe`
const RECIPE_URL = "/recipe"
/**
* Load a single recipe
@ -19,8 +12,7 @@ const RECIPE_URL = `${BASE_URL}/recipe`
* @returns A single recipe
*/
export async function fetchRecipe(id: string): Promise<RecipeDto> {
const res = await get(`${RECIPE_URL}/${id}`)
return res.json()
return apiClient.get(`${RECIPE_URL}/${id}`);
}
/**
@ -29,6 +21,5 @@ export async function fetchRecipe(id: string): Promise<RecipeDto> {
* @returns Saved recipe
*/
export async function createOrUpdateRecipe(recipe: RecipeDto): Promise<RecipeDto> {
const res = await postJson(RECIPE_URL + "/create-or-update", JSON.stringify(recipe));
return res.json();
return apiClient.post(`${RECIPE_URL}/create-or-update`, recipe);
}

8
frontend/src/api/endpoints/TagRestResource.ts
View file

@ -1,13 +1,13 @@
import {apiClient} from "../apiClient"
import type {TagDto} from "../dtos/TagDto"
const TAG_ENDPOINT = "tags"
const TAG_URL = `/tag`
/**
* Fetches all existing tags from the backend.
*/
export async function fetchAllTags(): Promise<TagDto[]> {
return apiClient.get<TagDto[]>(TAG_ENDPOINT)
return apiClient.get<TagDto[]>(`${TAG_URL}/all`)
}
/**
@ -15,7 +15,7 @@ export async function fetchAllTags(): Promise<TagDto[]> {
* @param tag The tag to create or update
*/
export async function createOrUpdateTag(tag: TagDto): Promise<TagDto> {
return apiClient.post<TagDto>(`${TAG_ENDPOINT}/create-or-update`, tag)
return apiClient.post<TagDto>(`${TAG_URL}/create-or-update`, tag)
}
/**
@ -23,5 +23,5 @@ export async function createOrUpdateTag(tag: TagDto): Promise<TagDto> {
* @param id The ID of the tag to delete
*/
export async function deleteTag(id: string): Promise<void> {
return apiClient.delete(`${TAG_ENDPOINT}/${id}`)
return apiClient.delete(`${TAG_URL}/${id}`)
}

12
frontend/src/api/endpoints/UserRestResource.ts
View file

@ -5,22 +5,24 @@ import type {ChangeUserPasswordRequest} from "../dtos/ChangeUserPasswordRequest.
import type {CreateUserResponse} from "../dtos/CreateUserResponse.ts";
import type {UserListResponse} from "../dtos/UserListResponse.ts";
const USER_URL = "/user"
export async function fetchCurrentUser(): Promise<UserDto> {
return apiClient.get("/user/me");
return apiClient.get(`${USER_URL}/me`);
}
export async function fetchAllUsers(): Promise<UserListResponse> {
return apiClient.get("/user/all");
return apiClient.get(`${USER_URL}/all`);
}
export async function createUser(dto: CreateUserRequest): Promise<CreateUserResponse> {
return apiClient.post("/user/create", dto);
return apiClient.post(`${USER_URL}/create`, dto);
}
export async function updateUser(dto: UserDto): Promise<UserDto> {
return apiClient.post("/user/update", dto);
return apiClient.post(`${USER_URL}/update`, dto);
}
export async function changePassword(dto: ChangeUserPasswordRequest) {
return apiClient.post("/user/change-password", dto);
return apiClient.post(`${USER_URL}/change-password`, dto);
}