feat(wishlist): per-user Wünsche + Header-Badge mit Gesamtzahl
All checks were successful
Build & Publish Docker Image / build-and-push (push) Successful in 1m16s
All checks were successful
Build & Publish Docker Image / build-and-push (push) Successful in 1m16s
Schema-Änderung (Migration 005):
- Tabelle wishlist umgestellt auf PK (recipe_id, profile_id)
- wishlist_like-Tabelle zusammengelegt — Liken WAR schon "will ich auch",
also werden alle bestehenden Likes Memberships auf der neuen Tabelle.
- Alt-Einträge mit added_by_profile_id werden migriert, anonyme gehen
verloren (war inkonsistent, jetzt erzwingen wir profile_id NOT NULL).
Repository:
- listWishlist aggregiert pro Rezept: wanted_by_count, wanted_by_names
(kommagetrennt), on_my_wishlist für das aktive Profil
- listWishlistProfileIds(recipeId) für den Recipe-Page-Loader
- countWishlistRecipes für das Header-Badge (DISTINCT recipe_id)
- addToWishlist/removeFromWishlist/isOnMyWishlist alle mit profile_id
als Pflicht
API:
- POST /api/wishlist: profile_id jetzt Pflicht (nullable raus)
- DELETE /api/wishlist/[recipe_id]?profile_id=X (nur eigenes Entry)
- /api/wishlist/[recipe_id]/like komplett entfernt (Konzept obsolet)
- Neu: GET /api/wishlist/count → { count: <distinct recipes> }
UI:
- Header-Heart bekommt rotes Badge mit Zahl der Wunschliste-Rezepte.
wishlistStore in $lib/client/wishlist.svelte.ts hält den Count reaktiv;
Refresh auf Mount, nach Add/Remove, beim Öffnen der Wunschliste.
- Recipe-Detail: Loader liefert wishlist_profile_ids; onMyWishlist ist
ein $derived. Toggle fragt aktives Profil (alertAction sonst), mutiert
die lokale Liste + ruft wishlistStore.refresh.
- Wunschliste-Seite: Heart toggelt eigenen Wunsch, Count zeigt Gesamt-
wünsche, kommagetrennte Namen zeigen "wer will". Trash-Button
entfernt — Heart-off reicht jetzt.
Tests (99 → 99, 8 neu geschrieben):
- Per-User-Add/Remove, aggregierte Counts, on_my_wishlist, Cascades bei
Recipe/Profile-Delete, countWishlistRecipes = DISTINCT.
This commit is contained in:
@@ -8,6 +8,7 @@ import {
|
||||
listFavoriteProfiles,
|
||||
listRatings
|
||||
} from '$lib/server/recipes/actions';
|
||||
import { listWishlistProfileIds } from '$lib/server/wishlist/repository';
|
||||
|
||||
export const load: PageServerLoad = async ({ params }) => {
|
||||
const id = Number(params.id);
|
||||
@@ -19,7 +20,16 @@ export const load: PageServerLoad = async ({ params }) => {
|
||||
const comments = listComments(db, id);
|
||||
const cooking_log = listCookingLog(db, id);
|
||||
const favorite_profile_ids = listFavoriteProfiles(db, id);
|
||||
const wishlist_profile_ids = listWishlistProfileIds(db, id);
|
||||
const avg_stars =
|
||||
ratings.length === 0 ? null : ratings.reduce((s, r) => s + r.stars, 0) / ratings.length;
|
||||
return { recipe, ratings, comments, cooking_log, favorite_profile_ids, avg_stars };
|
||||
return {
|
||||
recipe,
|
||||
ratings,
|
||||
comments,
|
||||
cooking_log,
|
||||
favorite_profile_ids,
|
||||
wishlist_profile_ids,
|
||||
avg_stars
|
||||
};
|
||||
};
|
||||
|
||||
@@ -14,6 +14,7 @@
|
||||
import RecipeView from '$lib/components/RecipeView.svelte';
|
||||
import StarRating from '$lib/components/StarRating.svelte';
|
||||
import { profileStore } from '$lib/client/profile.svelte';
|
||||
import { wishlistStore } from '$lib/client/wishlist.svelte';
|
||||
import { confirmAction, alertAction } from '$lib/client/confirm.svelte';
|
||||
import type { CommentRow } from '$lib/server/recipes/actions';
|
||||
|
||||
@@ -24,7 +25,7 @@
|
||||
let comments = $state<CommentRow[]>([]);
|
||||
let cookingLog = $state<typeof data.cooking_log>([]);
|
||||
let favoriteProfileIds = $state<number[]>([]);
|
||||
let onWishlist = $state(false);
|
||||
let wishlistProfileIds = $state<number[]>([]);
|
||||
let newComment = $state('');
|
||||
|
||||
let title = $state('');
|
||||
@@ -37,6 +38,7 @@
|
||||
comments = [...data.comments];
|
||||
cookingLog = [...data.cooking_log];
|
||||
favoriteProfileIds = [...data.favorite_profile_ids];
|
||||
wishlistProfileIds = [...data.wishlist_profile_ids];
|
||||
title = data.recipe.title;
|
||||
});
|
||||
|
||||
@@ -50,6 +52,10 @@
|
||||
profileStore.active ? favoriteProfileIds.includes(profileStore.active.id) : false
|
||||
);
|
||||
|
||||
const onMyWishlist = $derived(
|
||||
profileStore.active ? wishlistProfileIds.includes(profileStore.active.id) : false
|
||||
);
|
||||
|
||||
async function setRating(stars: number) {
|
||||
if (!profileStore.active) {
|
||||
await alertAction({
|
||||
@@ -195,27 +201,28 @@
|
||||
}
|
||||
|
||||
async function toggleWishlist() {
|
||||
if (onWishlist) {
|
||||
await fetch(`/api/wishlist/${data.recipe.id}`, { method: 'DELETE' });
|
||||
onWishlist = false;
|
||||
if (!profileStore.active) {
|
||||
await alertAction({
|
||||
title: 'Kein Profil gewählt',
|
||||
message: 'Tippe oben rechts auf „Profil wählen", dann klappt die Aktion.'
|
||||
});
|
||||
return;
|
||||
}
|
||||
const profileId = profileStore.active.id;
|
||||
if (onMyWishlist) {
|
||||
await fetch(`/api/wishlist/${data.recipe.id}?profile_id=${profileId}`, {
|
||||
method: 'DELETE'
|
||||
});
|
||||
wishlistProfileIds = wishlistProfileIds.filter((id) => id !== profileId);
|
||||
} else {
|
||||
await fetch('/api/wishlist', {
|
||||
method: 'POST',
|
||||
headers: { 'content-type': 'application/json' },
|
||||
body: JSON.stringify({
|
||||
recipe_id: data.recipe.id,
|
||||
profile_id: profileStore.active?.id ?? null
|
||||
})
|
||||
body: JSON.stringify({ recipe_id: data.recipe.id, profile_id: profileId })
|
||||
});
|
||||
onWishlist = true;
|
||||
wishlistProfileIds = [...wishlistProfileIds, profileId];
|
||||
}
|
||||
}
|
||||
|
||||
async function refreshWishlistState() {
|
||||
const res = await fetch('/api/wishlist?sort=newest');
|
||||
if (!res.ok) return;
|
||||
const body = await res.json();
|
||||
onWishlist = body.entries.some((e: { recipe_id: number }) => e.recipe_id === data.recipe.id);
|
||||
void wishlistStore.refresh();
|
||||
}
|
||||
|
||||
// Wake-Lock
|
||||
@@ -232,7 +239,6 @@
|
||||
|
||||
onMount(() => {
|
||||
void requestWakeLock();
|
||||
void refreshWishlistState();
|
||||
const onVisibility = () => {
|
||||
if (document.visibilityState === 'visible' && !wakeLock) void requestWakeLock();
|
||||
};
|
||||
@@ -286,8 +292,8 @@
|
||||
<Heart size={18} strokeWidth={2} fill={isFav ? 'currentColor' : 'none'} />
|
||||
<span>Favorit</span>
|
||||
</button>
|
||||
<button class="btn" class:wish={onWishlist} onclick={toggleWishlist}>
|
||||
{#if onWishlist}
|
||||
<button class="btn" class:wish={onMyWishlist} onclick={toggleWishlist}>
|
||||
{#if onMyWishlist}
|
||||
<Check size={18} strokeWidth={2.5} />
|
||||
<span>Auf Wunschliste</span>
|
||||
{:else}
|
||||
|
||||
Reference in New Issue
Block a user