Make expected stamps reactive

src/routes/+layout.ts

@@ -3,7 +3,9 @@ export const csr = true;
 import type { LayoutLoad } from './$types';
 
 import { collectedStamps, expectedStamps } from '$lib/stores/stamps';
+import { setToast } from '$lib/stores/toasts';
 import { get } from 'svelte/store';
+import { TOAST_TYPE } from '../custom';
 import { supabase } from '../supabase-client';
 
 export const load = (async () => {
@@ -15,14 +17,19 @@ export const load = (async () => {
 async function startupTasks() {
 	console.log('Running startup tasks...');
 	get(collectedStamps);
-	await updateExpectedStamps();
+	try {
+		await updateExpectedStamps();
+	} catch (error) {
+		console.error('Error fetching stamp data:', error);
+		setToast({ message: 'Error fetching stamp data', type: TOAST_TYPE.ERROR });
+	}
+	setToast({ message: 'Updated stamp data', type: TOAST_TYPE.SUCCESS });
 }
 
 // Fetched expected stamp data from supabase and creates object in store
 // With hash as key and rest of stamp data as value
 async function updateExpectedStamps() {
 	console.log('Fetching stamp data...');
-	// TODO: Handle errors
 	const { data } = await supabase
 		.from('stamps')
 		.select('booth_id, name, description, image_url, external_url, hash, nsfw');

src/routes/+page.svelte

@@ -1,7 +1,11 @@
 <script lang="ts">
 	import StampSheet from '$lib/components/StampSheet.svelte';
+	import { expectedStamps } from '$lib/stores/stamps.js';
 
-	export let data;
+	$: stampsCollection = Object.entries($expectedStamps).map(([key, value]) => ({
+		...value,
+		hash: key
+	}));
 </script>
 
-<StampSheet stamps={data.stamps} />
+<StampSheet stamps={stampsCollection} />

src/routes/+page.ts

@@ -1,14 +1,7 @@
-import { expectedStamps } from '$lib/stores/stamps';
-import { get } from 'svelte/store';
 import type { PageLoad } from './$types';
 
 export const ssr = false;
 
 export const load = (async () => {
-	const stamps = Object.entries(get(expectedStamps)).map(([key, value]) => ({
-		...value,
-		hash: key
-	}));
-
-	return { stamps };
+	return {};
 }) satisfies PageLoad;