fix: use dynamic recipeLang in API calls instead of hardcoded /api/rezepte
All checks were successful
CI / update (push) Successful in 4m3s

Client-side navigation to /recipes hung because getUserFavorites and
other endpoints were hardcoded to /api/rezepte, causing fetch mismatches
during SvelteKit's client-side routing.
This commit is contained in:
2026-04-07 19:50:34 +02:00
parent d21162c10c
commit a432e6ebd5
14 changed files with 23 additions and 19 deletions

View File

@@ -1,6 +1,6 @@
{ {
"name": "homepage", "name": "homepage",
"version": "1.4.2", "version": "1.4.3",
"private": true, "private": true,
"type": "module", "type": "module",
"scripts": { "scripts": {

View File

@@ -1,9 +1,12 @@
<script lang="ts"> <script lang="ts">
import { browser } from '$app/environment'; import { browser } from '$app/environment';
import { enhance } from '$app/forms'; import { enhance } from '$app/forms';
import { page } from '$app/stores';
let { recipeId, isFavorite = $bindable(false), isLoggedIn = false } = $props<{ recipeId: string, isFavorite?: boolean, isLoggedIn?: boolean }>(); let { recipeId, isFavorite = $bindable(false), isLoggedIn = false } = $props<{ recipeId: string, isFavorite?: boolean, isLoggedIn?: boolean }>();
const recipeLang = $derived($page.url.pathname.split('/')[1] || 'rezepte');
let isLoading = $state(false); let isLoading = $state(false);
async function toggleFavorite(event: Event) { async function toggleFavorite(event: Event) {
@@ -17,7 +20,7 @@
try { try {
const method = isFavorite ? 'DELETE' : 'POST'; const method = isFavorite ? 'DELETE' : 'POST';
const response = await fetch('/api/rezepte/favorites', { const response = await fetch(`/api/${recipeLang}/favorites`, {
method, method,
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',

View File

@@ -284,7 +284,7 @@
const apiBase = `/api/${isEnglish ? 'recipes' : 'rezepte'}`; const apiBase = `/api/${isEnglish ? 'recipes' : 'rezepte'}`;
const [tagsRes, iconsRes] = await Promise.all([ const [tagsRes, iconsRes] = await Promise.all([
fetch(`${apiBase}/items/tag`), fetch(`${apiBase}/items/tag`),
fetch('/api/rezepte/items/icon') fetch(`${apiBase}/items/icon`)
]); ]);
availableTags = await tagsRes.json(); availableTags = await tagsRes.json();
availableIcons = await iconsRes.json(); availableIcons = await iconsRes.json();

View File

@@ -7,7 +7,7 @@ import type { Session } from '@auth/sveltekit';
type BriefRecipeWithFavorite = BriefRecipeType & { isFavorite: boolean }; type BriefRecipeWithFavorite = BriefRecipeType & { isFavorite: boolean };
export async function getUserFavorites(fetch: typeof globalThis.fetch, locals: App.Locals): Promise<string[]> { export async function getUserFavorites(fetch: typeof globalThis.fetch, locals: App.Locals, recipeLang = 'rezepte'): Promise<string[]> {
const session = await locals.auth(); const session = await locals.auth();
if (!session?.user?.nickname) { if (!session?.user?.nickname) {
@@ -15,7 +15,7 @@ export async function getUserFavorites(fetch: typeof globalThis.fetch, locals: A
} }
try { try {
const favRes = await fetch('/api/rezepte/favorites'); const favRes = await fetch(`/api/${recipeLang}/favorites`);
if (favRes.ok) { if (favRes.ok) {
const favData = await favRes.json(); const favData = await favRes.json();
return favData.favorites || []; return favData.favorites || [];
@@ -44,11 +44,12 @@ export function addFavoriteStatusToRecipes(recipes: BriefRecipeType[], userFavor
export async function loadRecipesWithFavorites( export async function loadRecipesWithFavorites(
fetch: typeof globalThis.fetch, fetch: typeof globalThis.fetch,
locals: App.Locals, locals: App.Locals,
recipeLoader: () => Promise<BriefRecipeType[]> recipeLoader: () => Promise<BriefRecipeType[]>,
recipeLang = 'rezepte'
): Promise<{ recipes: BriefRecipeWithFavorite[], session: Session | null }> { ): Promise<{ recipes: BriefRecipeWithFavorite[], session: Session | null }> {
const [recipes, userFavorites, session] = await Promise.all([ const [recipes, userFavorites, session] = await Promise.all([
recipeLoader(), recipeLoader(),
getUserFavorites(fetch, locals), getUserFavorites(fetch, locals, recipeLang),
locals.auth() locals.auth()
]); ]);

View File

@@ -8,7 +8,7 @@ export const load: PageServerLoad = async ({ fetch, locals, params }) => {
// Fetch all_brief, favorites, and session in parallel // Fetch all_brief, favorites, and session in parallel
const [res_all_brief, userFavorites, session] = await Promise.all([ const [res_all_brief, userFavorites, session] = await Promise.all([
fetch(`${apiBase}/items/all_brief`).then(r => r.json()), fetch(`${apiBase}/items/all_brief`).then(r => r.json()),
getUserFavorites(fetch, locals), getUserFavorites(fetch, locals, params.recipeLang),
locals.auth() locals.auth()
]); ]);

View File

@@ -50,7 +50,7 @@ export const actions: Actions = {
try { try {
// Use the existing API endpoint // Use the existing API endpoint
const method = isFavorite ? 'DELETE' : 'POST'; const method = isFavorite ? 'DELETE' : 'POST';
const response = await fetch('/api/rezepte/favorites', { const response = await fetch(`/api/${url.pathname.split('/')[1]}/favorites`, {
method, method,
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',

View File

@@ -77,7 +77,7 @@ export const load: PageLoad = async ({ fetch, params, url, data }) => {
// Check if this recipe is favorited by the user // Check if this recipe is favorited by the user
let isFavorite = false; let isFavorite = false;
try { try {
const favRes = await fetch(`/api/rezepte/favorites/check/${params.name}`); const favRes = await fetch(`/api/${params.recipeLang}/favorites/check/${params.name}`);
if (favRes.ok) { if (favRes.ok) {
const favData = await favRes.json(); const favData = await favRes.json();
isFavorite = favData.isFavorite; isFavorite = favData.isFavorite;

View File

@@ -7,7 +7,7 @@ export const load: PageServerLoad = async ({ fetch, locals, params }) => {
const [res, allRes, userFavorites, session] = await Promise.all([ const [res, allRes, userFavorites, session] = await Promise.all([
fetch(`${apiBase}/items/category/${params.category}`), fetch(`${apiBase}/items/category/${params.category}`),
fetch(`${apiBase}/items/all_brief`), fetch(`${apiBase}/items/all_brief`),
getUserFavorites(fetch, locals), getUserFavorites(fetch, locals, params.recipeLang),
locals.auth() locals.auth()
]); ]);

View File

@@ -3,7 +3,7 @@ import { browser } from '$app/environment';
import { isOffline, canUseOfflineData } from '$lib/offline/helpers'; import { isOffline, canUseOfflineData } from '$lib/offline/helpers';
import { getAllIcons, isOfflineDataAvailable } from '$lib/offline/db'; import { getAllIcons, isOfflineDataAvailable } from '$lib/offline/db';
export const load: PageLoad = async ({ fetch }) => { export const load: PageLoad = async ({ fetch, params }) => {
// Check if we should use offline data // Check if we should use offline data
if (browser && isOffline() && canUseOfflineData()) { if (browser && isOffline() && canUseOfflineData()) {
try { try {
@@ -19,7 +19,7 @@ export const load: PageLoad = async ({ fetch }) => {
// Online mode - fetch from API // Online mode - fetch from API
try { try {
const res_icons = await fetch(`/api/rezepte/items/icon`); const res_icons = await fetch(`/api/${params.recipeLang}/items/icon`);
const icons = await res_icons.json(); const icons = await res_icons.json();
return { icons, isOffline: false }; return { icons, isOffline: false };
} catch (error) { } catch (error) {

View File

@@ -6,8 +6,8 @@ export const load: PageServerLoad = async ({ fetch, locals, params }) => {
const [item_season, icons, userFavorites, session] = await Promise.all([ const [item_season, icons, userFavorites, session] = await Promise.all([
fetch(`${apiBase}/items/icon/` + params.icon).then(r => r.json()), fetch(`${apiBase}/items/icon/` + params.icon).then(r => r.json()),
fetch(`/api/rezepte/items/icon`).then(r => r.json()), fetch(`${apiBase}/items/icon`).then(r => r.json()),
getUserFavorites(fetch, locals), getUserFavorites(fetch, locals, params.recipeLang),
locals.auth() locals.auth()
]); ]);

View File

@@ -48,7 +48,7 @@ export const load: PageServerLoad = async ({ url, fetch, params, locals }) => {
const [searchResponse, allRecipesResponse, userFavorites] = await Promise.all([ const [searchResponse, allRecipesResponse, userFavorites] = await Promise.all([
fetch(apiUrl.toString()), fetch(apiUrl.toString()),
fetch(`${apiBase}/items/all_brief`), fetch(`${apiBase}/items/all_brief`),
getUserFavorites(fetch, locals) getUserFavorites(fetch, locals, params.recipeLang)
]); ]);
const results = await searchResponse.json(); const results = await searchResponse.json();

View File

@@ -10,7 +10,7 @@ export const load: PageServerLoad = async ({ fetch, locals, params }) => {
// Get user favorites and session // Get user favorites and session
const [userFavorites, session] = await Promise.all([ const [userFavorites, session] = await Promise.all([
getUserFavorites(fetch, locals), getUserFavorites(fetch, locals, params.recipeLang),
locals.auth() locals.auth()
]); ]);

View File

@@ -9,7 +9,7 @@ export const load: PageServerLoad = async ({ fetch, locals, params }) => {
// Get user favorites and session // Get user favorites and session
const [userFavorites, session] = await Promise.all([ const [userFavorites, session] = await Promise.all([
getUserFavorites(fetch, locals), getUserFavorites(fetch, locals, params.recipeLang),
locals.auth() locals.auth()
]); ]);

View File

@@ -7,7 +7,7 @@ export const load: PageServerLoad = async ({ fetch, locals, params }) => {
const [res_tag, allRes, userFavorites, session] = await Promise.all([ const [res_tag, allRes, userFavorites, session] = await Promise.all([
fetch(`${apiBase}/items/tag/${params.tag}`), fetch(`${apiBase}/items/tag/${params.tag}`),
fetch(`${apiBase}/items/all_brief`), fetch(`${apiBase}/items/all_brief`),
getUserFavorites(fetch, locals), getUserFavorites(fetch, locals, params.recipeLang),
locals.auth() locals.auth()
]); ]);