don't mark message as read if app isn't focused

js/focus_listener.js

@@ -3,12 +3,15 @@
   'use strict';
 
   let windowFocused = false;
+  let windowFocusedListener = function() {}
   window.addEventListener('blur', () => {
     windowFocused = false;
   });
   window.addEventListener('focus', () => {
     windowFocused = true;
+    windowFocusedListener();
   });
 
   window.isFocused = () => windowFocused;
+  window.setFocusListener = (listener) => windowFocusedListener = listener;
 })();

js/read_syncs.js

@@ -59,7 +59,7 @@
         // If message is unread, we mark it read. Otherwise, we update the expiration
         //   timer to the time specified by the read sync if it's earlier than
         //   the previous read time.
-        if (message.isUnread()) {
+        if (message.isUnread() && window.isFocused()) {
           await message.markRead(readAt);
 
           // onReadMessage may result in messages older than this one being

ts/components/conversation/Message.tsx

@@ -713,7 +713,7 @@ class MessageInner extends React.PureComponent<MessageRegularProps, State> {
     const isShowingImage = this.isShowingImage();
 
     const isIncoming = direction === 'incoming';
-    const shouldMarkReadWhenVisible = isIncoming && isUnread;
+    const shouldMarkReadWhenVisible = isIncoming && isUnread && window.isFocused();
     const divClasses = ['session-message-wrapper'];
 
     if (selected) {

ts/components/session/conversation/SessionMessagesList.tsx

@@ -75,6 +75,7 @@ export class SessionMessagesList extends React.Component<Props, State> {
 
     this.messageContainerRef = this.props.messageContainerRef;
     this.ignoreScrollEvents = true;
+    window.setFocusListener(() => this.updateReadMessages());
   }
 
   // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
@@ -378,7 +379,7 @@ export class SessionMessagesList extends React.Component<Props, State> {
       return;
     }
 
-    if (this.getScrollOffsetBottomPx() === 0) {
+    if (this.getScrollOffsetBottomPx() === 0 && window.isFocused()) {
       void conversation.markRead(messages[0].attributes.received_at);
     }
   }

ts/window.d.ts

@@ -40,6 +40,8 @@ declare global {
     getFriendsFromContacts: any;
     getSettingValue: any;
     i18n: LocalizerType;
+    isFocused: any;
+    setFocusListener: (listener: any) => any;
     libloki: Libloki;
     libsignal: LibsignalProtocol;
     log: any;