From f9af58844cddad38addc7228c73e49f49c06db37 Mon Sep 17 00:00:00 2001 From: Vincent Date: Fri, 13 Mar 2020 16:36:42 +1100 Subject: [PATCH] Broken mapStateToProps --- .../conversation/SessionConversation.tsx | 25 +++--- .../SessionConversationManager.tsx | 82 +++++++++++++++++++ .../session/conversation/SessionRecording.tsx | 13 ++- ts/state/smart/SessionConversation.tsx | 52 ++++++++---- 4 files changed, 135 insertions(+), 37 deletions(-) create mode 100644 ts/components/session/conversation/SessionConversationManager.tsx diff --git a/ts/components/session/conversation/SessionConversation.tsx b/ts/components/session/conversation/SessionConversation.tsx index b57394179..0afdc9ee6 100644 --- a/ts/components/session/conversation/SessionConversation.tsx +++ b/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; selectedMessages: Array; @@ -90,10 +92,12 @@ export class SessionConversation extends React.Component { 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 { public renderHeader() { const headerProps = this.getHeaderProps(); + console.log(`[header] Headerprops: `, headerProps); + return ( { 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 { 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 { 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 { break; } - - - } - - public getTimestamp() { - return Math.floor(Date.now() / 1000); } + } diff --git a/ts/components/session/conversation/SessionConversationManager.tsx b/ts/components/session/conversation/SessionConversationManager.tsx new file mode 100644 index 000000000..6d6461933 --- /dev/null +++ b/ts/components/session/conversation/SessionConversationManager.tsx @@ -0,0 +1,82 @@ + + +export interface MessageFetchType { + messages: Array, + messageFetchTimestamp: number, + newTopMessage: any, + previousTopMessage: any, +} + +export async function getMessages( + conversationKey: string, + currentMessages: Array, + 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; +} \ No newline at end of file diff --git a/ts/components/session/conversation/SessionRecording.tsx b/ts/components/session/conversation/SessionRecording.tsx index 0bfecd2d0..f0b067a5e 100644 --- a/ts/components/session/conversation/SessionRecording.tsx +++ b/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 { 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 { } } - render() { + public render() { const { actionHover, isPlaying, @@ -281,7 +283,7 @@ export class SessionRecording extends React.Component { } this.setState({ - nowTimestamp: this.getTimestamp() + nowTimestamp: getTimestamp() }); } @@ -317,7 +319,6 @@ export class SessionRecording extends React.Component { 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 { 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; diff --git a/ts/state/smart/SessionConversation.tsx b/ts/state/smart/SessionConversation.tsx index 063e4a485..36dc8e176 100644 --- a/ts/state/smart/SessionConversation.tsx +++ b/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 = []; + // 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,