From a58e52c891c2f1afb3d5f6408656ff3dbe9c1ada Mon Sep 17 00:00:00 2001 From: Alexander Bocken Date: Fri, 30 Jan 2026 12:30:29 +0100 Subject: [PATCH] feat: add server persistence for rosary streak - Add RosaryStreak MongoDB model for logged-in users - Add /api/glaube/rosary-streak GET/POST endpoints - Sync streak to server when logged in, merge local/server data - Auto-sync when coming back online (PWA offline support) - Falls back to localStorage for guests --- src/lib/components/StreakCounter.svelte | 13 +++ src/lib/stores/rosaryStreak.svelte.ts | 110 +++++++++++++++++- src/models/RosaryStreak.ts | 12 ++ .../api/glaube/rosary-streak/+server.ts | 61 ++++++++++ src/routes/glaube/rosenkranz/+page.svelte | 2 +- 5 files changed, 195 insertions(+), 3 deletions(-) create mode 100644 src/models/RosaryStreak.ts create mode 100644 src/routes/api/glaube/rosary-streak/+server.ts diff --git a/src/lib/components/StreakCounter.svelte b/src/lib/components/StreakCounter.svelte index e0254bf..c3301ec 100644 --- a/src/lib/components/StreakCounter.svelte +++ b/src/lib/components/StreakCounter.svelte @@ -2,7 +2,20 @@ import { browser } from '$app/environment'; import { getRosaryStreak } from '$lib/stores/rosaryStreak.svelte'; +interface Props { + user?: { nickname?: string } | null; +} + +let { user = null }: Props = $props(); + const streak = browser ? getRosaryStreak() : null; + +// Sync with server when user is logged in +$effect(() => { + if (browser && streak) { + streak.setLoggedIn(!!user?.nickname); + } +});
diff --git a/src/lib/stores/rosaryStreak.svelte.ts b/src/lib/stores/rosaryStreak.svelte.ts index 8007911..3754a40 100644 --- a/src/lib/stores/rosaryStreak.svelte.ts +++ b/src/lib/stores/rosaryStreak.svelte.ts @@ -36,14 +36,59 @@ function saveToStorage(data: StreakData): void { localStorage.setItem(STORAGE_KEY, JSON.stringify(data)); } +async function fetchFromServer(): Promise { + try { + const res = await fetch('/api/glaube/rosary-streak'); + if (res.ok) { + return await res.json(); + } + } catch { + // Server unavailable, return null + } + return null; +} + +async function saveToServer(data: StreakData): Promise { + try { + const res = await fetch('/api/glaube/rosary-streak', { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify(data) + }); + return res.ok; + } catch { + return false; + } +} + +// Merge local and server data, preferring the more recent/higher streak +function mergeStreakData(local: StreakData, server: StreakData | null): StreakData { + if (!server) return local; + + // If same lastPrayed date, take the higher length + if (local.lastPrayed === server.lastPrayed) { + return local.length >= server.length ? local : server; + } + + // Otherwise take whichever was prayed more recently + if (!local.lastPrayed) return server; + if (!server.lastPrayed) return local; + + return local.lastPrayed > server.lastPrayed ? local : server; +} + class RosaryStreakStore { #length = $state(0); #lastPrayed = $state(null); + #isLoggedIn = $state(false); #initialized = false; + #syncing = $state(false); + #pendingSync = false; // Track if we have unsynced changes constructor() { if (browser) { this.#init(); + this.#setupOnlineListener(); } } @@ -55,6 +100,14 @@ class RosaryStreakStore { this.#initialized = true; } + #setupOnlineListener() { + window.addEventListener('online', () => { + if (this.#isLoggedIn && this.#pendingSync) { + this.#syncWithServer(); + } + }); + } + get length() { return this.#length; } @@ -67,7 +120,52 @@ class RosaryStreakStore { return this.#lastPrayed === getToday(); } - recordPrayer(): void { + get isLoggedIn() { + return this.#isLoggedIn; + } + + get syncing() { + return this.#syncing; + } + + // Call this when user session is available + async setLoggedIn(loggedIn: boolean): Promise { + this.#isLoggedIn = loggedIn; + + if (loggedIn && browser) { + await this.#syncWithServer(); + } + } + + async #syncWithServer(): Promise { + if (this.#syncing) return; + this.#syncing = true; + + try { + const serverData = await fetchFromServer(); + const localData: StreakData = { length: this.#length, lastPrayed: this.#lastPrayed }; + const merged = mergeStreakData(localData, serverData); + + // Update local state + this.#length = merged.length; + this.#lastPrayed = merged.lastPrayed; + saveToStorage(merged); + + // If local had newer data, push to server + if (!serverData || merged.length !== serverData.length || merged.lastPrayed !== serverData.lastPrayed) { + const success = await saveToServer(merged); + this.#pendingSync = !success; + } else { + this.#pendingSync = false; + } + } catch { + this.#pendingSync = true; + } finally { + this.#syncing = false; + } + } + + async recordPrayer(): Promise { const today = getToday(); // Already prayed today - no change @@ -87,7 +185,15 @@ class RosaryStreakStore { this.#length = newLength; this.#lastPrayed = today; - saveToStorage({ length: newLength, lastPrayed: today }); + + const data: StreakData = { length: newLength, lastPrayed: today }; + saveToStorage(data); + + // Sync to server if logged in + if (this.#isLoggedIn) { + const success = await saveToServer(data); + this.#pendingSync = !success; + } } } diff --git a/src/models/RosaryStreak.ts b/src/models/RosaryStreak.ts new file mode 100644 index 0000000..672bb18 --- /dev/null +++ b/src/models/RosaryStreak.ts @@ -0,0 +1,12 @@ +import mongoose from 'mongoose'; + +const RosaryStreakSchema = new mongoose.Schema( + { + username: { type: String, required: true, unique: true }, + length: { type: Number, required: true, default: 0 }, + lastPrayed: { type: String, default: null } // ISO date string (YYYY-MM-DD) + }, + { timestamps: true } +); + +export const RosaryStreak = mongoose.models.RosaryStreak || mongoose.model("RosaryStreak", RosaryStreakSchema); diff --git a/src/routes/api/glaube/rosary-streak/+server.ts b/src/routes/api/glaube/rosary-streak/+server.ts new file mode 100644 index 0000000..298e7c6 --- /dev/null +++ b/src/routes/api/glaube/rosary-streak/+server.ts @@ -0,0 +1,61 @@ +import { json, error, type RequestHandler } from '@sveltejs/kit'; +import { RosaryStreak } from '../../../../models/RosaryStreak'; +import { dbConnect } from '../../../../utils/db'; + +export const GET: RequestHandler = async ({ locals }) => { + const session = await locals.auth(); + + if (!session?.user?.nickname) { + throw error(401, 'Authentication required'); + } + + await dbConnect(); + + try { + const streak = await RosaryStreak.findOne({ + username: session.user.nickname + }).lean(); + + return json({ + length: streak?.length ?? 0, + lastPrayed: streak?.lastPrayed ?? null + }); + } catch (e) { + throw error(500, 'Failed to fetch rosary streak'); + } +}; + +export const POST: RequestHandler = async ({ request, locals }) => { + const session = await locals.auth(); + + if (!session?.user?.nickname) { + throw error(401, 'Authentication required'); + } + + const { length, lastPrayed } = await request.json(); + + if (typeof length !== 'number' || length < 0) { + throw error(400, 'Valid streak length required'); + } + + if (lastPrayed !== null && typeof lastPrayed !== 'string') { + throw error(400, 'Invalid lastPrayed format'); + } + + await dbConnect(); + + try { + const updated = await RosaryStreak.findOneAndUpdate( + { username: session.user.nickname }, + { length, lastPrayed }, + { upsert: true, new: true } + ).lean(); + + return json({ + length: updated.length, + lastPrayed: updated.lastPrayed + }); + } catch (e) { + throw error(500, 'Failed to update rosary streak'); + } +}; diff --git a/src/routes/glaube/rosenkranz/+page.svelte b/src/routes/glaube/rosenkranz/+page.svelte index f2fa33d..4f9e1b3 100644 --- a/src/routes/glaube/rosenkranz/+page.svelte +++ b/src/routes/glaube/rosenkranz/+page.svelte @@ -1238,7 +1238,7 @@ l536 389l-209 -629zM1671 934l-370 267l150 436l-378 -271l-371 271q8 -34 15 -68q10
- +