login now works and files are protected

frontend/src/routes/+page.svelte

@@ -2,59 +2,57 @@
 
 <script lang="ts">
   import { API_BASE } from '$lib/config';
+  import { goto } from '$app/navigation';
 
-  let user : any = '';
-  let password : any = '';
-  let loading : any = false;
-  let error : any = '';
+  let error = "";
+
+  let Credentials = {
+    username: "",
+    password: "",
+  }
 
   async function handleLogin() {
-    let error : any = '';
-    let loading : Boolean = true;
-
     try {
-      const res = await fetch(`${API_BASE}/api/shadowrun/characters`, {
+      const res = await fetch(`${API_BASE}/login`, {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ 
-          username: user,
-          password: password,
-          })
+        credentials: 'include', 
+        body: JSON.stringify( 
+          Credentials )
         });
-
-        if (res.ok) {
-          characters = await res.json();
+        
+        if (!res.ok) {
+          error = await res.text(); 
+          return;
         }
-
-      alert('Logged in!');
+        goto("/shadowrun")
     } catch (e) {
       error = e.message;
-    } finally {
-      loading = false;
-    }
+    } 
   }
 </script>
 
-<form class="login" on:submit|preventDefault={handleLogin}>
+<form class="login">
   <h2>Login</h2>
 
   <label>
     User
-    <input type="text" bind:value={user} required />
+    <input type="text" bind:value={Credentials.username} required />
   </label>
 
   <label>
     Password
-    <input type="password" bind:value={password} required />
+    <input type="password" bind:value={Credentials.password} required />
   </label>
 
+  <button on:click={handleLogin}>
+    Login
+  </button>
+
   {#if error}
     <p class="error">{error}</p>
   {/if}
 
-  <button disabled={loading}>
-    {loading ? 'Logging in…' : 'Login'}
-  </button>
 </form>