From df104db8cda023fe5939016a24086b236c3cebd5 Mon Sep 17 00:00:00 2001
From: Matilde Park <matilde.park@sunshinegardens.org>
Date: Thu, 6 Aug 2020 16:44:45 -0400
Subject: [PATCH] publish: send reads on nav, distinguish unreads

---
 .../src/apps/publish/components/lib/note.js   | 21 ++++++++++++-------
 .../publish/components/lib/notebook-posts.js  |  2 +-
 2 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/pkg/interface/src/apps/publish/components/lib/note.js b/pkg/interface/src/apps/publish/components/lib/note.js
index 01433fb9e..de1e55aa9 100644
--- a/pkg/interface/src/apps/publish/components/lib/note.js
+++ b/pkg/interface/src/apps/publish/components/lib/note.js
@@ -12,7 +12,8 @@ export class Note extends Component {
   constructor(props) {
     super(props);
     this.state = {
-      deleting: false
+      deleting: false,
+      sentRead: false
     };
     moment.updateLocale('en', {
       relativeTime: {
@@ -46,16 +47,19 @@ export class Note extends Component {
   }
 
   componentDidUpdate(prevProps) {
-    const { props } = this;
+    const { props, state } = this;
     if ((prevProps && prevProps.api !== props.api) || props.api) {
       if (!(props.notebooks[props.ship]?.[props.book]?.notes?.[props.note]?.file)) {
         props.api.publish.fetchNote(props.ship, props.book, props.note);
       }
 
-      if (prevProps) {
-        if ((prevProps.book !== props.book) ||
-          (prevProps.note !== props.note) ||
-          (prevProps.ship !== props.ship)) {
+      if (prevProps && prevProps.note !== props.note) {
+        this.setState({ sentRead: false });
+      }
+
+      if (!state.sentRead &&
+        props.notebooks?.[props.ship]?.[props.book]?.notes?.[props.note] &&
+        !props.notebooks[props.ship][props.book].notes[props.note].read) {
           const readAction = {
             read: {
               who: props.ship.slice(1),
@@ -63,9 +67,10 @@ export class Note extends Component {
               note: props.note
             }
           };
-          props.api.publish.publishAction(readAction);
+          this.setState({ sentRead: true }, () => {
+            props.api.publish.publishAction(readAction);
+          });
         }
-      }
     }
   }
 
diff --git a/pkg/interface/src/apps/publish/components/lib/notebook-posts.js b/pkg/interface/src/apps/publish/components/lib/notebook-posts.js
index a07171d91..ee8ee3fb5 100644
--- a/pkg/interface/src/apps/publish/components/lib/notebook-posts.js
+++ b/pkg/interface/src/apps/publish/components/lib/notebook-posts.js
@@ -84,7 +84,7 @@ export class NotebookPosts extends Component {
                ' gray2 mr3'}
                title={note.author}
               >{name}</div>
-              <div className="gray2 mr3">{date}</div>
+              <div className={((note.read) ? "gray2 " : "green2 ") + "mr3"}>{date}</div>
               <div className="gray2">{comment}</div>
             </div>
           </div>