noctbot/web/src/routes/login/discord_auth.svelte

<script lang="typescript">
	import Icon from "svelte-awesome/components/Icon.svelte";
	import { faSpinner } from "@fortawesome/free-solid-svg-icons";
    import { onMount } from "svelte";
    import { Option } from "@shared/common/async_utils";
    import { goto } from "@sapper/app";

    const spinner = faSpinner as unknown as undefined;
    let error = "";
    

    onMount(
        async () => {
            const res = await fetch("/login/discord", {
                method: "post"
            });
            const result = await res.json() as Option<unknown, {error: string}>;
            if (!result.ok) {
                result.error = error;
            } else {
                await goto("/");
            }
        }
    );
</script>

<div class="flex items-center justify-center bg-gray-900 h-screen w-screen">
	<div class="bg-gray-800 rounded-sm text-center px-20 py-5 shadow-lg">
        <h1 class="text-white text-4xl font-light">Logging in</h1>
        {#if !error}
            <div class="text-white"><Icon data={spinner} spin scale={1.5} /></div>
        {:else}
            <div>Oh nooo!</div>
        {/if}
	</div>
</div>