chore: web cleanup (#16849)

web/src/routes/+error.svelte

@@ -1,6 +1,6 @@
 <script>
   import { page } from '$app/state';
-  import Error from '$lib/components/error.svelte';
+  import ErrorLayout from '$lib/components/layouts/ErrorLayout.svelte';
 </script>
 
-<Error error={page.error}></Error>
+<ErrorLayout error={page.error}></ErrorLayout>

web/src/routes/+layout.svelte

@@ -3,7 +3,7 @@
   import { page } from '$app/state';
   import { shortcut } from '$lib/actions/shortcut';
   import DownloadPanel from '$lib/components/asset-viewer/download-panel.svelte';
-  import Error from '$lib/components/error.svelte';
+  import ErrorLayout from '$lib/components/layouts/ErrorLayout.svelte';
   import AppleHeader from '$lib/components/shared-components/apple-header.svelte';
   import DialogWrapper from '$lib/components/shared-components/dialog/dialog-wrapper.svelte';
   import NavigationLoadingBar from '$lib/components/shared-components/navigation-loading-bar.svelte';
@@ -17,11 +17,11 @@
   import { closeWebsocketConnection, openWebsocketConnection } from '$lib/stores/websocket';
   import { copyToClipboard, setKey } from '$lib/utils';
   import { isAssetViewerRoute, isSharedLinkRoute } from '$lib/utils/navigation';
-  import { onDestroy, onMount, type Snippet } from 'svelte';
-  import { run } from 'svelte/legacy';
   import { setTranslations } from '@immich/ui';
-  import '../app.css';
+  import { onDestroy, onMount, type Snippet } from 'svelte';
   import { t } from 'svelte-i18n';
+  import { run } from 'svelte/legacy';
+  import '../app.css';
 
   interface Props {
     children?: Snippet;
@@ -141,7 +141,7 @@
 />
 
 {#if page.data.error}
-  <Error error={page.data.error}></Error>
+  <ErrorLayout error={page.data.error}></ErrorLayout>
 {:else}
   {@render children?.()}
 {/if}

web/src/routes/auth/change-password/+page.svelte

@@ -19,14 +19,12 @@
   const valid = $derived(password === passwordConfirm && passwordConfirm.length > 0);
   const errorMessage = $derived(passwordConfirm.length === 0 || valid ? '' : $t('password_does_not_match'));
 
-  const onSubmit = async (event: Event) => {
-    event.preventDefault();
-
+  const onSubmit = async () => {
     if (!valid) {
       return;
     }
 
-    await updateMyUser({ userUpdateMeDto: { password: String(password) } });
+    await updateMyUser({ userUpdateMeDto: { password } });
     await goto(AppRoute.AUTH_LOGIN);
     resetSavedUser();
     await logout();
@@ -34,7 +32,7 @@
 </script>
 
 <AuthPageLayout title={data.meta.title}>
-  <form onsubmit={onSubmit} method="post" class="flex flex-col gap-4">
+  <form onsubmit={onSubmit} class="flex flex-col gap-4">
     <Alert color="primary" size="small" class="mb-2">
       <Stack gap={4}>
         <Text>{$t('hi_user', { values: { name: $user.name, email: $user.email } })}</Text>

web/src/routes/auth/onboarding/+page.svelte

@@ -5,7 +5,7 @@
   import { page } from '$app/stores';
   import OnboardingHello from '$lib/components/onboarding-page/onboarding-hello.svelte';
   import OnboardingPrivacy from '$lib/components/onboarding-page/onboarding-privacy.svelte';
-  import OnboadingStorageTemplate from '$lib/components/onboarding-page/onboarding-storage-template.svelte';
+  import OnboardingStorageTemplate from '$lib/components/onboarding-page/onboarding-storage-template.svelte';
   import OnboardingTheme from '$lib/components/onboarding-page/onboarding-theme.svelte';
   import { AppRoute, QueryParameter } from '$lib/constants';
   import { retrieveServerConfig } from '$lib/stores/server-config.store';
@@ -18,7 +18,7 @@
     component:
       | typeof OnboardingHello
       | typeof OnboardingTheme
-      | typeof OnboadingStorageTemplate
+      | typeof OnboardingStorageTemplate
       | typeof OnboardingPrivacy;
   }
 
@@ -26,7 +26,7 @@
     { name: 'hello', component: OnboardingHello },
     { name: 'theme', component: OnboardingTheme },
     { name: 'privacy', component: OnboardingPrivacy },
-    { name: 'storage', component: OnboadingStorageTemplate },
+    { name: 'storage', component: OnboardingStorageTemplate },
   ];
 
   run(() => {

web/src/routes/link/+page.ts

@@ -2,14 +2,14 @@ import { AppRoute } from '$lib/constants';
 import { redirect } from '@sveltejs/kit';
 import type { PageLoad } from './$types';
 
-export const load = (({ url }) => {
-  enum LinkTarget {
-    HOME = 'home',
-    UNSUBSCRIBE = 'unsubscribe',
-    VIEW_ASSET = 'view_asset',
-    ACTIVATE_LICENSE = 'activate_license',
-  }
+enum LinkTarget {
+  HOME = 'home',
+  UNSUBSCRIBE = 'unsubscribe',
+  VIEW_ASSET = 'view_asset',
+  ACTIVATE_LICENSE = 'activate_license',
+}
 
+export const load = (({ url }) => {
   const queryParams = url.searchParams;
   const target = queryParams.get('target') as LinkTarget;
   switch (target) {