From 8ed7141ae634e172fdef062604625b7536100349 Mon Sep 17 00:00:00 2001
From: Roland Osborne <roland.osborne@gmail.com>
Date: Wed, 24 Aug 2022 23:13:30 -0700
Subject: [PATCH] updating thread timestamp and listing results

---
 .../conversation/topicItem/TopicItem.jsx      | 27 +------------------
 .../topicItem/useTopicItem.hook.js            | 15 +++++++++--
 .../listingItem/useListingItem.hook.js        | 11 +++++---
 .../src/session/listing/useListing.hook.js    |  4 +++
 net/web/src/session/welcome/Welcome.styled.js |  1 +
 5 files changed, 27 insertions(+), 31 deletions(-)

diff --git a/net/web/src/session/conversation/topicItem/TopicItem.jsx b/net/web/src/session/conversation/topicItem/TopicItem.jsx
index 31012499..5cec40ca 100644
--- a/net/web/src/session/conversation/topicItem/TopicItem.jsx
+++ b/net/web/src/session/conversation/topicItem/TopicItem.jsx
@@ -16,9 +16,6 @@ export function TopicItem({ host, topic }) {
 
   let name = state.name ? state.name : state.handle;
   let nameClass = state.name ? 'set' : 'unset';
-  let d = new Date();
-  let offset = d.getTime() / 1000 - state.created;
-  
   if (name == null) {
     name = "unknown contact"
     nameClass = "unknown"
@@ -104,7 +101,7 @@ export function TopicItem({ host, topic }) {
         </div>
         <div class="info">
           <div class={nameClass}>{ name }</div>
-          <div>{ getTime(offset) }</div>
+          <div>{ state.created }</div>
         </div>
       </div>
       { !state.confirmed && (
@@ -136,25 +133,3 @@ export function TopicItem({ host, topic }) {
   )
 }
 
-function getTime(offset) {
-  if (offset < 1) {
-    return ''
-  }
-  if (offset < 60) {
-    return Math.floor(offset) + "s";
-  }
-  offset /= 60;
-  if (offset < 60) {
-    return Math.floor(offset) + "m";
-  }
-  offset /= 60;
-  if (offset < 24) {
-    return Math.floor(offset) + "h";
-  }
-  offset /= 24;
-  if (offset < 366) {
-    return Math.floor(offset) + "d";
-  }
-  offset /= 365.25;
-  return Math.floor(offset) + "y";
-}
diff --git a/net/web/src/session/conversation/topicItem/useTopicItem.hook.js b/net/web/src/session/conversation/topicItem/useTopicItem.hook.js
index 1b725476..aac2698d 100644
--- a/net/web/src/session/conversation/topicItem/useTopicItem.hook.js
+++ b/net/web/src/session/conversation/topicItem/useTopicItem.hook.js
@@ -81,13 +81,24 @@ export function useTopicItem(topic) {
 
     if (profile.state.init && card.state.init && conversation.state.init) {
       const { guid, created } = topic.data.topicDetail;
+
+      let createdStr;
+      const date = new Date(created * 1000);
+      const now = new Date();
+      if(now.getTime() - date.getTime() < 86400000) {
+        createdStr = date.toLocaleTimeString([], {hour: 'numeric', minute:'2-digit'});
+      }
+      else {
+        createdStr = date.toLocaleDateString("en-US");
+      }
+
       if (profile.state.profile.guid == guid) {
         const { name, handle, imageUrl } = profile.actions.getProfile();
-        updateState({ name, handle, imageUrl, status, message, transform, assets, confirmed, error, ready, created, owner, textColor, textSize });
+        updateState({ name, handle, imageUrl, status, message, transform, assets, confirmed, error, ready, created: createdStr, owner, textColor, textSize });
       }
       else {
         const { name, handle, imageUrl } = card.actions.getCardProfileByGuid(guid);
-        updateState({ name, handle, imageUrl, status, message, transform, assets, confirmed, error, ready, created, owner, textColor, textSize });
+        updateState({ name, handle, imageUrl, status, message, transform, assets, confirmed, error, ready, created: createdStr, owner, textColor, textSize });
       }
     }
   }, [profile, card, conversation, topic]);
diff --git a/net/web/src/session/listing/listingItem/useListingItem.hook.js b/net/web/src/session/listing/listingItem/useListingItem.hook.js
index 6989ce33..f9af9e88 100644
--- a/net/web/src/session/listing/listingItem/useListingItem.hook.js
+++ b/net/web/src/session/listing/listingItem/useListingItem.hook.js
@@ -4,15 +4,20 @@ import { getListingImageUrl } from 'api/getListingImageUrl';
 export function useListingItem(server, item) {
 
   const [state, setState] = useState({
-    logo: item.imageSet ? getListingImageUrl(server, item.guid) : null,
-    name: item.name,
-    handle: item.handle,
   });
 
   const updateState = (value) => {
     setState((s) => ({ ...s, ...value }));
   }
 
+  useEffect(() => {
+    updateState({
+      logo: item.imageSet ? getListingImageUrl(server, item.guid) : null,
+      name: item.name,
+      handle: item.handle,
+    });
+  }, [server, item]);
+
   const actions = {
   };
 
diff --git a/net/web/src/session/listing/useListing.hook.js b/net/web/src/session/listing/useListing.hook.js
index 9d0ac85a..4199eb75 100644
--- a/net/web/src/session/listing/useListing.hook.js
+++ b/net/web/src/session/listing/useListing.hook.js
@@ -20,6 +20,10 @@ export function useListing() {
     setState((s) => ({ ...s, ...value }));
   }
 
+  useEffect(() => {
+    updateState({ contacts: [] });
+  }, [state.node]);
+
   const actions = {
     onNode: (value) => {
       updateState({ node: value });
diff --git a/net/web/src/session/welcome/Welcome.styled.js b/net/web/src/session/welcome/Welcome.styled.js
index 1bbba8b9..299d3a73 100644
--- a/net/web/src/session/welcome/Welcome.styled.js
+++ b/net/web/src/session/welcome/Welcome.styled.js
@@ -20,6 +20,7 @@ export const WelcomeWrapper = styled.div`
 
     .header {
       font-weight: bold;
+      font-size: 20px;
     }
   }