data export

frontend/src/routes/settings/+page.svelte

@@ -3,7 +3,7 @@
 	import { goto, invalidateAll } from '$app/navigation';
 	import { page } from '$app/stores';
 	import { addToast } from '$lib/toasts';
-	import type { User } from '$lib/types.js';
+	import type { Adventure, Collection, User } from '$lib/types.js';
 	import { onMount } from 'svelte';
 	import { browser } from '$app/environment';
 
@@ -33,6 +33,33 @@
 			addToast('error', 'Error updating settings');
 		}
 	}
+
+	async function exportAdventures() {
+		let res = await fetch('/api/adventures/all');
+		let adventures = (await res.json()) as Adventure[];
+
+		res = await fetch('/api/collections/all');
+		let collections = (await res.json()) as Collection[];
+
+		res = await fetch('/api/visitedregion');
+		let visitedRegions = await res.json();
+
+		const data = {
+			adventures,
+			collections,
+			visitedRegions
+		};
+
+		const blob = new Blob([JSON.stringify(data)], { type: 'application/json' });
+
+		const url = URL.createObjectURL(blob);
+
+		const a = document.createElement('a');
+		a.href = url;
+		a.download = 'adventure-log-export.json';
+		a.click();
+		URL.revokeObjectURL(url);
+	}
 </script>
 
 <h1 class="text-center font-extrabold text-4xl mb-6">Settings Page</h1>
@@ -141,6 +168,11 @@
 		<button class="py-2 px-4 btn btn-primary mt-2">Change Email</button>
 	</form>
 </div>
+<div class="flex flex-col items-center">
+	<h1 class="text-center font-extrabold text-xl mt-4 mb-2">Data Export</h1>
+	<button class="btn btn-neutral mb-4" on:click={exportAdventures}> Export to JSON </button>
+	<p>This may take a few seconds...</p>
+</div>
 
 <small class="text-center"
 	><b>For Debug Use:</b> Server PK={user.pk} | Date Joined: {user.date_joined