DISCORD AUTH!, but some endpoints are broken

src/Login.svelte

@@ -1,10 +1,12 @@
 <script>
     import { member, intros } from './store.ts';
 
-    const login = async (username) => {
-        await member._fakeLogin(username);
+    const authorizeUri = "https://discord.com/api/oauth2/authorize?client_id=577634620728934400&redirect_uri=http%3A%2F%2Flocalhost%3A5173%2Fauth&response_type=code&scope=identify%20guilds%20guilds.members.read";
 
-        await intros.fetchIntros($member.guilds);
+    const login = async (username) => {
+        window.location = authorizeUri;
+        //await member._fakeLogin(username);
+        //await intros.fetchIntros($member.guilds);
     }
 
     let loginPromise = null;
@@ -13,5 +15,4 @@
 </script>
 
 <p style="color:red;">You need to login first</p>
-<input bind:value={enteredUsername}>
 <button on:click={() => loginPromise = login(enteredUsername)}>Login</button>

src/routes/+page.svelte

@@ -8,8 +8,8 @@
     const apiAddIntro = async (guild, channel, username, selectedIntros) => {
         for (const intro of selectedIntros) {
             const response = await fetch(
-                `http://localhost:7756/intros/${guild}/${channel}/${$member.username}/${intro}`,
-                { method: 'POST' }
+                `http://localhost:7756/intros/${guild}/${channel}/${intro}`,
+                { method: 'POST', headers: {"token": $member.token} }
             );
             if (!response.ok) {
                 const body = await response.json();
@@ -23,8 +23,8 @@
     const apiRemoveIntro = async (guild, channel, username, selectedIntros) => {
         for (const intro of selectedIntros) {
             const response = await fetch(
-                `http://localhost:7756/intros/${guild}/${channel}/${$member.username}/${intro}/remove`,
-                { method: 'POST' }
+                `http://localhost:7756/intros/${guild}/${channel}/${intro}/remove`,
+                { method: 'POST', headers: {"token": $member.token} }
             );
             if (!response.ok) {
                 const body = await response.json();

src/routes/auth/+page.svelte

@@ -0,0 +1,28 @@
+<script>
+    import { onMount } from 'svelte';
+    import { page } from '$app/stores';
+    import { goto } from '$app/navigation';
+    import { member, intros } from '../../store.ts';
+
+    const code = $page.url.searchParams.get('code');
+
+    let loginFailed = false;
+
+    onMount(async () => {
+        const response = await fetch(`http://localhost:7756/auth?code=${code}`);
+        const body = await response.json();
+
+        if (!response.ok)  {
+            loginFailed = true
+        } else {
+            await member.login(body.token);
+            await intros.fetchIntros($member.guilds);
+
+            goto('/')            
+        }
+    });
+</script>
+
+{#if loginFailed}
+    <p style='color: red'>Login failed</p>
+{/if}

src/store.ts

@@ -20,17 +20,17 @@ function createMemberStore(): MemberStore {
         subscribe: subscribe,
         set: set,
         addIntro: (intro: IntroIndex) => { update((n) => n.intros.push(intro)); return intro },
-        _fakeLogin: async (username) => {
-            const response = (await (await fetch(`http://localhost:7756/me/${username}`)).json())
+        login: async (token) => {
+            const response = (await (await fetch(
+                'http://localhost:7756/me',
+                { headers: {"token": token} })).json())
 
             if (response === "NoUserFound") {
-                return false;
+                return;
             } else {
-                set(response.Me) 
-
-                return true;
+                set({ token: token, ...response.Me }) 
+            }
         }
-        },
     }
 }