Run spaces-style prettier formatting

8 files changed, 275 insertions, 275 deletions

diff --git a/ui/routes/(app)/+layout.svelte b/ui/routes/(app)/+layout.svelte
index 356a096..94e4509 100644
--- a/ui/routes/(app)/+layout.svelte
+++ b/ui/routes/(app)/+layout.svelte
@@ -1,122 +1,122 @@
 <script>
-	import { page } from '$app/stores';
-	import { goto } from '$app/navigation';
-	import { onMount, onDestroy } from 'svelte';
+  import { page } from '$app/stores';
+  import { goto } from '$app/navigation';
+  import { onMount, onDestroy } from 'svelte';
 
-	import { boot, subscribeToEvents } from '$lib/apiServer';
-	import { showMenu, currentUser, logins, channelsList, messages } from '$lib/store';
+  import { boot, subscribeToEvents } from '$lib/apiServer';
+  import { showMenu, currentUser, logins, channelsList, messages } from '$lib/store';
 
-	import ChannelList from '$lib/components/ChannelList.svelte';
-	import CreateChannelForm from '$lib/components/CreateChannelForm.svelte';
+  import ChannelList from '$lib/components/ChannelList.svelte';
+  import CreateChannelForm from '$lib/components/CreateChannelForm.svelte';
 
-	let events = null;
+  let events = null;
 
-	let loading = $state(true);
-	let channel = $derived($page.params.channel);
+  let loading = $state(true);
+  let channel = $derived($page.params.channel);
 
-	function onBooted(boot) {
-		currentUser.update(() => ({
-			id: boot.login.id,
-			username: boot.login.name
-		}));
-		logins.update((value) => value.setLogins(boot.logins));
-		channelsList.update((value) => value.setChannels(boot.channels));
-		messages.update((value) => value.setMessages(boot.messages));
-	}
+  function onBooted(boot) {
+    currentUser.update(() => ({
+      id: boot.login.id,
+      username: boot.login.name
+    }));
+    logins.update((value) => value.setLogins(boot.logins));
+    channelsList.update((value) => value.setChannels(boot.channels));
+    messages.update((value) => value.setMessages(boot.messages));
+  }
 
-	onMount(async () => {
-		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 503:
-				currentUser.update(() => null);
-				goto('/setup');
-				break;
-			default:
-				// TODO: display error.
-				break;
-		}
-		loading = false;
-	});
+  onMount(async () => {
+    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 503:
+        currentUser.update(() => null);
+        goto('/setup');
+        break;
+      default:
+        // TODO: display error.
+        break;
+    }
+    loading = false;
+  });
 
-	onDestroy(async () => {
-		if (events !== null) {
-			events.close();
-		}
-	});
+  onDestroy(async () => {
+    if (events !== null) {
+      events.close();
+    }
+  });
 </script>
 
 <svelte:head>
