mirror of
https://github.com/coracle-social/coracle.git
synced 2024-09-15 17:53:36 +00:00
Small chat fixes
This commit is contained in:
parent
92ea9dfaa8
commit
756924c1bb
@ -1,12 +1,15 @@
|
|||||||
<script>
|
<script>
|
||||||
|
import cx from 'classnames'
|
||||||
import {onMount} from 'svelte'
|
import {onMount} from 'svelte'
|
||||||
import {navigate} from 'svelte-routing'
|
import {navigate} from 'svelte-routing'
|
||||||
import {fuzzy} from "src/util/misc"
|
import {fuzzy} from "src/util/misc"
|
||||||
import {channels} from 'src/state/nostr'
|
import {channels} from 'src/state/nostr'
|
||||||
import Input from "src/partials/Input.svelte"
|
import Input from "src/partials/Input.svelte"
|
||||||
|
|
||||||
|
export let className = ''
|
||||||
|
|
||||||
let q = ""
|
let q = ""
|
||||||
let rooms = []
|
let rooms = {}
|
||||||
let search
|
let search
|
||||||
|
|
||||||
$: search = fuzzy(Object.values(rooms), {keys: ["name", "about"]})
|
$: search = fuzzy(Object.values(rooms), {keys: ["name", "about"]})
|
||||||
@ -21,21 +24,26 @@
|
|||||||
const events = await channels.getter.all({kinds: [40, 41]})
|
const events = await channels.getter.all({kinds: [40, 41]})
|
||||||
|
|
||||||
events.forEach(e => {
|
events.forEach(e => {
|
||||||
const id = e.kind === 40 ? e.id : e.tags[0][1]
|
const id = e.kind === 40 ? e.id : e.tags[0]?.[1]
|
||||||
|
const content = JSON.parse(e.content)
|
||||||
|
|
||||||
rooms[id] = {id, pubkey: e.pubkey, ...rooms[id], ...JSON.parse(e.content)}
|
// There are some non-standard rooms out there, ignore them
|
||||||
|
// if they don't have a name
|
||||||
|
if (content.name) {
|
||||||
|
rooms[id] = {id, pubkey: e.pubkey, ...rooms[id], ...content}
|
||||||
|
}
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="flex flex-col bg-dark w-full sm:w-56 h-full fixed py-8 border-r border-solid border-r-medium">
|
<div class={cx("flex flex-col bg-dark w-full sm:w-56 h-full fixed py-8 border-r border-solid border-r-medium", className)}>
|
||||||
<div class="m-4">
|
<div class="my-4 mx-3">
|
||||||
<Input bind:value={q} type="text" placeholder="Search rooms">
|
<Input bind:value={q} type="text" placeholder="Search rooms">
|
||||||
<i slot="before" class="fa-solid fa-search" />
|
<i slot="before" class="fa-solid fa-search" />
|
||||||
</Input>
|
</Input>
|
||||||
</div>
|
</div>
|
||||||
<ul>
|
<ul>
|
||||||
{#each search(q).slice(0, 10) as r}
|
{#each search(q).slice(0, 8) as r}
|
||||||
<li
|
<li
|
||||||
class="flex flex-col gap-2 px-3 py-2 cursor-pointer hover:bg-accent transition-all"
|
class="flex flex-col gap-2 px-3 py-2 cursor-pointer hover:bg-accent transition-all"
|
||||||
on:click={() => setRoom(r.id)}>
|
on:click={() => setRoom(r.id)}>
|
||||||
@ -52,6 +60,9 @@
|
|||||||
{/if}
|
{/if}
|
||||||
</li>
|
</li>
|
||||||
{/each}
|
{/each}
|
||||||
|
<li class="px-3">
|
||||||
|
<small>{Math.floor(0, Object.keys(rooms).length - 8)} more rooms found</small>
|
||||||
|
</li>
|
||||||
<li class="bg-medium m-3 h-px" />
|
<li class="bg-medium m-3 h-px" />
|
||||||
<li class="cursor-pointer font-bold hover:bg-accent transition-all px-3 py-2" on:click={createRoom}>
|
<li class="cursor-pointer font-bold hover:bg-accent transition-all px-3 py-2" on:click={createRoom}>
|
||||||
<i class="fa-solid fa-plus" /> Create Room
|
<i class="fa-solid fa-plus" /> Create Room
|
||||||
|
@ -2,7 +2,7 @@
|
|||||||
import {onMount} from 'svelte'
|
import {onMount} from 'svelte'
|
||||||
import {fly} from 'svelte/transition'
|
import {fly} from 'svelte/transition'
|
||||||
import {navigate} from 'svelte-routing'
|
import {navigate} from 'svelte-routing'
|
||||||
import {prop, last} from 'ramda'
|
import {prop, uniqBy, sortBy, last} from 'ramda'
|
||||||
import {switcherFn} from 'hurdak/src/core'
|
import {switcherFn} from 'hurdak/src/core'
|
||||||
import {formatTimestamp} from 'src/util/misc'
|
import {formatTimestamp} from 'src/util/misc'
|
||||||
import {toHtml} from 'src/util/html'
|
import {toHtml} from 'src/util/html'
|
||||||
@ -22,7 +22,7 @@
|
|||||||
|
|
||||||
$: {
|
$: {
|
||||||
// Group messages so we're only showing the account once per chunk
|
// Group messages so we're only showing the account once per chunk
|
||||||
annotatedMessages = messages.reduce(
|
annotatedMessages = sortBy(prop('created_at'), uniqBy(prop('id'), messages)).reduce(
|
||||||
(mx, m) => {
|
(mx, m) => {
|
||||||
const account = $accounts[m.pubkey]
|
const account = $accounts[m.pubkey]
|
||||||
|
|
||||||
@ -164,8 +164,6 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="hidden sm:block">
|
<RoomList className="hidden sm:flex" />
|
||||||
<RoomList />
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user