diff options
| -rw-r--r-- | ui/routes/(app)/+layout.svelte | 32 |
1 files changed, 31 insertions, 1 deletions
diff --git a/ui/routes/(app)/+layout.svelte b/ui/routes/(app)/+layout.svelte index ad8227e..81324fd 100644 --- a/ui/routes/(app)/+layout.svelte +++ b/ui/routes/(app)/+layout.svelte @@ -19,6 +19,35 @@ let loading = $state(true); let channel = $derived($page.params.channel); + let rawChannels; + channelsList.subscribe((val) => { + rawChannels = val.channels; + }); + let rawMessages; + messages.subscribe((val) => { + rawMessages = val; + }); + + let enrichedChannels = $derived.by(() => { + const channels = rawChannels; + const messages = rawMessages; + const enrichedChannels = []; + if (channels && messages) { + for (let ch of channels) { + let runs = messages.inChannel(ch.id); + let lastRun = runs?.slice(-1)[0]; + let lastMessage = lastRun?.messages.slice(-1)[0]; + let lastMessageAt = lastMessage?.at; + let hasUnreads = lastMessageAt > ch.lastReadAt; + enrichedChannels.push({ + ...ch, + hasUnreads, + }); + } + } + return enrichedChannels; + }); + function onBooted(boot) { currentUser.set({ id: boot.login.id, @@ -78,6 +107,7 @@ </script> <svelte:head> + <!-- TODO: unread count? --> <title>pilcrow</title> </svelte:head> @@ -87,7 +117,7 @@ <div id="interface" class="p-2"> <nav id="sidebar" data-expanded={pageContext.showMenu}> <div class="channel-list"> - <ChannelList active={channel} channels={$channelsList.channels} /> + <ChannelList active={channel} channels={enrichedChannels} /> </div> <div class="create-channel"> <CreateChannelForm /> |