From e3f33ab613a2e65c676b021ca703904ce79bc90f Mon Sep 17 00:00:00 2001
From: Tainan Felipe <tainanfelipe214@gmail.com>
Date: Mon, 9 Dec 2019 11:10:22 -0300
Subject: [PATCH] Fix row getting bigger than the message content when clear
the chat
---
.../chat/message-list/component.jsx | 27 +++++++++++++++----
1 file changed, 22 insertions(+), 5 deletions(-)
diff --git a/bigbluebutton-html5/imports/ui/components/chat/message-list/component.jsx b/bigbluebutton-html5/imports/ui/components/chat/message-list/component.jsx
index 75c6826543..d17355b9fe 100644
--- a/bigbluebutton-html5/imports/ui/components/chat/message-list/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/chat/message-list/component.jsx
@@ -42,6 +42,17 @@ const intlMessages = defineMessages({
});
class MessageList extends Component {
+ static getDerivedStateFromProps(props, state) {
+ const { messages: propMessages } = props;
+ const { messages: stateMessages } = state;
+
+ if (propMessages.length !== 3 && propMessages.length < stateMessages.length) return null;
+
+ return {
+ messages: propMessages,
+ };
+ }
+
constructor(props) {
super(props);
this.cache = new CellMeasurerCache({
@@ -63,6 +74,7 @@ class MessageList extends Component {
shouldScrollToBottom: true,
shouldScrollToPosition: false,
scrollPosition: 0,
+ messages: [],
};
this.listRef = null;
@@ -114,11 +126,10 @@ class MessageList extends Component {
return false;
}
- componentDidUpdate(prevProps) {
+ componentDidUpdate(prevProps, prevState) {
const {
scrollPosition,
chatId,
- messages,
} = this.props;
const {
scrollPosition: prevScrollPosition,
@@ -129,8 +140,9 @@ class MessageList extends Component {
shouldScrollToPosition,
scrollPosition: scrollPositionState,
shouldScrollToBottom,
+ messages,
} = this.state;
-
+ const { messages: prevMessages } = prevState;
const compareChatId = prevProps.chatId !== chatId;
if (compareChatId) {
@@ -154,6 +166,11 @@ class MessageList extends Component {
if (shouldScrollToPosition && scrollArea.scrollTop === scrollPositionState) {
this.setState({ shouldScrollToPosition: false });
}
+
+ if (prevMessages.length < messages.length) {
+ this.resizeRow(prevMessages.length - 1);
+ // messages.forEach((i, idx) => this.resizeRow(idx));
+ }
}
handleScrollUpdate(position, target) {
@@ -288,7 +305,6 @@ class MessageList extends Component {
render() {
const {
- messages,
intl,
id,
} = this.props;
@@ -297,6 +313,7 @@ class MessageList extends Component {
shouldScrollToBottom,
shouldScrollToPosition,
scrollPosition,
+ messages,
} = this.state;
const isEmpty = messages.length === 0;
@@ -334,7 +351,7 @@ class MessageList extends Component {
rowCount={messages.length}
height={height}
width={width}
- overscanRowCount={2}
+ overscanRowCount={15}
deferredMeasurementCache={this.cache}
onScroll={this.handleScrollChange}
scrollToIndex={shouldScrollToBottom ? messages.length - 1 : undefined}
--
GitLab