diff options
Diffstat (limited to 'hi-ui/src/lib/components')
| -rw-r--r-- | hi-ui/src/lib/components/ActiveChannel.svelte | 27 | ||||
| -rw-r--r-- | hi-ui/src/lib/components/Channel.svelte | 21 | ||||
| -rw-r--r-- | hi-ui/src/lib/components/ChannelList.svelte | 18 | ||||
| -rw-r--r-- | hi-ui/src/lib/components/CreateChannelForm.svelte | 23 | ||||
| -rw-r--r-- | hi-ui/src/lib/components/LogIn.svelte | 35 | ||||
| -rw-r--r-- | hi-ui/src/lib/components/LogOut.svelte | 22 | ||||
| -rw-r--r-- | hi-ui/src/lib/components/Message.svelte | 33 | ||||
| -rw-r--r-- | hi-ui/src/lib/components/MessageInput.svelte | 30 |
8 files changed, 0 insertions, 209 deletions
diff --git a/hi-ui/src/lib/components/ActiveChannel.svelte b/hi-ui/src/lib/components/ActiveChannel.svelte deleted file mode 100644 index 978e952..0000000 --- a/hi-ui/src/lib/components/ActiveChannel.svelte +++ /dev/null @@ -1,27 +0,0 @@ -<script> - import { activeChannel, messages } from '$lib/store'; - import Message from './Message.svelte'; - - let container; - $: messageList = $activeChannel.isSet() ? $messages.inChannel($activeChannel.get()) : []; - - // TODO: eventually, store scroll height/last unread in channel? scroll there? - - let scroll = (message) => { - message.scrollIntoView(); - } -</script> - -<div class="container" bind:this={container}> - {#each messageList as message} - <div use:scroll> - <Message {...message} /> - </div> - {/each} -</div> - -<style> - .container { - overflow: scroll; - } -</style> diff --git a/hi-ui/src/lib/components/Channel.svelte b/hi-ui/src/lib/components/Channel.svelte deleted file mode 100644 index 97fea1f..0000000 --- a/hi-ui/src/lib/components/Channel.svelte +++ /dev/null @@ -1,21 +0,0 @@ -<script> - import { activeChannel } from '$lib/store'; - - export let id; - export let name; - let active = false; - - activeChannel.subscribe((value) => { - active = value.is(id); - }); -</script> - -<li - class="rounded-full" - class:bg-slate-400={active} -> -<a href="/ch/{id}"> - <span class="badge bg-primary-500">#</span> - <span class="flex-auto">{name}</span> -</a> -</li> diff --git a/hi-ui/src/lib/components/ChannelList.svelte b/hi-ui/src/lib/components/ChannelList.svelte deleted file mode 100644 index e0e5f06..0000000 --- a/hi-ui/src/lib/components/ChannelList.svelte +++ /dev/null @@ -1,18 +0,0 @@ -<script> - import { channelsList } from '$lib/store'; - import Channel from './Channel.svelte'; - - let channels; - - channelsList.subscribe((value) => { - channels = value.channels; - }); -</script> - -<nav class="list-nav"> - <ul> - {#each channels as channel} - <Channel {...channel} /> - {/each} - </ul> -</nav> diff --git a/hi-ui/src/lib/components/CreateChannelForm.svelte b/hi-ui/src/lib/components/CreateChannelForm.svelte deleted file mode 100644 index ddcf486..0000000 --- a/hi-ui/src/lib/components/CreateChannelForm.svelte +++ /dev/null @@ -1,23 +0,0 @@ -<script> - import { createChannel } from '$lib/apiServer'; - - let name = ''; - let disabled = false; - - async function handleSubmit(event) { - disabled = true; - const response = await createChannel(name); - if (200 <= response.status && response.status < 300) { - name = ''; - } - disabled = false; - } -</script> - -<form on:submit|preventDefault={handleSubmit} class="form form-row flex-nowrap"> - <input type="text" placeholder="create channel" bind:value={name} disabled={disabled} class="input flex-auto h-6 w-9/12" /> - <button type="submit" class="flex-none w-6 h-6">➕</button> -</form> - -<style> -</style> diff --git a/hi-ui/src/lib/components/LogIn.svelte b/hi-ui/src/lib/components/LogIn.svelte deleted file mode 100644 index 2836e6d..0000000 --- a/hi-ui/src/lib/components/LogIn.svelte +++ /dev/null @@ -1,35 +0,0 @@ -<script> - import { logIn } from '$lib/apiServer'; - import { currentUser } from '$lib/store'; - - let disabled = false; - let username = ''; - let password = ''; - - async function handleLogin(event) { - disabled = true; - const response = await logIn(username, password); - if (200 <= response.status && response.status < 300) { - currentUser.update(() => ({ username })); - username = ''; - password = ''; - } - disabled = false; - } -</script> - -<div class="card m-4 p-4"> - <form on:submit|preventDefault={handleLogin}> - <label class="label" for="username"> - username - <input class="input" name="username" type="text" placeholder="username" bind:value={username} disabled={disabled}> - </label> - <label class="label" for="password"> - password - <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 - </button> - </form> -</div> diff --git a/hi-ui/src/lib/components/LogOut.svelte b/hi-ui/src/lib/components/LogOut.svelte deleted file mode 100644 index 01bef1b..0000000 --- a/hi-ui/src/lib/components/LogOut.svelte +++ /dev/null @@ -1,22 +0,0 @@ -<script> - import { logOut} from '$lib/apiServer'; - import { currentUser } from '$lib/store'; - - async function handleLogout(event) { - const response = await logOut(); - if (200 <= response.status && response.status < 300) { - currentUser.update(() => null); - } - } -</script> - -<form on:submit|preventDefault={handleLogout}> - @{$currentUser.username} - <button - class="border-slate-500 border-solid border-2 font-bold p-1 rounded" - type="submit" - >log out</button> -</form> - -<style> -</style> diff --git a/hi-ui/src/lib/components/Message.svelte b/hi-ui/src/lib/components/Message.svelte deleted file mode 100644 index d040433..0000000 --- a/hi-ui/src/lib/components/Message.svelte +++ /dev/null @@ -1,33 +0,0 @@ -<script> - import SvelteMarkdown from 'svelte-markdown'; - import { currentUser, logins } from '$lib/store'; - import { deleteMessage } from '$lib/apiServer'; - - export let at; // XXX: Omitted for now. - export let sender; - export let body; - - let timestamp = new Date(at).toTimeString(); - let name; - $: name = $logins.get(sender); -</script> - -<div class="card card-hover m-4 relative"> - <span class="chip variant-soft sticky top-o left-0"> - <!-- TODO: should this show up for only the first of a run? --> - @{name}: - </span> - <span class="timestamp chip variant-soft absolute top-0 right-0">{at}</span> - <section class="p-4"> - <SvelteMarkdown source={body} /> - </section> -</div> - -<style> - .card .timestamp { - display: none; - } - .card:hover .timestamp { - display: flex; - } -</style> diff --git a/hi-ui/src/lib/components/MessageInput.svelte b/hi-ui/src/lib/components/MessageInput.svelte deleted file mode 100644 index b33574b..0000000 --- a/hi-ui/src/lib/components/MessageInput.svelte +++ /dev/null @@ -1,30 +0,0 @@ -<script> - import { tick } from 'svelte'; - import { postToChannel } from '$lib/apiServer'; - import { activeChannel } from '$lib/store'; - - let input; - let value; - let disabled; - activeChannel.subscribe((value) => { - disabled = !value.isSet(); - if (input && !disabled) { - input.focus(); - } - }); - - async function handleSubmit(event) { - disabled = true; - // TODO try/catch: - await postToChannel($activeChannel.get(), value); - value = ''; - disabled = false; - await tick(); - input.focus(); - } -</script> - -<form on:submit|preventDefault={handleSubmit} class="flex flex-row flex-nowrap"> - <input bind:this={input} bind:value={value} disabled={disabled} type="search" class="flex-auto h-6 input rounded-r-none" /> - <button color="primary variant-filled-secondary" type="submit" class="flex-none w-6 h-6 btn-icon variant-filled rounded-l-none">»</button> -</form> |