updating channel item reference

net/web/src/User/SideBar/Contacts/Channels/ChannelItem/ChannelItem.jsx

@@ -15,7 +15,7 @@ export function ChannelItem({ item }) {
   return (
     <ChannelItemWrapper onClick={() => onSelect()}>
       <ChannelLogo item={item} />
-      {state.updated && (
+      {item.updated && (
         <Marker />
       )}
       <ChannelLabel item={item} />

net/web/src/User/SideBar/Contacts/Channels/ChannelItem/useChannelItem.hook.jsx

@@ -1,25 +1,11 @@
 import { useContext, useState, useEffect } from 'react';
 import { useNavigate } from 'react-router-dom';
-import { StoreContext } from 'context/StoreContext';
 
 export function useChannelItem(item) {
 
   const [state, setState] = useState({
-    updated: false,
   });
 
-  const store = useContext(StoreContext);
-
-  useEffect(() => {
-    let key = `${item.id}::${item.cardId}`;
-    if (store.state[key] == item.revision) {
-      updateState({ updated: false });
-    }
-    else {
-      updateState({ updated: true });
-    }
-  }, [store]);
-
   const updateState = (value) => {
     setState((s) => ({ ...s, ...value }));
   }

net/web/src/User/SideBar/Contacts/Channels/useChannels.hook.js

@@ -3,6 +3,7 @@ import { useNavigate } from 'react-router-dom';
 import { CardContext } from 'context/CardContext';
 import { ProfileContext } from 'context/ProfileContext';
 import { ChannelContext } from 'context/ChannelContext';
+import { StoreContext } from 'context/StoreContext';
 
 export function useChannels() {
 
@@ -26,6 +27,7 @@ export function useChannels() {
   const card = useContext(CardContext);
   const profile = useContext(ProfileContext);
   const channel = useContext(ChannelContext);
+  const store = useContext(StoreContext);
 
   const actions = {
     getCardImageUrl: card.actions.getImageUrl,
@@ -54,11 +56,27 @@ export function useChannels() {
     }
   };
 
+  const setUpdated = (chan) => {
+    let key = `${chan.id}::${chan.cardId}`
+    if (store.state[key] && store.state[key] == chan.revision) {
+      chan.updated = false;
+    }
+    else {
+      chan.updated = true;
+    }
+  }
+
+  useEffect(() => {
+    let merged = [ ...channels.current, ...cardChannels.current ];
+    merged.forEach(c => { setUpdated(c) });
+  }, [store]); 
+
   useEffect(() => {
     cardChannels.current = [];
     card.state.cards.forEach((value, key, map) => {
       cardChannels.current.push(...Array.from(value.channels.values()));
     });
+    cardChannels.current.forEach(c => { setUpdated(c) });
     let merged = [ ...channels.current, ...cardChannels.current ];
     merged.sort((a, b) => {
       if (a?.data?.channelSummary?.lastTopic?.created > b?.data?.channelSummary?.lastTopic?.created) {
@@ -71,6 +89,7 @@ export function useChannels() {
 
   useEffect(() => {
     channels.current = Array.from(channel.state.channels.values());
+    channels.current.forEach(c => { setUpdated(c) });
     let merged = [ ...channels.current, ...cardChannels.current ];
     merged.sort((a, b) => {
       if (a?.data?.channelSummary?.lastTopic?.created > b?.data?.channelSummary?.lastTopic?.created) {

net/web/src/context/useCardContext.hook.js

@@ -103,7 +103,7 @@ export function useCardContext() {
             cur.channels = new Map();
             cur.articles = new Map();
             cur.revision = 0;
-            cards.current.set(card.id, cur);
+            cards.current.set(card.id, { ...cur });
             continue;
           }
         }
@@ -112,7 +112,7 @@ export function useCardContext() {
           cur.articles = new Map();
         }
         cur.revision = card.revision;
-        cards.current.set(card.id, cur);
+        cards.current.set(card.id, { ...cur });
       }
       else {
         cards.current.delete(card.id);
@@ -149,7 +149,7 @@ export function useCardContext() {
           cur.data.topicRevision = channel.data.topicRevision;
         }
         cur.revision = channel.revision;
-        channelMap.set(channel.id, cur);
+        channelMap.set(channel.id, { ...cur });
       }
       else {
         channelMap.delete(channel.id);

net/web/src/context/useChannelContext.hook.js

@@ -56,7 +56,7 @@ export function useChannelContext() {
           cur.data.topicRevision = channel.data.topicRevision;
         }
         cur.revision = channel.revision;
-        channels.current.set(channel.id, cur);
+        channels.current.set(channel.id, { ...cur });
       }
       else {
         channels.current.delete(channel.id);