added auth login and register

.gitignore

@@ -21,3 +21,4 @@ package-lock.json
 # Vite
 vite.config.js.timestamp-*
 vite.config.ts.timestamp-*
+.vscode

src/lib/dbdata.ts

@@ -13,3 +13,7 @@ export interface AppointmentTimes {
     date: Date;
     available: boolean;
 }
+
+export interface AuthTokenResponse {
+    token: string;
+}

src/lib/index.ts

@@ -1,3 +1,6 @@
+import { writable, type Writable } from "svelte/store";
+
 // place files you want to import through the `$lib` alias in this folder.
 export const api_host = "http://localhost:3000";
-export let authToken = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjY3OTIxYTcyMTNiM2NkYjc5NGZmNzQ2MiIsImlhdCI6MTczNzcyOTYwMiwiZXhwIjoxNzM3NzUxMjAyfQ.-TlU0izsSJnZYE79yG01fcRgzgBirZBJBsiQf2alwZ4";
+ //export let authToken: string = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjY3OTIxYTcyMTNiM2NkYjc5NGZmNzQ2MiIsImlhdCI6MTczNzcyOTYwMiwiZXhwIjoxNzM3NzUxMjAyfQ.-TlU0izsSJnZYE79yG01fcRgzgBirZBJBsiQf2alwZ4";
+export let authToken: Writable<string> = writable("");

src/lib/modules/Auth.svelte

@@ -0,0 +1,77 @@
+<script lang="ts">
+	import { goto } from "$app/navigation";
+	import { api_host, authToken } from "$lib";
+	import type { AuthTokenResponse } from "$lib/dbdata";
+
+
+    let email: string = "";
+    let password: string = "";
+    let errorMessage: string = "";
+
+    async function authHandler(endpoint: string) {
+        errorMessage = "";
+
+        if (!email || !password) {
+            errorMessage = "not all parameters provided"
+            return;
+        }
+        try {
+            const response = await fetch(`${api_host}/api/auth/${endpoint}`, {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/json"
+                },
+                body: JSON.stringify({
+                    email: email,
+                    password: password
+                })
+            })
+
+            if (response.status === 200) {
+                const data: AuthTokenResponse = await response.json();
+                localStorage.setItem('token', data.token);
+                $authToken = data.token;
+                goto("/events");
+            } else {
+                errorMessage = "invalid credentials";
+            }
+        } catch (error) {
+            console.log(error);
+        }
+    }
+
+    async function register() {
+        await authHandler('register');
+    }
+
+    async function login() {
+        await authHandler('login');
+    }
+
+</script>
+
+
+<article class="large no-padding center center-align middle-align auto-margin">
+    <fieldset>
+    <div class="padding top-margin">
+        <h5>Anmeldung</h5>
+        <div class="field border">
+            <h4 class="large-text left-align">Email</h4>
+            <input id="email" placeholder="Email" bind:value={email} type="email" />
+        </div>
+
+        <div class="field suffix border">
+            <h4 class="large-text left-align">Password</h4>
+            <input id="password" placeholder="Password" bind:value={password} type="password" />
+        </div>
+
+        <div class="grid">
+            <button on:click={login} class="s6">Anmelden</button>
+            <button on:click={register} class="s6 yellow">Registrierung</button>
+        </div>
+        {#if errorMessage} 
+            <h5 class="large-text error-text">{errorMessage}</h5>
+        {/if}
+    </div>
+</fieldset>
+</article>

src/lib/modules/EventTables.svelte

@@ -11,7 +11,7 @@
             const response = await fetch(`${api_host}/api/users/appointments`, {
                 method: "GET",
                 headers: {
-                    "Authorization": "Bearer " + authToken
+                    "Authorization": "Bearer " + $authToken
                 },
             });
 
@@ -29,6 +29,7 @@
 
     onMount(async () => {
        await fetchAppointments();
+       
        ready = true;
     });
 

src/routes/+layout.svelte

@@ -14,7 +14,7 @@
             <i>list</i>
             <span>Buchungen</span>
         </a>
-        <a href="./pagecreator.html">
+        <a href="/creator">
             <i>library_add</i>
             <span>Neue Buchung</span>
         </a>

src/routes/auth/+page.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">
+	import Auth from "$lib/modules/Auth.svelte";
+</script>
+
+<Auth />

src/routes/creator/+page.svelte

@@ -0,0 +1,6 @@
+<script lang="ts">
+
+
+</script>
+
+