add route matcher to fix /login and /logout routes
Some checks failed
CI / update (push) Failing after 2m52s
Some checks failed
CI / update (push) Failing after 2m52s
Use SvelteKit param matcher to constrain [recipeLang] to only match 'recipes' or 'rezepte', preventing it from catching /login, /logout, and other non-recipe routes.
This commit is contained in:
27
src/routes/[recipeLang=recipeLang]/category/+page.svelte
Normal file
27
src/routes/[recipeLang=recipeLang]/category/+page.svelte
Normal file
@@ -0,0 +1,27 @@
|
||||
<script lang="ts">
|
||||
import type { PageData } from './$types';
|
||||
import "$lib/css/nordtheme.css";
|
||||
let { data }: { data: PageData } = $props();
|
||||
import TagCloud from '$lib/components/TagCloud.svelte';
|
||||
import TagBall from '$lib/components/TagBall.svelte';
|
||||
|
||||
const isEnglish = $derived(data.lang === 'en');
|
||||
const labels = $derived({
|
||||
title: isEnglish ? 'Categories' : 'Kategorien'
|
||||
});
|
||||
</script>
|
||||
<style>
|
||||
h1 {
|
||||
text-align: center;
|
||||
font-size: 3rem;
|
||||
}
|
||||
</style>
|
||||
<h1>{labels.title}</h1>
|
||||
<section>
|
||||
<TagCloud>
|
||||
{#each data.categories as tag}
|
||||
<TagBall {tag} ref="/{data.recipeLang}/category">
|
||||
</TagBall>
|
||||
{/each}
|
||||
</TagCloud>
|
||||
</section>
|
||||
10
src/routes/[recipeLang=recipeLang]/category/+page.ts
Normal file
10
src/routes/[recipeLang=recipeLang]/category/+page.ts
Normal file
@@ -0,0 +1,10 @@
|
||||
import type { PageLoad } from "./$types";
|
||||
|
||||
export async function load({ fetch, params}) {
|
||||
const isEnglish = params.recipeLang === 'recipes';
|
||||
const apiBase = isEnglish ? '/api/recipes' : '/api/rezepte';
|
||||
|
||||
const res = await fetch(`${apiBase}/items/category`);
|
||||
const categories= await res.json();
|
||||
return {categories}
|
||||
};
|
||||
@@ -0,0 +1,22 @@
|
||||
import type { PageServerLoad } from "./$types";
|
||||
import { getUserFavorites, addFavoriteStatusToRecipes } from "$lib/server/favorites";
|
||||
|
||||
export const load: PageServerLoad = async ({ fetch, locals, params }) => {
|
||||
const isEnglish = params.recipeLang === 'recipes';
|
||||
const apiBase = isEnglish ? '/api/recipes' : '/api/rezepte';
|
||||
|
||||
const res = await fetch(`${apiBase}/items/category/${params.category}`);
|
||||
const items = await res.json();
|
||||
|
||||
// Get user favorites and session
|
||||
const [userFavorites, session] = await Promise.all([
|
||||
getUserFavorites(fetch, locals),
|
||||
locals.auth()
|
||||
]);
|
||||
|
||||
return {
|
||||
category: params.category,
|
||||
recipes: addFavoriteStatusToRecipes(items, userFavorites),
|
||||
session
|
||||
};
|
||||
};
|
||||
@@ -0,0 +1,27 @@
|
||||
<script lang="ts">
|
||||
import type { PageData } from './$types';
|
||||
import Recipes from '$lib/components/Recipes.svelte';
|
||||
import Search from '$lib/components/Search.svelte';
|
||||
let { data }: { data: PageData } = $props();
|
||||
let current_month = new Date().getMonth() + 1;
|
||||
import Card from '$lib/components/Card.svelte'
|
||||
import { rand_array } from '$lib/js/randomize';
|
||||
|
||||
const isEnglish = $derived(data.lang === 'en');
|
||||
const label = $derived(isEnglish ? 'Recipes in Category' : 'Rezepte in Kategorie');
|
||||
</script>
|
||||
<style>
|
||||
h1 {
|
||||
text-align: center;
|
||||
font-size: 3em;
|
||||
}
|
||||
</style>
|
||||
<h1>{label} <q>{data.category}</q>:</h1>
|
||||
<Search category={data.category} lang={data.lang}></Search>
|
||||
<section>
|
||||
<Recipes>
|
||||
{#each rand_array(data.recipes) as recipe}
|
||||
<Card {recipe} {current_month} isFavorite={recipe.isFavorite} showFavoriteIndicator={!!data.session?.user} routePrefix="/{data.recipeLang}"></Card>
|
||||
{/each}
|
||||
</Recipes>
|
||||
</section>
|
||||
Reference in New Issue
Block a user