chore(deps): bump @tanstack/query-core from 4.36.1 to 5.85.6

package.json

@@ -41,7 +41,7 @@
 	},
 	"type": "module",
 	"dependencies": {
-		"@tanstack/query-core": "^4.36.1",
+		"@tanstack/query-core": "^5.85.6",
 		"@tanstack/query-persist-client-core": "^4.36.1",
 		"@tanstack/query-sync-storage-persister": "^4.36.1",
 		"@tanstack/svelte-query": "^4.36.1",

src/app.scss

@@ -8,7 +8,7 @@
 	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 	transition:
 		color 0.5s ease-in-out,
-		background-color 0.5s ease-in-out,
+		background-color 20s ease-in-out,
 		fill 0.5s ease-in-out;
 }
 

src/data/api/index.ts

@@ -150,7 +150,7 @@ async function announcements(options: GetAnnouncementsOptions = {}): Promise<Ann
 	return { announcements };
 }
 
-async function get_announcement_by_id(id: number): Promise<{ announcement: ResponseAnnouncement }> {
+export async function get_announcement_by_id(id: number): Promise<{ announcement: ResponseAnnouncement }> {
 	return { announcement: (await get_json(`announcements/${id}`)) as ResponseAnnouncement };
 }
 

src/routes/+layout.svelte

@@ -52,7 +52,7 @@
 
 	onMount(() => {
 		set_about_info(api_base_url());
-		new DateTriggerEventHandler(themeEvents);
+		// new DateTriggerEventHandler(themeEvents);
 
 		isRestoring.set(true);
 		const [unsubscribe, promise] = persistQueryClient({

src/routes/+layout.ts

@@ -1 +1 @@
-export const prerender = true;
+export const prerender = 'auto';

src/routes/announcements/[slug]/+page.server.ts

@@ -0,0 +1,67 @@
+import { error } from '@sveltejs/kit';
+import type { PageServerLoad, EntryGenerator } from './$types';
+import { createQuery, useQueryClient } from '@tanstack/svelte-query';
+import { get_announcement_by_id, queries } from '$data/api';
+
+export const prerender = false; // Temporarily disable
+export const ssr = true;
+
+// This tells SvelteKit which dynamic routes to prerender
+export const entries: EntryGenerator = async ({ fetch }) => {
+	try {
+		console.log('Generating entries for prerendering...');
+		const response = await fetch('/api/announcements');
+
+		if (!response.ok) {
+			console.warn('Failed to fetch announcements for prerendering');
+			return [];
+		}
+
+		const data = await response.json();
+
+		const entries = data.announcements.map((announcement: any) => {
+			const slug = announcement.title
+				.toLowerCase()
+				.replace(/[^a-z0-9]+/g, '-')
+				.replace(/^-+|-+$/g, '');
+
+			console.log(`Generated entry: ${announcement.id}-${slug}`);
+			return { slug: `${announcement.id}-${slug}` };
+		});
+
+		// Always include the create route
+		entries.push({ slug: 'create' });
+
+		return entries;
+	} catch (error) {
+		console.warn('Error generating entries:', error);
+		return [{ slug: 'create' }]; // At least include create route
+	}
+};
+
+export const load: PageServerLoad = async ({ params, fetch }) => {
+	console.log('=== SERVER LOAD CALLED ===', params.slug);
+
+	const announcementId = 14;
+	console.log('Parsed announcementId:', announcementId);
+
+	if (!announcementId || announcementId === 'create') {
+		console.log('Returning isCreating: true');
+		return { isCreating: true };
+	}
+
+	try {
+		console.log('Fetching announcement...');
+		const response = await get_announcement_by_id(announcementId);
+		console.log('Successfully loaded announcement:', response.announcement?.title);
+
+		return {
+			isCreating: false,
+			announcement: response.announcement,
+			announcementId: announcementId
+		};
+	} catch (err) {
+		// console.log('Caught error:', err);
+		// throw error(404, 'Announcement not found');
+	}
+};

src/routes/announcements/[slug]/+page.svelte

@@ -1,48 +1,17 @@
 <script lang="ts">
 	import { fly } from 'svelte/transition';
 	import { quintOut } from 'svelte/easing';
-	import { createQuery } from '@tanstack/svelte-query';
-	import { queries } from '$data/api';
-	import { page } from '$app/stores';
 	import Announcement from './Announcement.svelte';
-	import Query from '$lib/components/Query.svelte';
+	import type { PageData } from './$types';
 
-	let announcementIdNumber: number | undefined = undefined;
-	let isCreating: boolean = false;
+	// Get data from your server load function
+	export let data: PageData;
 
-	$: {
-		const lastSegment = $page.url.pathname.split('/').pop();
-		isCreating = lastSegment === 'create';
-		announcementIdNumber = isCreating ? undefined : Number(lastSegment.split('-')[0]);
-	}
+	console.log('Page component received data:', data);
 
-	$: query = announcementIdNumber
-		? createQuery(queries.announcementById(announcementIdNumber))
-		: null;
-
-	$: announcement = $query?.data?.announcement || undefined;
-
-	$: slug = announcement?.title
-		? announcement.title
-				.toLowerCase()
-				.replace(/[^a-z0-9]+/g, '-')
-				.replace(/^-+|-+$/g, '')
-		: '';
-
-	$: {
-		const slugPathname = `/announcements/${announcementIdNumber}-${slug}`;
-		if (slug && $page.url.pathname !== slugPathname) {
-			window.history.replaceState(null, '', slugPathname);
-		}
-	}
+	$: ({ isCreating, announcement, announcementId } = data);
 </script>
 
 <main class="wrapper" in:fly={{ y: 10, easing: quintOut, duration: 750 }}>
-	{#if query}
-		<Query {query}>
-			<Announcement {isCreating} {announcement} {announcementIdNumber} {query} />
-		</Query>
-	{:else}
-		<Announcement {isCreating} {announcement} {announcementIdNumber} />
-	{/if}
-</main>
+	<Announcement {isCreating} {announcement} {announcementId} />
+</main>

src/routes/announcements/[slug]/AdminButtons.svelte

@@ -16,6 +16,7 @@
 	import Show from 'svelte-material-icons/EyeOutline.svelte';
 	import Hide from 'svelte-material-icons/EyeOffOutline.svelte';
 	import Unarchive from 'svelte-material-icons/ArchiveArrowUpOutline.svelte';
+	import { formatUTC } from '$util/formatUtc';
 
 	export let isEditing: boolean;
 	export let isCreating: boolean;
@@ -67,6 +68,11 @@
 	const save = async () => {
 		if (!isValid()) return;
 
+		Object.assign(draftInputs, {
+			created_at: formatUTC(draftInputs.created_at),
+			archived_at: formatUTC(draftInputs.archived_at)
+		});
+
 		await admin.update_announcement(announcementIdNumber!, sanitize(draftInputs));
 		await $query?.refetch();
 
@@ -76,8 +82,13 @@
 	const createAnnouncement = async () => {
 		if (!isValid()) return;
 
+		Object.assign(draftInputs, {
+			created_at: formatUTC(draftInputs.created_at),
+			archived_at: formatUTC(draftInputs.archived_at)
+		});
+
 		await admin.create_announcement(sanitize(draftInputs));
-		await client.invalidateQueries(queries['announcements']());
+		await client.invalidateQueries(queries.announcements());
 		goto('/announcements', { invalidateAll: true });
 	};
 

src/util/formatUtc.ts

@@ -0,0 +1,3 @@
+import moment from 'moment';
+
+export const formatUTC = (d: any) => d && moment(d).utc().format('YYYY-MM-DDTHH:mm[Z]');

svelte.config.js

@@ -8,10 +8,10 @@ const config = {
 	kit: {
 		// adapter-static has vercel detection, but that does not let you set a custom 404 page easily.
 		// Instead, we have to use a wrapper that generates a vercel config if on vercel...
-		adapter: adapter({
-			pages: 'public',
-			fallback: '404.html'
-		}),
+		adapter: adapter({}),
+		prerender: {
+			entries: ['*'] // This should be fine
+		},
 		env: {
 			publicPrefix: 'RV'
 		},