Renaming transition and adding to the auth layout.

src/lib/components/transition.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import { fade, fly } from 'svelte/transition';
+  import { fade } from 'svelte/transition';
 
   interface Transition {
     type: 'fade' | 'stagger' | 'page';

src/routes/(app)/+layout.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import 'iconify-icon';
-	import Transition from '$lib/components/transition/index.svelte';
+	import Transition from '$lib/components/transition.svelte';
 	import Header from '$lib/components/header/index.svelte';
 	import Footer from '$lib/components/footer.svelte';
 

src/routes/(auth)/+layout.server.ts

@@ -0,0 +1,9 @@
+import { loadFlash } from 'sveltekit-flash-message/server';
+import type { LayoutServerLoad } from './$types';
+
+export const load: LayoutServerLoad = loadFlash(async ({ url, locals }) => {
+	return {
+		url: url.pathname,
+		user: locals.user
+	};
+});

src/routes/(auth)/+layout.svelte

@@ -2,6 +2,9 @@
 	import { page } from "$app/stores";
 	import { Button } from "$lib/components/ui/button";
 	import Logo from "$lib/components/logo.svelte";
+	import Transition from '$lib/components/transition.svelte';
+
+	export let data;
 </script>
 
 <div class="container">
@@ -38,9 +41,10 @@
 			</blockquote>
 		</div>
 	</div>
-
 	<div class="auth-form">
-		<slot />
+		<Transition url={data.url} transition={{ type: 'page' }}>
+			<slot />
+		</Transition>
 	</div>
 </div>