Migrate SvelteKit to the latest version 431 (#526)

web/src/routes/photos/+page.server.ts

@@ -0,0 +1,21 @@
+import { serverApi } from './../../api/api';
+import type { PageServerLoad } from './$types';
+import { redirect, error } from '@sveltejs/kit';
+
+export const load: PageServerLoad = async ({ parent }) => {
+	try {
+		const { user } = await parent();
+		if (!user) {
+			throw error(400, 'Not logged in');
+		}
+
+		const { data: assets } = await serverApi.assetApi.getAllAssets();
+
+		return {
+			user,
+			assets
+		};
+	} catch (e) {
+		throw redirect(302, '/auth/login');
+	}
+};

web/src/routes/photos/+page.svelte

@@ -1,60 +1,28 @@
-<script context="module" lang="ts">
-	export const prerender = false;
-
-	import type { Load } from '@sveltejs/kit';
-	import { setAssetInfo } from '$lib/stores/assets';
-
-	export const load: Load = async ({ fetch, session }) => {
-		if (!browser && !session.user) {
-			return {
-				status: 302,
-				redirect: '/auth/login'
-			};
-		}
-
-		try {
-			const [userInfo, assets] = await Promise.all([
-				fetch('/data/user/get-my-user-info').then((r) => r.json()),
-				fetch('/data/asset/get-all-assets').then((r) => r.json())
-			]);
-
-			setAssetInfo(assets);
-
-			return {
-				status: 200,
-				props: {
-					user: userInfo
-				}
-			};
-		} catch (e) {
-			console.log('ERROR load photos index');
-			return {
-				status: 302,
-				redirect: '/auth/login'
-			};
-		}
-	};
-</script>
-
 <script lang="ts">
 	import NavigationBar from '$lib/components/shared-components/navigation-bar.svelte';
 	import CheckCircle from 'svelte-material-icons/CheckCircle.svelte';
 	import { fly } from 'svelte/transition';
-	import { assetsGroupByDate, flattenAssetGroupByDate, assets } from '$lib/stores/assets';
+	import {
+		assetsGroupByDate,
+		flattenAssetGroupByDate,
+		assets,
+		setAssetInfo
+	} from '$lib/stores/assets';
 	import ImmichThumbnail from '$lib/components/shared-components/immich-thumbnail.svelte';
 	import moment from 'moment';
 	import AssetViewer from '$lib/components/asset-viewer/asset-viewer.svelte';
 	import { openFileUploadDialog, UploadType } from '$lib/utils/file-uploader';
-	import { api, AssetResponseDto, UserResponseDto } from '@api';
+	import { api, AssetResponseDto } from '@api';
 	import SideBar from '$lib/components/shared-components/side-bar/side-bar.svelte';
 	import CircleOutline from 'svelte-material-icons/CircleOutline.svelte';
 	import CircleIconButton from '$lib/components/shared-components/circle-icon-button.svelte';
 	import DeleteOutline from 'svelte-material-icons/DeleteOutline.svelte';
 	import Close from 'svelte-material-icons/Close.svelte';
-	import { browser } from '$app/env';
 	import ControlAppBar from '$lib/components/shared-components/control-app-bar.svelte';
+	import type { PageData } from './$types';
+	import { onMount } from 'svelte';
 
-	export let user: UserResponseDto;
+	export let data: PageData;
 
 	let selectedGroupThumbnail: number | null;
 	let isMouseOverGroup: boolean;
@@ -73,6 +41,10 @@
 	let currentViewAssetIndex = 0;
 	let selectedAsset: AssetResponseDto;
 
+	onMount(() => {
+		setAssetInfo(data.assets);
+	});
+
 	const thumbnailMouseEventHandler = (event: CustomEvent) => {
 		const { selectedGroupIndex }: { selectedGroupIndex: number } = event.detail;
 
@@ -234,7 +206,10 @@
 	{/if}
 
 	{#if !isMultiSelectionMode}
-		<NavigationBar {user} on:uploadClicked={() => openFileUploadDialog(UploadType.GENERAL)} />
+		<NavigationBar
+			user={data.user}
+			on:uploadClicked={() => openFileUploadDialog(UploadType.GENERAL)}
+		/>
 	{/if}
 </section>
 

web/src/routes/photos/[assetId].svelte

@@ -1,20 +0,0 @@
-<script context="module" lang="ts">
-	export const prerender = false;
-
-	import { browser } from '$app/env';
-	import type { Load } from '@sveltejs/kit';
-
-	export const load: Load = async ({ session }) => {
-		if (!browser && !session.user) {
-			return {
-				status: 302,
-				redirect: '/auth/login'
-			};
-		} else {
-			return {
-				status: 302,
-				redirect: '/photos'
-			};
-		}
-	};
-</script>

web/src/routes/photos/[assetId]/+page.server.ts

@@ -0,0 +1,14 @@
+import { redirect } from '@sveltejs/kit';
+export const prerender = false;
+
+import type { PageServerLoad } from './$types';
+
+export const load: PageServerLoad = async ({ parent }) => {
+	const { user } = await parent();
+
+	if (!user) {
+		throw redirect(302, '/auth/login');
+	} else {
+		throw redirect(302, '/photos');
+	}
+};