-	<title>understory</title>
+  <title>understory</title>
 </svelte:head>
 
 {#if loading}
-	<h2>Loading&hellip;</h2>
+  <h2>Loading&hellip;</h2>
 {:else}
-	<div id="interface" class="p-2">
-		<nav id="sidebar" data-expanded={$showMenu}>
-			<div class="channel-list">
-				<ChannelList active={channel} channels={$channelsList.channels} />
-			</div>
-			<div class="create-channel">
-				<CreateChannelForm />
-			</div>
-		</nav>
-		<main>
-			<slot />
-		</main>
-	</div>
+  <div id="interface" class="p-2">
+    <nav id="sidebar" data-expanded={$showMenu}>
+      <div class="channel-list">
+        <ChannelList active={channel} channels={$channelsList.channels} />
+      </div>
+      <div class="create-channel">
+        <CreateChannelForm />
+      </div>
+    </nav>
+    <main>
+      <slot />
+    </main>
+  </div>
 {/if}
 
 <style>
-	:root {
-		--app-bar-height: 68px;
-		--input-row-height: 2rem;
-		--interface-padding: 16px;
-	}
+  :root {
+    --app-bar-height: 68px;
+    --input-row-height: 2rem;
+    --interface-padding: 16px;
+  }
 
-	#interface {
-		margin: unset;
-		display: grid;
-		grid-template:
-			'side main' 1fr
-			/ auto 1fr;
-		height: calc(100vh - var(--app-bar-height));
+  #interface {
+    margin: unset;
+    display: grid;
+    grid-template:
+      'side main' 1fr
+      / auto 1fr;
+    height: calc(100vh - var(--app-bar-height));
 
-		@media (width > 640px) {
-			--overlay: static;
-			--translate: 0;
-		}
-	}
-	nav {
-		grid-area: side;
-		background-color: rgb(var(--color-surface-800));
-		inset: auto auto 0 0;
-		padding: 0.25rem;
-		position: var(--overlay, absolute);
-		transition: translate 300ms ease-out;
-		width: 21rem;
-		height: calc(100vh - var(--app-bar-height) - var(--interface-padding));
-		z-index: 10;
-	}
-	main {
-		grid-area: main;
-		height: calc(100vh - var(--app-bar-height) - var(--interface-padding));
-	}
-	.channel-list {
-		height: calc(
-			100vh - var(--app-bar-height) - var(--interface-padding) - var(--input-row-height)
-		);
-		overflow: auto;
-	}
-	nav[data-expanded='false'] {
-		translate: var(--translate, -100% 0);
-	}
+    @media (width > 640px) {
+      --overlay: static;
+      --translate: 0;
+    }
+  }
+  nav {
+    grid-area: side;
+    background-color: rgb(var(--color-surface-800));
+    inset: auto auto 0 0;
+    padding: 0.25rem;
+    position: var(--overlay, absolute);
+    transition: translate 300ms ease-out;
+    width: 21rem;
+    height: calc(100vh - var(--app-bar-height) - var(--interface-padding));
+    z-index: 10;
+  }
+  main {
+    grid-area: main;
+    height: calc(100vh - var(--app-bar-height) - var(--interface-padding));
+  }
+  .channel-list {
+    height: calc(
+      100vh - var(--app-bar-height) - var(--interface-padding) - var(--input-row-height)
+    );
+    overflow: auto;
+  }
+  nav[data-expanded='false'] {
+    translate: var(--translate, -100% 0);
+  }
 </style>
diff --git a/ui/routes/(app)/ch/[channel]/+page.svelte b/ui/routes/(app)/ch/[channel]/+page.svelte
index a5836fc..49c1c29 100644
--- a/ui/routes/(app)/ch/[channel]/+page.svelte
+++ b/ui/routes/(app)/ch/[channel]/+page.svelte
@@ -1,23 +1,23 @@
 <script>
-	import { page } from '$app/stores';
-	import ActiveChannel from '$lib/components/ActiveChannel.svelte';
-	import MessageInput from '$lib/components/MessageInput.svelte';
+  import { page } from '$app/stores';
+  import ActiveChannel from '$lib/components/ActiveChannel.svelte';
+  import MessageInput from '$lib/components/MessageInput.svelte';
 
-	let channel = $derived($page.params.channel);
+  let channel = $derived($page.params.channel);
 </script>
 
 <div class="active-channel">
-	<ActiveChannel {channel} />
+  <ActiveChannel {channel} />
 </div>
 <div class="create-message max-h-full">
-	<MessageInput {channel} />
+  <MessageInput {channel} />
 </div>
 
 <style>
-	.active-channel {
-		height: calc(
-			100vh - var(--app-bar-height) - var(--interface-padding) - var(--input-row-height)
-		);
-		overflow: auto;
-	}
+  .active-channel {
+    height: calc(
+      100vh - var(--app-bar-height) - var(--interface-padding) - var(--input-row-height)
+    );
+    overflow: auto;
+  }
 </style>
diff --git a/ui/routes/(app)/me/+page.svelte b/ui/routes/(app)/me/+page.svelte
index 4531a91..30da6f0 100644
--- a/ui/routes/(app)/me/+page.svelte
+++ b/ui/routes/(app)/me/+page.svelte
@@ -1,64 +1,64 @@
 <script>
