5 files changed, 79 insertions, 39 deletions
diff --git a/ui/lib/apiServer.js b/ui/lib/apiServer.js
index ccd6e66..46fcb53 100644
--- a/ui/lib/apiServer.js
+++ b/ui/lib/apiServer.js
@@ -3,12 +3,21 @@ import { channelsList, logins, messages } from '$lib/store';
 
 export const apiServer = axios.create({
   baseURL: '/api/',
+  validateStatus: (status) => status >= 200 && status < 500,
 });
 
 export async function boot() {
   return apiServer.get('/boot');
 }
 
+export async function setup(username, password) {
+  const data = {
+    name: username,
+    password,
+  };
+  return apiServer.post('/setup', data);
+}
+
 export async function logIn(username, password) {
   const data = {
     name: username,
diff --git a/ui/lib/components/LogIn.svelte b/ui/lib/components/LogIn.svelte
index e1cda8a..bb80ccd 100644
--- a/ui/lib/components/LogIn.svelte
+++ b/ui/lib/components/LogIn.svelte
@@ -1,27 +1,12 @@
 <script>
-    import { goto } from '$app/navigation';
-    import { logIn } from '$lib/apiServer';
-    import { currentUser } from '$lib/store';
-
-    let disabled = false;
-    let username = '';
-    let password = '';
-
-    async function handleLogin() {
-        disabled = true;
-        const response = await logIn(username, password);
-        if (200 <= response.status && response.status < 300) {
-            currentUser.update(() => ({ username }));
-            username = '';
-            password = '';
-            goto('/');
-        }
-        disabled = false;
-    }
+    export let disabled = false;
+    export let username = '';
+    export let password = '';
+    export let legend = 'sign in';
 </script>
 
 <div class="card m-4 p-4">
-    <form on:submit|preventDefault={handleLogin}>
+    <form on:submit|preventDefault>
         <label class="label" for="username">
             username
             <input class="input" name="username" type="text" placeholder="username" bind:value={username} disabled={disabled}>
@@ -31,7 +16,7 @@
             <input class="input" name="password" type="password" placeholder="password" bind:value={password} disabled={disabled}>
         </label>
         <button class="btn variant-filled" type="submit">
-            sign in or up
+            {legend}
         </button>
     </form>
 </div>
diff --git a/ui/routes/(app)/+layout.svelte b/ui/routes/(app)/+layout.svelte
index 0f8e83c..38df9b9 100644
--- a/ui/routes/(app)/+layout.svelte
+++ b/ui/routes/(app)/+layout.svelte
@@ -26,23 +26,23 @@
     }
 
 	onMount(async () => {
-        try {
-            let response = await boot();
-            switch (response.status) {
-                case 200:
-                    onBooted(response.data);
-                    events = subscribeToEvents(response.data.resume_point);
-                    break;
-                case 401:
-                    currentUser.update(() => null);
-                    goto('/login');
-                    break;
-                default:
-                    // TODO: display error.
-                    break;
-            }
-        } catch (_) {
-            // I don't want exceptions on non-200 series responses, dammit.
+        let response = await boot();
+        switch (response.status) {
+            case 200:
+                onBooted(response.data);
+                events = subscribeToEvents(response.data.resume_point);
+                break;
+            case 401:
+                currentUser.update(() => null);
+                goto('/login');
+                break;
+            case 409:
+                currentUser.update(() => null);
+                goto('/setup');
+                break;
+            default:
+                // TODO: display error.
+                break;
         }
         loading = false;
 	});
diff --git a/ui/routes/(login)/login/+page.svelte b/ui/routes/(login)/login/+page.svelte
index c333fdd..a349660 100644
--- a/ui/routes/(login)/login/+page.svelte
+++ b/ui/routes/(login)/login/+page.svelte
@@ -1,5 +1,26 @@
 <script>
+    import { goto } from '$app/navigation';
+    import { logIn } from '$lib/apiServer';
+    import { currentUser } from '$lib/store';
+
     import LogIn from '$lib/components/LogIn.svelte';
+
+    let disabled;
+    let username;
+    let password;
+
+    async function onSubmit() {
+        debugger;
+        disabled = true;
+        const response = await logIn(username, password);
+        if (200 <= response.status && response.status < 300) {
+            currentUser.update(() => ({ username }));
+            username = '';
+            password = '';
+            goto('/');
+        }
+        disabled = false;
+    }
 </script>
 
-<LogIn />
+<LogIn bind:disabled bind:username bind:password on:submit={onSubmit} />
diff --git a/ui/routes/(login)/setup/+page.svelte b/ui/routes/(login)/setup/+page.svelte
new file mode 100644
index 0000000..252e79b
--- /dev/null
+++ b/ui/routes/(login)/setup/+page.svelte
@@ -0,0 +1,25 @@
+<script>
+    import { goto } from '$app/navigation';
+    import { setup } from '$lib/apiServer';
+    import { currentUser } from '$lib/store';
+
+    import LogIn from '$lib/components/LogIn.svelte';
+
+    let disabled;
+    let username;
+    let password;
+
+    async function onSubmit() {
+        disabled = true;
+        const response = await setup(username, password);
+        if (200 <= response.status && response.status < 300) {
+            currentUser.update(() => ({ username }));
+            username = '';
+            password = '';
+            goto('/');
+        }
+        disabled = false;
+    }
+</script>
+
+<LogIn bind:disabled bind:username bind:password legend="set up" on:submit={onSubmit} />