From 387f8ff3910521c6054c9241f2b3692599b2754b Mon Sep 17 00:00:00 2001 From: Audric Ackermann Date: Thu, 29 Oct 2020 16:23:25 +1100 Subject: [PATCH] Update props of SessionConversation to only get the currently selected convo --- js/models/conversations.js | 1 + stylesheets/_conversation.scss | 1 - .../conversation/SessionConversation.tsx | 57 +++++++------------ .../SessionConversationMessagesList.tsx | 28 +++------ ts/state/ducks/conversations.ts | 1 + ts/state/smart/SessionConversation.tsx | 9 ++- 6 files changed, 37 insertions(+), 60 deletions(-) diff --git a/js/models/conversations.js b/js/models/conversations.js index 59861d90c..ec189c891 100644 --- a/js/models/conversations.js +++ b/js/models/conversations.js @@ -1556,6 +1556,7 @@ Message: Whisper.Message, }); message.set({ id }); + await this.commit(); // if change was made remotely, don't send it to the number/group if (receivedAt) { diff --git a/stylesheets/_conversation.scss b/stylesheets/_conversation.scss index 5df211c42..9d59135da 100644 --- a/stylesheets/_conversation.scss +++ b/stylesheets/_conversation.scss @@ -141,7 +141,6 @@ align-self: flex-end; } - .typing-bubble-wrapper { margin-bottom: 20px; } diff --git a/ts/components/session/conversation/SessionConversation.tsx b/ts/components/session/conversation/SessionConversation.tsx index 75ac52e4b..2787b1b1c 100644 --- a/ts/components/session/conversation/SessionConversation.tsx +++ b/ts/components/session/conversation/SessionConversation.tsx @@ -26,7 +26,7 @@ import { AttachmentType, save } from '../../../types/Attachment'; import { ToastUtils } from '../../../session/utils'; import * as MIME from '../../../types/MIME'; import { SessionFileDropzone } from './SessionFileDropzone'; -import { PubKey } from '../../../session/types'; +import { ConversationType } from '../../../state/ducks/conversations'; interface State { conversationKey: string; @@ -48,7 +48,6 @@ interface State { isScrolledToBottom: boolean; doneInitialScroll: boolean; displayScrollToBottomButton: boolean; - messageFetchTimestamp: number; showOverlay: boolean; showRecordingView: boolean; @@ -69,7 +68,8 @@ interface State { } interface Props { - conversations: any; + conversationKey: string; + conversation: ConversationType; theme: DefaultTheme; } @@ -81,13 +81,13 @@ export class SessionConversation extends React.Component { constructor(props: any) { super(props); - const conversationKey = this.props.conversations.selectedConversation; - const conversation = this.props.conversations.conversationLookup[ - conversationKey - ]; + const { conversationKey } = this.props; - const unreadCount = conversation.unreadCount; + const conversationModel = window.ConversationController.getOrThrow( + conversationKey + ); + const unreadCount = conversationModel.get('unreadCount'); this.state = { messageProgressVisible: false, sendingProgress: 0, @@ -101,7 +101,6 @@ export class SessionConversation extends React.Component { isScrolledToBottom: !unreadCount, doneInitialScroll: false, displayScrollToBottomButton: false, - messageFetchTimestamp: 0, showOverlay: false, showRecordingView: false, showOptionsPane: false, @@ -135,7 +134,10 @@ export class SessionConversation extends React.Component { this.replyToMessage = this.replyToMessage.bind(this); this.onClickAttachment = this.onClickAttachment.bind(this); this.downloadAttachment = this.downloadAttachment.bind(this); - this.getMessages = this.getMessages.bind(this); + this.getMessages = _.throttle( + this.getMessages.bind(this), + 1000 // one second + ); // Keyboard navigation this.onKeyDown = this.onKeyDown.bind(this); @@ -152,15 +154,11 @@ export class SessionConversation extends React.Component { this.handleDrag = this.handleDrag.bind(this); this.handleDrop = this.handleDrop.bind(this); - const conversationModel = window.ConversationController.getOrThrow( - this.state.conversationKey - ); conversationModel.on('change', () => { // reload as much messages as we had before the change. void this.getMessages( this.state.messages.length || - Constants.CONVERSATION.DEFAULT_MESSAGE_FETCH_COUNT, - 2 + Constants.CONVERSATION.DEFAULT_MESSAGE_FETCH_COUNT ); }); } @@ -214,9 +212,7 @@ export class SessionConversation extends React.Component { } = this.state; const selectionMode = !!selectedMessages.length; - const conversation = this.props.conversations.conversationLookup[ - conversationKey - ]; + const { conversation } = this.props; const conversationModel = window.ConversationController.getOrThrow( conversationKey ); @@ -343,28 +339,15 @@ export class SessionConversation extends React.Component { ); const messages = messageSet.models; - const messageFetchTimestamp = Date.now(); - this.setState({ messages, messageFetchTimestamp }, () => { + this.setState({ messages }, () => { // Add new messages to conversation collection conversationModel.messageCollection = messageSet; }); } - public async getMessages( - numMessages?: number, - fetchInterval = Constants.CONVERSATION.MESSAGE_FETCH_INTERVAL - ) { - const { conversationKey, messageFetchTimestamp } = this.state; - - const timestamp = Date.now(); - - // 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 / 1000 < fetchInterval) { - return { newTopMessage: undefined, previousTopMessage: undefined }; - } + public async getMessages(numMessages?: number) { + const { conversationKey } = this.state; let msgCount = numMessages || @@ -400,7 +383,7 @@ export class SessionConversation extends React.Component { const previousTopMessage = this.state.messages[oldLen - 1]?.id; const newTopMessage = messages[newLen - 1]?.id; - this.setState({ messages, messageFetchTimestamp: timestamp }); + this.setState({ messages }); return { newTopMessage, previousTopMessage }; } @@ -801,13 +784,11 @@ export class SessionConversation extends React.Component { private async replyToMessage(quotedMessageTimestamp?: number) { if (!_.isEqual(this.state.quotedMessageTimestamp, quotedMessageTimestamp)) { const { conversationKey } = this.state; + const { conversation } = this.props; const conversationModel = window.ConversationController.getOrThrow( conversationKey ); - const conversation = this.props.conversations.conversationLookup[ - conversationKey - ]; let quotedMessageProps = null; if (quotedMessageTimestamp) { const quotedMessageModel = conversationModel.getMessagesWithTimestamp( diff --git a/ts/components/session/conversation/SessionConversationMessagesList.tsx b/ts/components/session/conversation/SessionConversationMessagesList.tsx index 79c160433..6a8df11a2 100644 --- a/ts/components/session/conversation/SessionConversationMessagesList.tsx +++ b/ts/components/session/conversation/SessionConversationMessagesList.tsx @@ -21,16 +21,12 @@ interface Props { selectedMessages: Array; conversationKey: string; messages: Array; - resetSelection: () => any; initialFetchComplete: boolean; conversationModel: ConversationModel; conversation: any; messageContainerRef: React.RefObject; selectMessage: (messageId: string) => void; - getMessages: ( - numMessages: number, - interval: number - ) => Promise<{ previousTopMessage: string }>; + getMessages: (numMessages: number) => Promise<{ previousTopMessage: string }>; replyToMessage: (messageId: number) => Promise; onClickAttachment: (attachment: any, message: any) => void; onDownloadAttachment: ({ attachment }: { attachment: any }) => void; @@ -68,12 +64,6 @@ export class SessionConversationMessagesList extends React.Component< public componentDidMount() { // Pause thread to wait for rendering to complete setTimeout(this.scrollToUnread, 0); - setTimeout(() => { - this.setState({ - doneInitialScroll: true, - }); - }, 100); - this.updateReadMessages(); } @@ -335,11 +325,8 @@ export class SessionConversationMessagesList extends React.Component< this.props.messages.length + Constants.CONVERSATION.DEFAULT_MESSAGE_FETCH_COUNT; - // Prevent grabbing messags with scroll more frequently than once per 2s. - const messageFetchInterval = 2; - const previousTopMessage = ( - await this.props.getMessages(numMessages, messageFetchInterval) - )?.previousTopMessage; + const previousTopMessage = (await this.props.getMessages(numMessages)) + ?.previousTopMessage; if (previousTopMessage) { this.scrollToMessage(previousTopMessage); @@ -354,6 +341,11 @@ export class SessionConversationMessagesList extends React.Component< if (message) { this.scrollToMessage(message.id); } + if (!this.state.doneInitialScroll) { + this.setState({ + doneInitialScroll: true, + }); + } } public scrollToMessage(messageId: string) { @@ -381,8 +373,4 @@ export class SessionConversationMessagesList extends React.Component< public selectMessage(messageId: string) { this.props.selectMessage(messageId); } - - public resetSelection() { - this.props.resetSelection(); - } } diff --git a/ts/state/ducks/conversations.ts b/ts/state/ducks/conversations.ts index ed24d82ee..cc96a530a 100644 --- a/ts/state/ducks/conversations.ts +++ b/ts/state/ducks/conversations.ts @@ -46,6 +46,7 @@ export type ConversationType = { type: 'direct' | 'group'; isMe: boolean; isPublic?: boolean; + isRss?: boolean; isClosable?: boolean; lastUpdated: number; unreadCount: number; diff --git a/ts/state/smart/SessionConversation.tsx b/ts/state/smart/SessionConversation.tsx index 0d274fde0..071cf158d 100644 --- a/ts/state/smart/SessionConversation.tsx +++ b/ts/state/smart/SessionConversation.tsx @@ -37,8 +37,15 @@ const mapStateToProps = (state: StateType) => { // } // } + const conversationKey = state.conversations.selectedConversation; + const conversation = + (conversationKey && + state.conversations.conversationLookup[conversationKey]) || + null; + return { - conversations: state.conversations, + conversation, + conversationKey, theme: state.theme, }; };