From e0d93f326722609a0ba50da106ace9b7a43bbc7b Mon Sep 17 00:00:00 2001
From: Kit La Touche <kit@transneptune.net>
Date: Fri, 29 Nov 2024 14:36:04 -0500
Subject: Enrich channels with hasUnread attribute

This requires both the channels and messages stores to be available, so
we do it in the page file where we've got those stores handy. It's a bit
inefficient (it recreates the entire enrichedChannels array every time
one of them changes), but it'll do for now.

There's also a TODO hinting that we might want an idea of unread-count.
I think that would require a distinct idea of mentions, because we just
want "fact of unread" for general-availability channels, not "this many
messages since you were last here".
---
 ui/routes/(app)/+layout.svelte | 32 +++++++++++++++++++++++++++++++-
 1 file changed, 31 insertions(+), 1 deletion(-)

(limited to 'ui/routes/(app)/+layout.svelte')

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 />
-- 
cgit v1.2.3

