From 522d745c7777ea7cc04c20a60a64f9a2959755c8 Mon Sep 17 00:00:00 2001
From: Rajat Parashar <parasharrajat@users.noreply.github.com>
Date: Fri, 23 Apr 2021 03:46:53 +0530
Subject: [PATCH 1/2] fix: Unread messages are not being marked bold when on
LHN
---
src/pages/home/report/ReportActionsView.js | 34 +++++++++++++---------
1 file changed, 21 insertions(+), 13 deletions(-)
diff --git a/src/pages/home/report/ReportActionsView.js b/src/pages/home/report/ReportActionsView.js
index 347dd3d5ee48..a988a4d5d79b 100644
--- a/src/pages/home/report/ReportActionsView.js
+++ b/src/pages/home/report/ReportActionsView.js
@@ -26,6 +26,9 @@ import Visibility from '../../../libs/Visibility';
import Timing from '../../../libs/actions/Timing';
import CONST from '../../../CONST';
import themeColors from '../../../styles/themes/default';
+import Navigation from '../../../libs/Navigation/Navigation';
+import compose from '../../../libs/compose';
+import withWindowDimensions, {windowDimensionsPropTypes} from '../../../components/withWindowDimensions';
const propTypes = {
// The ID of the report actions will be created for
@@ -50,6 +53,8 @@ const propTypes = {
// Email of the logged in person
email: PropTypes.string,
}),
+
+ ...windowDimensionsPropTypes,
};
const defaultProps = {
@@ -121,7 +126,7 @@ class ReportActionsView extends React.Component {
// When the last action changes, wait three seconds, then record the max action
// This will make the unread indicator go away if you receive comments in the same chat you're looking at
- if (Visibility.isVisible()) {
+ if (Visibility.isVisible() && !(Navigation.isDrawerOpen() && this.props.isSmallScreenWidth)) {
this.timers.push(setTimeout(this.recordMaxAction, 3000));
}
}
@@ -327,15 +332,18 @@ class ReportActionsView extends React.Component {
ReportActionsView.propTypes = propTypes;
ReportActionsView.defaultProps = defaultProps;
-export default withOnyx({
- report: {
- key: ({reportID}) => `${ONYXKEYS.COLLECTION.REPORT}${reportID}`,
- },
- reportActions: {
- key: ({reportID}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`,
- canEvict: false,
- },
- session: {
- key: ONYXKEYS.SESSION,
- },
-})(ReportActionsView);
+export default compose(
+ withWindowDimensions,
+ withOnyx({
+ report: {
+ key: ({reportID}) => `${ONYXKEYS.COLLECTION.REPORT}${reportID}`,
+ },
+ reportActions: {
+ key: ({reportID}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`,
+ canEvict: false,
+ },
+ session: {
+ key: ONYXKEYS.SESSION,
+ },
+ }),
+)(ReportActionsView);
From 994b2002543cd9545033ee3cb5a9a5688db18dc1 Mon Sep 17 00:00:00 2001
From: Rajat Parashar <parasharrajat@users.noreply.github.com>
Date: Fri, 23 Apr 2021 22:14:17 +0530
Subject: [PATCH 2/2] fix: Messages not marked as read when swtiching from LHN
to report
---
src/pages/home/report/ReportActionsView.js | 38 ++++++++++++++++++++--
1 file changed, 35 insertions(+), 3 deletions(-)
diff --git a/src/pages/home/report/ReportActionsView.js b/src/pages/home/report/ReportActionsView.js
index a988a4d5d79b..3d3c58da45e5 100644
--- a/src/pages/home/report/ReportActionsView.js
+++ b/src/pages/home/report/ReportActionsView.js
@@ -26,9 +26,9 @@ import Visibility from '../../../libs/Visibility';
import Timing from '../../../libs/actions/Timing';
import CONST from '../../../CONST';
import themeColors from '../../../styles/themes/default';
-import Navigation from '../../../libs/Navigation/Navigation';
import compose from '../../../libs/compose';
import withWindowDimensions, {windowDimensionsPropTypes} from '../../../components/withWindowDimensions';
+import withDrawerState, {withDrawerPropTypes} from '../../../components/withDrawerState';
const propTypes = {
// The ID of the report actions will be created for
@@ -55,6 +55,7 @@ const propTypes = {
}),
...windowDimensionsPropTypes,
+ ...withDrawerPropTypes,
};
const defaultProps = {
@@ -76,6 +77,7 @@ class ReportActionsView extends React.Component {
this.recordMaxAction = this.recordMaxAction.bind(this);
this.onVisibilityChange = this.onVisibilityChange.bind(this);
this.loadMoreChats = this.loadMoreChats.bind(this);
+ this.startRecordMaxActionTimer = this.startRecordMaxActionTimer.bind(this);
this.sortedReportActions = [];
this.timers = [];
@@ -109,6 +111,14 @@ class ReportActionsView extends React.Component {
return true;
}
+ if (this.props.isSmallScreenWidth !== nextProps.isSmallScreenWidth) {
+ return true;
+ }
+
+ if (this.props.isDrawerOpen !== nextProps.isDrawerOpen) {
+ return true;
+ }
+
return false;
}
@@ -116,6 +126,9 @@ class ReportActionsView extends React.Component {
// The last sequenceNumber of the same report has changed.
const previousLastSequenceNumber = lodashGet(lastItem(prevProps.reportActions), 'sequenceNumber');
const currentLastSequenceNumber = lodashGet(lastItem(this.props.reportActions), 'sequenceNumber');
+ const shouldRecordMaxAction = Visibility.isVisible()
+ && !(this.props.isDrawerOpen && this.props.isSmallScreenWidth);
+
if (previousLastSequenceNumber !== currentLastSequenceNumber) {
// If a new comment is added and it's from the current user scroll to the bottom otherwise
// leave the user positioned where they are now in the list.
@@ -126,10 +139,19 @@ class ReportActionsView extends React.Component {
// When the last action changes, wait three seconds, then record the max action
// This will make the unread indicator go away if you receive comments in the same chat you're looking at
- if (Visibility.isVisible() && !(Navigation.isDrawerOpen() && this.props.isSmallScreenWidth)) {
- this.timers.push(setTimeout(this.recordMaxAction, 3000));
+ if (shouldRecordMaxAction) {
+ this.startRecordMaxActionTimer();
}
}
+
+ // We want to mark the unread comments when user resize the screen to desktop
+ // Or user move back to report from LHN
+ if (shouldRecordMaxAction && (
+ prevProps.isDrawerOpen !== this.props.isDrawerOpen
+ || prevProps.isSmallScreenWidth !== this.props.isSmallScreenWidth
+ )) {
+ this.startRecordMaxActionTimer();
+ }
}
componentWillUnmount() {
@@ -152,6 +174,15 @@ class ReportActionsView extends React.Component {
}
}
+ /**
+ * Set a timer for recording the max action
+ *
+ * @memberof ReportActionsView
+ */
+ startRecordMaxActionTimer() {
+ this.timers.push(setTimeout(this.recordMaxAction, 3000));
+ }
+
/**
* Retrieves the next set of report actions for the chat once we are nearing the end of what we are currently
* displaying.
@@ -334,6 +365,7 @@ ReportActionsView.defaultProps = defaultProps;
export default compose(
withWindowDimensions,
+ withDrawerState,
withOnyx({
report: {
key: ({reportID}) => `${ONYXKEYS.COLLECTION.REPORT}${reportID}`,