From e37c73e33a4aaf7fb8d25b5af03627f20bcda19f Mon Sep 17 00:00:00 2001
From: Doog <157747121+doogongithub@users.noreply.github.com>
Date: Sat, 24 Feb 2024 20:08:35 -0500
Subject: add gitignore

---
 fe/src/App.svelte | 147 ++++--------------------------------------------------
 1 file changed, 10 insertions(+), 137 deletions(-)

(limited to 'fe/src/App.svelte')

diff --git a/fe/src/App.svelte b/fe/src/App.svelte
index cc4e594..8811c52 100644
--- a/fe/src/App.svelte
+++ b/fe/src/App.svelte
@@ -1,146 +1,19 @@
 <script lang="ts">
-    import {onMount} from 'svelte';
-    import svelteLogo from './assets/svelte.svg'
-    import viteLogo from '/vite.svg'
-    import Counter from './lib/Counter.svelte'
-    import Table from './lib/Table.svelte'
-    import Card from './lib/Card.svelte'
-    import { UnauthorizedError } from './lib/errors';
- 
-    let data;
-    let error;
-
-    let user = {
-        username: '',
-        password: ''
-    }
-
-    interface CredentialObject {
-        username: string;
-        password: string;
-    }
-
-    function sleep(ms) {
-        return new Promise(resolve => setTimeout(resolve, ms));
-    }
-
-    async function getData() {
-        const res = await fetch('http://localhost:8080/api/v1/stats/');
-        if (res.ok) {
-            await sleep(3000);
-            return await res.json();
-        } else {
-            throw new Error('There was a problem with your request');
-        }
-    }
-
-    function handleClick () {
-      data = getData();
-    } 
-    
-    let authenticated: boolean = false;
-
-    function prepareCredentials ({ username, password }: CredentialObject): string {
-        return btoa(`${username}:${password}`);
-    }
-
-
-    async function onSubmit(e) {
-        if (!user.username || !user.password) {
-            error = 'please enter your username and password';
-            return;
-        }
-       const auth = prepareCredentials(user);
-
-       const response = await fetch('http://localhost:8080/api/v1/auth', {
-            method: 'POST',
-            headers: {
-                'Authorization': `Basic ${auth}`,
-            },
-       });
-
-        if (response.status === 401) {
-            error = "Your username or password is wrong";
-            return;
-        }
-
-        if (response.ok) {
-            const { token } = await response.json();
-            console.log(token);
-            localStorage.user = JSON.stringify(user);
-            localStorage.token = token;
-            authenticated = true;
-        }
-        
-
-        error = null;
-    }
-
-    function logout() {
-        localStorage.removeItem("user");
-        localStorage.removeItem("token");
-        authenticated = false;
-    }
-
-
-    onMount(() => {
-        if (localStorage.token) {
-            authenticated = true;
-        } 
-    });
+    import { onMount, onDestroy } from 'svelte';
+    import Layout from './lib/Layout.svelte'
+    import LoginForm from './lib/LoginForm.svelte';
+    import DataView from './lib/DataView.svelte';
+    import { authenticated } from './stores/auth';
 </script>
 
 <main>
-    {#if !authenticated}
-        <Card>
-            <form class="form" on:submit|preventDefault={onSubmit}>
-                <div class='form input group'>
-                    <label for="username">Username</label>
-                    <input bind:value={user.username} id="username" name='username' type="text" />
-                </div>
-                <div class='form input group'>
-                    <label for="password">Password</label>
-                    <input bind:value={user.password} id="password" name='password' type="password" />
-                </div>
-                {#if error}
-                    <p class="error">{error}</p>
-                {/if}
-                <button type="submit">Log in</button>
-            </form>
-        </Card>
+    <Layout>
+    {#if !$authenticated}
+        <LoginForm />
     {:else}
-        <div>
-            <button on:click={logout}>Logout</button>
-        </div>
-      <div>
-        <a href="https://vitejs.dev" target="_blank" rel="noreferrer">
-          <img src={viteLogo} class="logo" alt="Vite Logo" />
-        </a>
-        <a href="https://svelte.dev" target="_blank" rel="noreferrer">
-          <img src={svelteLogo} class="logo svelte" alt="Svelte Logo" />
-        </a>
-      </div>
-
-      <button on:click={handleClick}>
-        Get Data
-      </button>
-
-      {#await data}
-        <p>...fetching</p>
-      {:then data}
-        {#if data}
-            <p>Status</p>
-            <p>{data.status}</p>
-            <Table />
-            <Table nofooter title="No Footer"/>
-            <Table noheader title="No Header"/>
-        {:else}
-            <p>No data yet</p>
-        {/if}
-      {:catch errror}
-        <p>{error.message}</p>
-      {/await}
+        <DataView />
     {/if} 
+    </Layout>
 </main>
 
 <style>
-- 
cgit v1.1