-	import { changePassword } from '$lib/apiServer.js';
+  import { changePassword } from '$lib/apiServer.js';
 
-	import Invites from '$lib/components/Invites.svelte';
+  import Invites from '$lib/components/Invites.svelte';
 
-	let currentPassword = $state(''),
-		newPassword = $state(''),
-		confirmPassword = $state(''),
-		passwordForm;
-	let pending = $state(false);
-	let valid = $derived(newPassword === confirmPassword && newPassword !== currentPassword);
-	let disabled = $derived(pending || !valid);
+  let currentPassword = $state(''),
+    newPassword = $state(''),
+    confirmPassword = $state(''),
+    passwordForm;
+  let pending = $state(false);
+  let valid = $derived(newPassword === confirmPassword && newPassword !== currentPassword);
+  let disabled = $derived(pending || !valid);
 
-	async function onPasswordChange(event) {
-		event.preventDefault();
-		pending = true;
-		let response = await changePassword(currentPassword, newPassword);
-		switch (response.status) {
-			case 200:
-				passwordForm.reset();
-				break;
-		}
-		pending = false;
-	}
+  async function onPasswordChange(event) {
+    event.preventDefault();
+    pending = true;
+    let response = await changePassword(currentPassword, newPassword);
+    switch (response.status) {
+      case 200:
+        passwordForm.reset();
+        break;
+    }
+    pending = false;
+  }
 </script>
 
 <form onsubmit={onPasswordChange} bind:this={passwordForm}>
-	<label
-		>current password
-		<input
-			class="input"
-			name="currentPassword"
-			type="password"
-			placeholder="password"
-			bind:value={currentPassword}
-		/>
-	</label>
+  <label
+    >current password
+    <input
+      class="input"
+      name="currentPassword"
+      type="password"
+      placeholder="password"
+      bind:value={currentPassword}
+    />
+  </label>
 
-	<label
-		>new password
-		<input
-			class="input"
-			name="newPassword"
-			type="password"
-			placeholder="password"
-			bind:value={newPassword}
-		/>
-	</label>
+  <label
+    >new password
+    <input
+      class="input"
+      name="newPassword"
+      type="password"
+      placeholder="password"
+      bind:value={newPassword}
+    />
+  </label>
 
-	<label
-		>confirm new password
-		<input
-			class="input"
-			name="confirmPassword"
-			type="password"
-			placeholder="password"
-			bind:value={confirmPassword}
-		/>
-	</label>
+  <label
+    >confirm new password
+    <input
+      class="input"
+      name="confirmPassword"
+      type="password"
+      placeholder="password"
+      bind:value={confirmPassword}
+    />
+  </label>
 
-	<button class="btn variant-filled" type="submit" {disabled}> change password </button>
+  <button class="btn variant-filled" type="submit" {disabled}> change password </button>
 </form>
 
 <Invites />
diff --git a/ui/routes/(login)/invite/[invite]/+page.js b/ui/routes/(login)/invite/[invite]/+page.js
index 32c9290..5d526df 100644
--- a/ui/routes/(login)/invite/[invite]/+page.js
+++ b/ui/routes/(login)/invite/[invite]/+page.js
@@ -1,23 +1,23 @@
 import { getInvite } from '$lib/apiServer';
 
 async function loadInvite(invite) {
-	let response = await getInvite(invite);
-	switch (response.status) {
-		case 200: {
-			let invite = response.data;
-			return invite;
-		}
-		case 404:
-			return null;
-		default:
-			// TODO: display error.
-			break;
-	}
+  let response = await getInvite(invite);
+  switch (response.status) {
+    case 200: {
+      let invite = response.data;
+      return invite;
+    }
+    case 404:
+      return null;
+    default:
+      // TODO: display error.
+      break;
+  }
 }
 
 export function load({ params }) {
-	let { invite } = params;
-	return {
-		invite: loadInvite(invite)
-	};
+  let { invite } = params;
+  return {
+    invite: loadInvite(invite)
+  };
 }
