Update the OAuth2 success and failure pages

1. Update design to be more consistent with other pages, while still
unbranded
2. Update sizing to be more mobile friendly as the original heading
size was truncated on mobile
3. Show a different message when redirecting back to the app to clarify
the login was successful
4. Close the window after redirecting so the user doesn't have to

Author: stnguyen90

src/routes/auth/oauth2/failure/+page.svelte

@@ -4,18 +4,36 @@
     import { Heading } from '$lib/components';
     import { onMount } from 'svelte';
 
-    onMount(async () => {
+    let redirecting = false;
+
+    onMount(() => {
         const project = $page.url.searchParams.get('project');
         if (project) {
-            await goto(`appwrite-callback-${project}://${$page.url.search}`);
+            redirecting = true;
+            setTimeout(async () => {
+                await goto(`appwrite-callback-${project}://${$page.url.search}`);
+                window.close();
+            }, 3000);
         }
     });
+
+    $: heading = redirecting ? 'Login failed' : 'Missing Redirect URL';
 </script>
 
-<Heading tag="h1" size="1">Missing Redirect URL</Heading>
-<p class="text">
-    Your OAuth login flow is missing a proper redirect URL. Please check the
-    <a class="link" href="https://appwrite.io/docs/client/account?sdk=web#createOAuth2Session"
-        >OAuth docs</a>
-    and send request for new session with a valid callback URL.
-</p>
+<article class="card u-padding-16">
+    <div class="u-flex u-flex-vertical u-gap-16">
+        <Heading tag="h1" size="4">{heading}</Heading>
+        <p class="text">
+            {#if redirecting}
+                You will be automatically redirected back to your app shortly.
+            {:else}
+                Your OAuth login flow is missing a proper redirect URL. Please check the
+                <a
+                    class="link"
+                    href="https://appwrite.io/docs/client/account?sdk=web#createOAuth2Session"
+                    >OAuth docs</a>
+                and send request for new session with a valid callback URL.
+            {/if}
+        </p>
+    </div>
+</article>

src/routes/auth/oauth2/success/+page.svelte

@@ -4,18 +4,36 @@
     import { Heading } from '$lib/components';
     import { onMount } from 'svelte';
 
-    onMount(async () => {
+    let redirecting = false;
+
+    onMount(() => {
         const project = $page.url.searchParams.get('project');
         if (project) {
-            await goto(`appwrite-callback-${project}://${$page.url.search}`);
+            redirecting = true;
+            setTimeout(async () => {
+                await goto(`appwrite-callback-${project}://${$page.url.search}`);
+                window.close();
+            }, 3000);
         }
     });
+
+    $: heading = redirecting ? "You're now logged in" : 'Missing Redirect URL';
 </script>
 
-<Heading tag="h1" size="1">Missing Redirect URL</Heading>
-<p class="text">
-    Your OAuth login flow is missing a proper redirect URL. Please check the
-    <a class="link" href="https://appwrite.io/docs/client/account?sdk=web#createOAuth2Session"
-        >OAuth docs</a>
-    and send request for new session with a valid callback URL.
-</p>
+<article class="card u-padding-16">
+    <div class="u-flex u-flex-vertical u-gap-16">
+        <Heading tag="h1" size="4">{heading}</Heading>
+        <p class="text">
+            {#if redirecting}
+                You will be automatically redirected back to your app shortly.
+            {:else}
+                Your OAuth login flow is missing a proper redirect URL. Please check the
+                <a
+                    class="link"
+                    href="https://appwrite.io/docs/client/account?sdk=web#createOAuth2Session"
+                    >OAuth docs</a>
+                and send request for new session with a valid callback URL.
+            {/if}
+        </p>
+    </div>
+</article>