Onload scroll to unread

preload.js

@@ -61,6 +61,7 @@ window.isBeforeVersion = (toCheck, baseVersion) => {
 };
 
 window.CONSTANTS = {
+  SECS_IN_DAY: 60*60*24,
   MAX_LOGIN_TRIES: 3,
   MAX_PASSWORD_LENGTH: 32,
   MAX_USERNAME_LENGTH: 20,

stylesheets/_session_theme.scss

@@ -41,7 +41,7 @@
       @include session-color-subtle($session-color-white);
     }
     @at-root .dark-theme #{&} {
-      background-color: $session-shade-8;
+      background-color: $session-shade-5;
     }
   }
 

ts/components/conversation/Timestamp.tsx

@@ -56,6 +56,15 @@ export class Timestamp extends React.Component<Props> {
       return null;
     }
 
+    // Use relative time for under 24hrs ago.
+    const now = Math.floor(Date.now());
+    const messageAgeInDays = (now - timestamp) / (1000 * window.CONSTANTS.SECS_IN_DAY);
+    const daysBeforeRelativeTiming = 1;
+    
+    const dateString = messageAgeInDays > daysBeforeRelativeTiming
+      ? formatRelativeTime(timestamp, { i18n, extended })
+      : moment(timestamp).fromNow();
+
     return (
       <span
         className={classNames(
@@ -65,7 +74,7 @@ export class Timestamp extends React.Component<Props> {
         )}
         title={moment(timestamp).format('llll')}
       >
-        {formatRelativeTime(timestamp, { i18n, extended })}
+        {dateString}
       </span>
     );
   }

ts/components/session/SessionConversation.tsx

@@ -139,9 +139,8 @@ export class SessionConversation extends React.Component<any, State> {
 
   public renderMessages() {
     const { messages } = this.state;
-    
-    // IF MESSAGE IS THE TOP OF UNREAD, THEN INSERT AN UNREAD BANNER
 
+    // FIXME VINCE: IF MESSAGE IS THE TOP OF UNREAD, THEN INSERT AN UNREAD BANNER
 
     return (
       <>{
@@ -218,8 +217,6 @@ export class SessionConversation extends React.Component<any, State> {
   }
 
 
-  
-
   public renderMessage(messageProps: any, firstMessageOfSeries: boolean, quoteProps?: any) {
 
     return (
@@ -311,8 +308,8 @@ export class SessionConversation extends React.Component<any, State> {
 
     // If we have pulled messages in the last interval, don't bother rescanning
     // This avoids getting messages on every re-render.
-    if (timestamp >= messageFetchTimestamp + fetchInterval) {
+    if (timestamp - messageFetchTimestamp < fetchInterval) {
-      return;
+      return { newTopMessage: undefined, previousTopMessage: undefined };
     }
 
     const msgCount = numMessages || window.CONSTANTS.DEFAULT_MESSAGE_FETCH_COUNT + this.state.unreadCount;
@@ -341,9 +338,6 @@ export class SessionConversation extends React.Component<any, State> {
 
     this.setState({ messages, messageFetchTimestamp });
 
-    console.log(`[vince][messages] Previous Top Message: `, previousTopMessage);
-    console.log(`[vince][messages] New Top Message: `, newTopMessage);
-
     return { newTopMessage, previousTopMessage };
   }
 
@@ -373,9 +367,9 @@ export class SessionConversation extends React.Component<any, State> {
       const numMessages = this.state.messages.length + window.CONSTANTS.DEFAULT_MESSAGE_FETCH_COUNT;
       
       // Prevent grabbing messags with scroll more frequently than once per 5s.
-      // const messageFetchInterval = 5;
+      const messageFetchInterval = 5;
-      // const previousTopMessage = (await this.getMessages(numMessages, messageFetchInterval))?.previousTopMessage;
+      const previousTopMessage = (await this.getMessages(numMessages, messageFetchInterval))?.previousTopMessage;
-      // this.scrollToMessage(previousTopMessage);
+      previousTopMessage && this.scrollToMessage(previousTopMessage);
     }
   }
 
@@ -391,7 +385,7 @@ export class SessionConversation extends React.Component<any, State> {
     topUnreadMessage?.scrollIntoView();
   }
 
-  public scrollToBottom(firstLoad = false) {
+  public scrollToBottom(instant = false) {
     // FIXME VINCE: Smooth scrolling that isn't slow@!
     // this.messagesEndRef.current?.scrollIntoView(
     //   { behavior: firstLoad ? 'auto' : 'smooth' }