Broken mapStateToProps

ts/components/session/conversation/SessionConversation.tsx

@@ -9,13 +9,15 @@ import { Message } from '../../conversation/Message';
 import { FriendRequest } from '../../conversation/FriendRequest';
 import { TimerNotification } from '../../conversation/TimerNotification';
 
+import { getTimestamp } from './SessionConversationManager';
+
 
 import { SessionScrollButton } from '../SessionScrollButton';
 
 interface State {
+  conversationKey: string;
   sendingProgess: number;
   prevSendingProgess: number;
-  conversationKey: string;
   unreadCount: number;
   messages: Array<any>;
   selectedMessages: Array<string>;
@@ -90,10 +92,12 @@ export class SessionConversation extends React.Component<any, State> {
     if (this.state.isScrolledToBottom){
       this.scrollToBottom();
     }
+
+    console.log(`[update] Props: `, this.props);
   }
 
   public async componentWillReceiveProps() {
-    const timestamp = this.getTimestamp();
+    const timestamp = getTimestamp();
 
     // If we have pulled messages in the last second, don't bother rescanning
     // This avoids getting messages on every re-render.
@@ -198,6 +202,8 @@ export class SessionConversation extends React.Component<any, State> {
   public renderHeader() {
     const headerProps = this.getHeaderProps();
 
+    console.log(`[header] Headerprops: `, headerProps);
+
     return (
       <ConversationHeader
         id={headerProps.id}
@@ -334,7 +340,7 @@ export class SessionConversation extends React.Component<any, State> {
 
   public async getMessages(numMessages?: number, fetchInterval = window.CONSTANTS.MESSAGE_FETCH_INTERVAL, loopback = false){
     const { conversationKey, messageFetchTimestamp } = this.state;
-    const timestamp = this.getTimestamp();
+    const timestamp = getTimestamp();
 
     // If we have pulled messages in the last interval, don't bother rescanning
     // This avoids getting messages on every re-render.
@@ -405,10 +411,6 @@ export class SessionConversation extends React.Component<any, State> {
     if (unread) {
       const model = window.ConversationController.get(conversationKey);
       model.markRead.bind(model)(unread.attributes.received_at);
-
-      console.log(`[read] Unread:`, unread);
-      console.log(`[read] Model:`, model);
-      
     }
   }
 
@@ -528,6 +530,8 @@ export class SessionConversation extends React.Component<any, State> {
     const {conversationKey} = this.state;
     const conversation = window.getConversationByKey(conversationKey);
 
+    console.log(`[header] Conversation`, conversation);
+
     const expireTimer = conversation.get('expireTimer');
     const expirationSettingName = expireTimer
       ? window.Whisper.ExpirationTimerOptions.getName(expireTimer || 0)
@@ -768,13 +772,8 @@ export class SessionConversation extends React.Component<any, State> {
         break;
     }
 
-
-
-  }
-
-  public getTimestamp() {
-    return Math.floor(Date.now() / 1000);
   }
+  
 }
 
 

ts/components/session/conversation/SessionConversationManager.tsx

@@ -0,0 +1,82 @@
+
+
+export interface MessageFetchType {
+    messages: Array<any>,
+    messageFetchTimestamp: number,
+    newTopMessage: any,
+    previousTopMessage: any,
+}
+
+export async function getMessages(
+    conversationKey: string,
+    currentMessages: Array<any>,
+    messageFetchTimestamp: number,
+    unreadCount: number,
+    onGotMessages?: any,
+    numMessages?: number,
+    fetchInterval = window.CONSTANTS.MESSAGE_FETCH_INTERVAL,
+    loopback = false,
+    ){
+
+    const timestamp = getTimestamp();
+
+    // If we have pulled messages in the last interval, don't bother rescanning
+    // This avoids getting messages on every re-render.
+    const timeBuffer = timestamp - messageFetchTimestamp;
+    if (timeBuffer < fetchInterval) {
+      // Loopback gets messages after time has elapsed,
+      // rather than completely cancelling the fetch.
+      // if (loopback) {
+      //   setTimeout(() => {
+      //     this.getMessages(numMessages, fetchInterval, false);
+      //   }, timeBuffer * 1000);
+      // }      
+
+      return { newTopMessage: undefined, previousTopMessage: undefined };
+    }
+
+    let msgCount = numMessages || window.CONSTANTS.DEFAULT_MESSAGE_FETCH_COUNT + unreadCount;
+    msgCount = msgCount > window.CONSTANTS.MAX_MESSAGE_FETCH_COUNT
+      ? window.CONSTANTS.MAX_MESSAGE_FETCH_COUNT
+      : msgCount;
+
+    const messageSet = await window.Signal.Data.getMessagesByConversation(
+      conversationKey,
+      { limit: msgCount, MessageCollection: window.Whisper.MessageCollection },
+    );
+
+    // Set first member of series here.
+    const messageModels = messageSet.models;
+    const messages = [];
+    let previousSender;
+    for (let i = 0; i < messageModels.length; i++){
+      // Handle firstMessageOfSeries for conditional avatar rendering
+      let firstMessageOfSeries = true;
+      if (i > 0 && previousSender === messageModels[i].authorPhoneNumber){
+        firstMessageOfSeries = false;
+      }
+
+      messages.push({...messageModels[i], firstMessageOfSeries});
+      previousSender = messageModels[i].authorPhoneNumber;
+    }
+
+    const previousTopMessage = currentMessages[0]?.id;
+    const newTopMessage = messages[0]?.id;
+
+    messageFetchTimestamp = getTimestamp();
+
+    // Callback to onGotMessages
+    if (onGotMessages) onGotMessages(
+        messages,
+        messageFetchTimestamp,
+        previousTopMessage,
+        newTopMessage,
+    );
+
+    return { newTopMessage, previousTopMessage };
+  }
+
+export function getTimestamp(asInt = false){
+    const timestamp = Date.now() / 1000;
+    return asInt ? Math.floor(timestamp) : timestamp;
+}

ts/components/session/conversation/SessionRecording.tsx

@@ -2,6 +2,8 @@ import React from 'react';
 import classNames from 'classnames';
 import moment from 'moment';
 
+import { getTimestamp } from './SessionConversationManager';
+
 import {  SessionIconButton, SessionIconSize, SessionIconType } from '../icon';
 import { SessionButton, SessionButtonType, SessionButtonColor } from '../SessionButton';
 
@@ -83,7 +85,7 @@ export class SessionRecording extends React.Component<Props, State> {
     this.onKeyDown = this.onKeyDown.bind(this);
     this.updateCanvasDimensions = this.updateCanvasDimensions.bind(this);
 
-    const now = this.getTimestamp();
+    const now = getTimestamp();
     const updateTimerInterval = setInterval(this.timerUpdate, 500);
     
     this.state = {
@@ -144,7 +146,7 @@ export class SessionRecording extends React.Component<Props, State> {
     }
   }
 
-  render() {
+  public render() {
     const {
       actionHover,
       isPlaying,
@@ -281,7 +283,7 @@ export class SessionRecording extends React.Component<Props, State> {
     }
 
     this.setState({
-      nowTimestamp: this.getTimestamp()
+      nowTimestamp: getTimestamp()
     });
   }
 
@@ -317,7 +319,6 @@ export class SessionRecording extends React.Component<Props, State> {
 
       audioElement.oncanplaythrough = () => {
         const duration = recordDuration;
-        const progress = recordDuration - audioElement.currentTime;
 
         if (duration && audioElement.currentTime < duration) {
           audioElement.play();
@@ -668,10 +669,6 @@ export class SessionRecording extends React.Component<Props, State> {
     ctx.fill();
   }
 
-  private getTimestamp(){
-    return Number(moment().format('x')) / 1000;
-  }
-
   private updateCanvasDimensions(){
     const canvas = this.visualisationCanvas.current || this.playbackCanvas.current;
     const width = canvas?.clientWidth || 0;

ts/state/smart/SessionConversation.tsx

@@ -3,22 +3,42 @@ import { mapDispatchToProps } from '../actions';
 import { SessionConversation } from '../../components/session/conversation/SessionConversation';
 import { StateType } from '../reducer';
 
-import { getQuery, getSearchResults, isSearching } from '../selectors/search';
-import {
-  getIntl,
-  getIsSecondaryDevice,
-  getRegionCode,
-  getUserNumber,
-} from '../selectors/user';
-
-const mapStateToProps = (state: StateType) => {
-  //const conversationInfo = getSessionConversationInfo(state);
-
-  // console.log(`[vince] stateToProps from SessionConversation:`, conversationInfo);
-  // console.log(`[vince] stateToProps from SessionConversation:`, state);
-
-  // You only want to rerender SessionConversation if the CURRENT conversation updates
-  // Use SelectedConversationChangedActionType FROM actions.ts
+const mapStateToProps = async (state: StateType) => {
+  // Get messages here!!!!!
+
+
+  // FIXME VINCE: Get messages for all conversations, not just this one
+  // Store as object of objects with key refs
+
+  // console.log(`[update] State from dispatch:`, state);
+
+
+  // const message: Array<any> = [];
+  // if(state.conversations) {
+  //   const conversationKey = state.conversations.selectedConversation;
+  
+  //   // FIXME VINCE: msgCount should not be a magic number
+  //   const msgCount = 30;
+
+  //   const messageSet = await window.Signal.Data.getMessagesByConversation(
+  //     conversationKey,
+  //     { limit: msgCount, MessageCollection: window.Whisper.MessageCollection },
+  //   );
+
+  //   const messageModels = messageSet.models;
+  //   let previousSender;
+  //   for (let i = 0; i < messageModels.length; i++){
+  //     // Handle firstMessageOfSeries for conditional avatar rendering
+  //     let firstMessageOfSeries = true;
+  //     if (i > 0 && previousSender === messageModels[i].authorPhoneNumber){
+  //       firstMessageOfSeries = false;
+  //     }
+
+  //     messages.push({...messageModels[i], firstMessageOfSeries});
+  //     previousSender = messageModels[i].authorPhoneNumber;
+  //   }
+  // }
+  
 
   return {
     conversations: state.conversations,