diff --git a/ui/routes/(login)/invite/[invite]/+page.svelte b/ui/routes/(login)/invite/[invite]/+page.svelte
index 65f5a97..18bf437 100644
--- a/ui/routes/(login)/invite/[invite]/+page.svelte
+++ b/ui/routes/(login)/invite/[invite]/+page.svelte
@@ -1,36 +1,36 @@
 <script>
-	import { goto } from '$app/navigation';
-	import { acceptInvite } from '$lib/apiServer';
+  import { goto } from '$app/navigation';
+  import { acceptInvite } from '$lib/apiServer';
 
-	import LogIn from '$lib/components/LogIn.svelte';
+  import LogIn from '$lib/components/LogIn.svelte';
 
-	let { data } = $props();
+  let { data } = $props();
 
-	let username = $state(''),
-		password = $state('');
-	let pending = false;
-	let disabled = $derived(pending);
+  let username = $state(''),
+    password = $state('');
+  let pending = false;
+  let disabled = $derived(pending);
 
-	async function onSubmit(event) {
-		event.preventDefault();
-		pending = true;
-		const response = await acceptInvite(data.invite.id, username, password);
-		if (200 <= response.status && response.status < 300) {
-			username = '';
-			password = '';
-			goto('/');
-		}
-		pending = false;
-	}
+  async function onSubmit(event) {
+    event.preventDefault();
+    pending = true;
+    const response = await acceptInvite(data.invite.id, username, password);
+    if (200 <= response.status && response.status < 300) {
+      username = '';
+      password = '';
+      goto('/');
+    }
+    pending = false;
+  }
 </script>
 
 {#await data.invite}
-	<div class="card m-4 p-4">
-		<p>Loading invitation…</p>
-	</div>
+  <div class="card m-4 p-4">
+    <p>Loading invitation…</p>
+  </div>
 {:then invite}
-	<div class="card m-4 p-4">
-		<p>Hi there! {invite.issuer} invites you to the conversation.</p>
-	</div>
-	<LogIn {disabled} bind:username bind:password onsubmit={onSubmit} />
+  <div class="card m-4 p-4">
+    <p>Hi there! {invite.issuer} invites you to the conversation.</p>
+  </div>
+  <LogIn {disabled} bind:username bind:password onsubmit={onSubmit} />
 {/await}
diff --git a/ui/routes/(login)/login/+page.svelte b/ui/routes/(login)/login/+page.svelte
index 77c2d62..a1291ea 100644
--- a/ui/routes/(login)/login/+page.svelte
+++ b/ui/routes/(login)/login/+page.svelte
@@ -1,25 +1,25 @@
 <script>
-	import { goto } from '$app/navigation';
-	import { logIn } from '$lib/apiServer';
+  import { goto } from '$app/navigation';
+  import { logIn } from '$lib/apiServer';
 
-	import LogIn from '$lib/components/LogIn.svelte';
+  import LogIn from '$lib/components/LogIn.svelte';
 
-	let username = '',
-		password = '';
-	let pending = false;
-	$: disabled = pending;
+  let username = '',
+    password = '';
+  let pending = false;
+  $: disabled = pending;
 
-	async function onSubmit(event) {
-		event.preventDefault();
-		pending = true;
-		const response = await logIn(username, password);
-		if (200 <= response.status && response.status < 300) {
-			username = '';
-			password = '';
-			goto('/');
-		}
-		pending = false;
-	}
+  async function onSubmit(event) {
+    event.preventDefault();
+    pending = true;
+    const response = await logIn(username, password);
+    if (200 <= response.status && response.status < 300) {
+      username = '';
+      password = '';
+      goto('/');
+    }
+    pending = false;
+  }
 </script>
 
 <LogIn {disabled} bind:username bind:password onsubmit={onSubmit} />
diff --git a/ui/routes/(login)/setup/+page.svelte b/ui/routes/(login)/setup/+page.svelte
index f95403f..f162ded 100644
--- a/ui/routes/(login)/setup/+page.svelte
+++ b/ui/routes/(login)/setup/+page.svelte
@@ -1,25 +1,25 @@
 <script>
-	import { goto } from '$app/navigation';
-	import { setup } from '$lib/apiServer';
+  import { goto } from '$app/navigation';
+  import { setup } from '$lib/apiServer';
 
-	import LogIn from '$lib/components/LogIn.svelte';
+  import LogIn from '$lib/components/LogIn.svelte';
 
-	let username = $state(''),
-		password = $state('');
-	let pending = false;
-	let disabled = $derived(pending);
+  let username = $state(''),
+    password = $state('');
+  let pending = false;
+  let disabled = $derived(pending);
 
-	async function onSubmit(event) {
-		event.preventDefault();
-		pending = true;
-		const response = await setup(username, password);
-		if (200 <= response.status && response.status < 300) {
-			username = '';
-			password = '';
-			goto('/');
-		}
-		pending = false;
-	}
+  async function onSubmit(event) {
+    event.preventDefault();
+    pending = true;
+    const response = await setup(username, password);
+    if (200 <= response.status && response.status < 300) {
+      username = '';
+      password = '';
+      goto('/');
+    }
+    pending = false;
+  }
 </script>
 
 <LogIn {disabled} bind:username bind:password legend="set up" onsubmit={onSubmit} />
diff --git a/ui/routes/+layout.svelte b/ui/routes/+layout.svelte
index e0355dd..0477195 100644
--- a/ui/routes/+layout.svelte
+++ b/ui/routes/+layout.svelte
@@ -1,46 +1,46 @@
 <script>
-	import { onNavigate } from '$app/navigation';
-	import '../app.css';
-	import logo from '$lib/assets/logo.png';
+  import { onNavigate } from '$app/navigation';
+  import '../app.css';
+  import logo from '$lib/assets/logo.png';
 
-	import { AppBar } from '@skeletonlabs/skeleton';
-	import { showMenu, currentUser } from '$lib/store';
+  import { AppBar } from '@skeletonlabs/skeleton';
+  import { showMenu, currentUser } from '$lib/store';
 
-	import CurrentUser from '$lib/components/CurrentUser.svelte';
+  import CurrentUser from '$lib/components/CurrentUser.svelte';
 
-	function toggleMenu() {
-		showMenu.update((value) => !value);
-	}
+  function toggleMenu() {
+    showMenu.update((value) => !value);
+  }
 
-	onNavigate(() => {
-		showMenu.update(() => false);
-	});
+  onNavigate(() => {
+    showMenu.update(() => false);
+  });
 </script>
 
 <div id="app" class="m-0 p-0 h-vh w-full">
-	<div class="w-full">
-		<AppBar class="app-bar">
-			<svelte:fragment slot="lead">
-				<button on:click|preventDefault={toggleMenu} class="cursor-pointer">
-					<img class="w-8 h-8" alt="logo" src={logo} />
-				</button>
-			</svelte:fragment>
-			<a href="/">understory</a>
-			<svelte:fragment slot="trail">
-				{#if $currentUser}
-					<CurrentUser />
-				{/if}
-			</svelte:fragment>
-		</AppBar>
-	</div>
+  <div class="w-full">
+    <AppBar class="app-bar">
+      <svelte:fragment slot="lead">
+        <button on:click|preventDefault={toggleMenu} class="cursor-pointer">
+          <img class="w-8 h-8" alt="logo" src={logo} />
+        </button>
+      </svelte:fragment>
+      <a href="/">understory</a>
+      <svelte:fragment slot="trail">
+        {#if $currentUser}
+          <CurrentUser />
+        {/if}
+      </svelte:fragment>
+    </AppBar>
+  </div>
 
-	<slot />
+  <slot />
 </div>
 
 <style>
-	#app {
-		margin: 0;
-		height: 100vh;
-		width: 100%;
-	}
+  #app {
+    margin: 0;
+    height: 100vh;
+    width: 100%;
+  }
 </style>