From fab750614102206d93735f364193ae51f92ac560 Mon Sep 17 00:00:00 2001 From: Edu Date: Fri, 25 Aug 2023 10:35:56 -0300 Subject: [PATCH 01/26] Updated logic to handle the shouldDisplayNewMarker --- src/pages/home/report/ReportActionsList.js | 24 +++++++++++----------- 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index 7f897ee825fb..8229cd4b4fb9 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -70,10 +70,6 @@ const defaultProps = { const VERTICAL_OFFSET_THRESHOLD = 200; const MSG_VISIBLE_THRESHOLD = 250; -// Seems that there is an architecture issue that prevents us from using the reportID with useRef -// the useRef value gets reset when the reportID changes, so we use a global variable to keep track -let prevReportID = null; - /** * Create a unique key for each action in the FlatList. * We use the reportActionID that is a string representation of a random 64-bit int, which should be @@ -109,6 +105,7 @@ function ReportActionsList({ const {isOffline} = useNetwork(); const opacity = useSharedValue(0); const userActiveSince = useRef(null); + const prevReportID = useRef(null); const currentUnreadMarker = useRef(null); const scrollingVerticalOffset = useRef(0); const readActionSkipped = useRef(false); @@ -131,16 +128,16 @@ function ReportActionsList({ // If the reportID changes, we reset the userActiveSince to null, we need to do it because // the parent component is sending the previous reportID even when the user isn't active // on the report - if (userActiveSince.current && prevReportID && prevReportID !== report.reportID) { + if (userActiveSince.current && prevReportID.current && prevReportID.current !== report.reportID) { userActiveSince.current = null; } else { userActiveSince.current = DateUtils.getDBTime(); } - prevReportID = report.reportID; + prevReportID.current = report.reportID; }, [report.reportID]); useEffect(() => { - if (!userActiveSince.current || report.reportID !== prevReportID) { + if (!userActiveSince.current || report.reportID !== prevReportID.current) { return; } @@ -228,15 +225,18 @@ function ReportActionsList({ if (!currentUnreadMarker.current) { const nextMessage = sortedReportActions[index + 1]; const isCurrentMessageUnread = isMessageUnread(reportAction, report.lastReadTime); - shouldDisplayNewMarker = isCurrentMessageUnread && !isMessageUnread(nextMessage, report.lastReadTime); + let canDisplayNewMarker = isCurrentMessageUnread && !isMessageUnread(nextMessage, report.lastReadTime); if (!messageManuallyMarked.read) { - shouldDisplayNewMarker = shouldDisplayNewMarker && reportAction.actorAccountID !== Report.getCurrentUserAccountID(); + canDisplayNewMarker = canDisplayNewMarker && reportAction.actorAccountID !== Report.getCurrentUserAccountID(); } - const canDisplayMarker = scrollingVerticalOffset.current < MSG_VISIBLE_THRESHOLD ? reportAction.created < userActiveSince.current : true; - - if (!currentUnreadMarker.current && shouldDisplayNewMarker && canDisplayMarker) { + let isMessageInScope = scrollingVerticalOffset.current < MSG_VISIBLE_THRESHOLD ? reportAction.created < userActiveSince.current : true; + if (messageManuallyMarked.read) { + isMessageInScope = true; + } + if (!currentUnreadMarker.current && canDisplayNewMarker && isMessageInScope) { currentUnreadMarker.current = reportAction.reportActionID; + shouldDisplayNewMarker = true; } } else { shouldDisplayNewMarker = reportAction.reportActionID === currentUnreadMarker.current; From 47dd5cd037bbbe0949e377bc48caa6ee71741a7e Mon Sep 17 00:00:00 2001 From: Eduardo Date: Thu, 14 Sep 2023 13:33:23 +0200 Subject: [PATCH 02/26] Sending an event when the user mark as unread a message --- src/libs/actions/Report.js | 1 + .../report/ContextMenu/ContextMenuActions.js | 4 ++- src/pages/home/report/ReportActionsList.js | 35 +++++++++++-------- 3 files changed, 25 insertions(+), 15 deletions(-) diff --git a/src/libs/actions/Report.js b/src/libs/actions/Report.js index 8b898a6aaaea..f3bb12cce4af 100644 --- a/src/libs/actions/Report.js +++ b/src/libs/actions/Report.js @@ -793,6 +793,7 @@ function markCommentAsUnread(reportID, reportActionCreated) { ], }, ); + return lastReadTime; } /** diff --git a/src/pages/home/report/ContextMenu/ContextMenuActions.js b/src/pages/home/report/ContextMenu/ContextMenuActions.js index a3621da3e820..4cf5fa8ab0dd 100644 --- a/src/pages/home/report/ContextMenu/ContextMenuActions.js +++ b/src/pages/home/report/ContextMenu/ContextMenuActions.js @@ -2,6 +2,7 @@ import React from 'react'; import _ from 'underscore'; import ExpensiMark from 'expensify-common/lib/ExpensiMark'; import lodashGet from 'lodash/get'; +import {DeviceEventEmitter} from 'react-native'; import * as Expensicons from '../../../../components/Icon/Expensicons'; import * as Report from '../../../../libs/actions/Report'; import * as Download from '../../../../libs/actions/Download'; @@ -250,7 +251,8 @@ export default [ shouldShow: (type, reportAction, isArchivedRoom, betas, anchor, isChronosReport, reportID, isPinnedChat, isUnreadChat) => type === CONTEXT_MENU_TYPES.REPORT_ACTION || (type === CONTEXT_MENU_TYPES.REPORT && !isUnreadChat), onPress: (closePopover, {reportAction, reportID}) => { - Report.markCommentAsUnread(reportID, reportAction.created); + const lastReadTime = Report.markCommentAsUnread(reportID, reportAction.created); + DeviceEventEmitter.emit('unreadAction', lastReadTime); if (closePopover) { hideContextMenu(true, ReportActionComposeFocusManager.focus); } diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index 8229cd4b4fb9..f2591415a18a 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -23,6 +23,8 @@ import useNetwork from '../../../hooks/useNetwork'; import DateUtils from '../../../libs/DateUtils'; import FloatingMessageCounter from './FloatingMessageCounter'; import useReportScrollManager from '../../../hooks/useReportScrollManager'; +import {DeviceEventEmitter} from 'react-native'; +import {use} from '../../../libs/Request'; const propTypes = { /** The report currently being looked at */ @@ -110,10 +112,11 @@ function ReportActionsList({ const scrollingVerticalOffset = useRef(0); const readActionSkipped = useRef(false); const reportActionSize = useRef(sortedReportActions.length); + const lastReadRef = useRef(report.lastReadTime); // Considering that renderItem is enclosed within a useCallback, marking it as "read" twice will retain the value as "true," preventing the useCallback from re-executing. // However, if we create and listen to an object, it will lead to a new useCallback execution. - const [messageManuallyMarked, setMessageManuallyMarked] = useState({read: false}); + const [messageManuallyMarked, setMessageManuallyMarked] = useState(0); const [isFloatingMessageCounterVisible, setIsFloatingMessageCounterVisible] = useState(false); const animatedStyles = useAnimatedStyle(() => ({ opacity: opacity.value, @@ -159,19 +162,23 @@ function ReportActionsList({ }, [sortedReportActions.length, report.reportID]); useEffect(() => { - const didManuallyMarkReportAsUnread = report.lastReadTime < DateUtils.getDBTime() && ReportUtils.isUnread(report); - if (!didManuallyMarkReportAsUnread) { - setMessageManuallyMarked({read: false}); + if (!userActiveSince.current || report.reportID !== prevReportID.current) { return; } - // Clearing the current unread marker so that it can be recalculated - currentUnreadMarker.current = null; - setMessageManuallyMarked({read: true}); + lastReadRef.current = report.lastReadTime; + setMessageManuallyMarked(0); + }, [report.lastReadTime, report.reportID]); - // We only care when a new lastReadTime is set in the report - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [report.lastReadTime]); + useEffect(() => { + const unreadActionSubscription = DeviceEventEmitter.addListener('unreadAction', (newLastReadTime) => { + currentUnreadMarker.current = null; + lastReadRef.current = newLastReadTime; + setMessageManuallyMarked(new Date().getTime()); + }); + + return () => unreadActionSubscription.remove(); + }, []); /** * Show/hide the new floating message counter when user is scrolling back/forth in the history of messages. @@ -224,14 +231,14 @@ function ReportActionsList({ if (!currentUnreadMarker.current) { const nextMessage = sortedReportActions[index + 1]; - const isCurrentMessageUnread = isMessageUnread(reportAction, report.lastReadTime); - let canDisplayNewMarker = isCurrentMessageUnread && !isMessageUnread(nextMessage, report.lastReadTime); + const isCurrentMessageUnread = isMessageUnread(reportAction, lastReadRef.current); + let canDisplayNewMarker = isCurrentMessageUnread && !isMessageUnread(nextMessage, lastReadRef.current); - if (!messageManuallyMarked.read) { + if (!messageManuallyMarked) { canDisplayNewMarker = canDisplayNewMarker && reportAction.actorAccountID !== Report.getCurrentUserAccountID(); } let isMessageInScope = scrollingVerticalOffset.current < MSG_VISIBLE_THRESHOLD ? reportAction.created < userActiveSince.current : true; - if (messageManuallyMarked.read) { + if (messageManuallyMarked) { isMessageInScope = true; } if (!currentUnreadMarker.current && canDisplayNewMarker && isMessageInScope) { From 922fbf301014df3a18d23aa1f23df77c1b22299a Mon Sep 17 00:00:00 2001 From: Eduardo Date: Thu, 14 Sep 2023 14:30:09 +0200 Subject: [PATCH 03/26] lint fixes --- src/libs/actions/Report.js | 2 ++ src/pages/home/report/ReportActionsList.js | 3 +-- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/src/libs/actions/Report.js b/src/libs/actions/Report.js index f3bb12cce4af..a8e2291407f4 100644 --- a/src/libs/actions/Report.js +++ b/src/libs/actions/Report.js @@ -766,6 +766,8 @@ function readNewestAction(reportID) { * * @param {String} reportID * @param {String} reportActionCreated + * + * @returns {String} lastReadTime */ function markCommentAsUnread(reportID, reportActionCreated) { // If no action created date is provided, use the last action's diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index f2591415a18a..8a489f5dab22 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -2,6 +2,7 @@ import PropTypes from 'prop-types'; import React, {useCallback, useEffect, useState, useRef, useMemo} from 'react'; import Animated, {useSharedValue, useAnimatedStyle, withTiming} from 'react-native-reanimated'; import _ from 'underscore'; +import {DeviceEventEmitter} from 'react-native'; import InvertedFlatList from '../../../components/InvertedFlatList'; import compose from '../../../libs/compose'; import styles from '../../../styles/styles'; @@ -23,8 +24,6 @@ import useNetwork from '../../../hooks/useNetwork'; import DateUtils from '../../../libs/DateUtils'; import FloatingMessageCounter from './FloatingMessageCounter'; import useReportScrollManager from '../../../hooks/useReportScrollManager'; -import {DeviceEventEmitter} from 'react-native'; -import {use} from '../../../libs/Request'; const propTypes = { /** The report currently being looked at */ From 364684848ee6ad0e4d4b21383320589e63f2fe40 Mon Sep 17 00:00:00 2001 From: Eduardo Date: Wed, 27 Sep 2023 16:41:25 +0200 Subject: [PATCH 04/26] Listening to the specific reports and clearing unread marker cache --- .../report/ContextMenu/ContextMenuActions.js | 2 +- src/pages/home/report/ReportActionsList.js | 35 +++++++++++++++---- 2 files changed, 29 insertions(+), 8 deletions(-) diff --git a/src/pages/home/report/ContextMenu/ContextMenuActions.js b/src/pages/home/report/ContextMenu/ContextMenuActions.js index 2847df080f4b..d4dbda641b12 100644 --- a/src/pages/home/report/ContextMenu/ContextMenuActions.js +++ b/src/pages/home/report/ContextMenu/ContextMenuActions.js @@ -253,7 +253,7 @@ export default [ type === CONTEXT_MENU_TYPES.REPORT_ACTION || (type === CONTEXT_MENU_TYPES.REPORT && !isUnreadChat), onPress: (closePopover, {reportAction, reportID}) => { const lastReadTime = Report.markCommentAsUnread(reportID, reportAction.created); - DeviceEventEmitter.emit('unreadAction', lastReadTime); + DeviceEventEmitter.emit(`unreadAction_${reportID}`, lastReadTime); if (closePopover) { hideContextMenu(true, ReportActionComposeFocusManager.focus); } diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index 30b712f5a705..03257b79ce7c 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -75,6 +75,9 @@ const MSG_VISIBLE_THRESHOLD = 250; // the subscriptions could otherwise be conflicting. const newActionUnsubscribeMap = {}; +// We cache the unread markers for each report, because the unread marker isn't +// kept between reports. +const cacheUnreadMarkers = new Map(); /** * Create a unique key for each action in the FlatList. * We use the reportActionID that is a string representation of a random 64-bit int, which should be @@ -111,7 +114,14 @@ function ReportActionsList({ const opacity = useSharedValue(0); const userActiveSince = useRef(null); const prevReportID = useRef(null); - const [currentUnreadMarker, setCurrentUnreadMarker] = useState(null); + const unreadActionSubscription = useRef(null); + const markerInit = () => { + if (!cacheUnreadMarkers.has(report.reportID)) { + return null; + } + return cacheUnreadMarkers.get(report.reportID); + }; + const [currentUnreadMarker, setCurrentUnreadMarker] = useState(markerInit); const scrollingVerticalOffset = useRef(0); const readActionSkipped = useRef(false); const reportActionSize = useRef(sortedReportActions.length); @@ -159,6 +169,7 @@ function ReportActionsList({ return; } + cacheUnreadMarkers.delete(report.reportID); reportActionSize.current = sortedReportActions.length; setCurrentUnreadMarker(null); // eslint-disable-next-line react-hooks/exhaustive-deps @@ -169,19 +180,29 @@ function ReportActionsList({ return; } + if (!messageManuallyMarked && lastReadRef.current && lastReadRef.current < report.lastReadTime) { + cacheUnreadMarkers.delete(report.reportID); + } lastReadRef.current = report.lastReadTime; setMessageManuallyMarked(0); }, [report.lastReadTime, report.reportID]); useEffect(() => { - const unreadActionSubscription = DeviceEventEmitter.addListener('unreadAction', (newLastReadTime) => { - setCurrentUnreadMarker(null); + // If the reportID changes, we reset the userActiveSince to null, we need to do it because + // this component doesn't unmount when the reportID changes + if (unreadActionSubscription.current) { + unreadActionSubscription.current.remove(); + unreadActionSubscription.current = null; + } + + // Need to listen for the specific reportID, otherwise we could be listening to all the reports + unreadActionSubscription.current = DeviceEventEmitter.addListener(`unreadAction_${report.reportID}`, (newLastReadTime) => { + cacheUnreadMarkers.delete(report.reportID); lastReadRef.current = newLastReadTime; + setCurrentUnreadMarker(null); setMessageManuallyMarked(new Date().getTime()); }); - - return () => unreadActionSubscription.remove(); - }, []); + }, [report.reportID]); useEffect(() => { // Why are we doing this, when in the cleanup of the useEffect we are already calling the unsubscribe function? @@ -278,7 +299,6 @@ function ReportActionsList({ const renderItem = useCallback( ({item: reportAction, index}) => { let shouldDisplayNewMarker = false; - if (!currentUnreadMarker) { const nextMessage = sortedReportActions[index + 1]; const isCurrentMessageUnread = isMessageUnread(reportAction, lastReadRef.current); @@ -293,6 +313,7 @@ function ReportActionsList({ isMessageInScope = true; } if (!currentUnreadMarker && canDisplayNewMarker && isMessageInScope) { + cacheUnreadMarkers.set(report.reportID, reportAction.reportActionID); setCurrentUnreadMarker(reportAction.reportActionID); shouldDisplayNewMarker = true; } From c71ecae0c06e54530ab07a85c38f3612fd7263e8 Mon Sep 17 00:00:00 2001 From: Eduardo Date: Thu, 28 Sep 2023 07:39:41 +0200 Subject: [PATCH 05/26] disable dependency hook, no need to listen to the messageManuallyMarked --- src/pages/home/report/ReportActionsList.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index 03257b79ce7c..e5d76a54a0a4 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -185,6 +185,7 @@ function ReportActionsList({ } lastReadRef.current = report.lastReadTime; setMessageManuallyMarked(0); + // eslint-disable-next-line react-hooks/exhaustive-deps }, [report.lastReadTime, report.reportID]); useEffect(() => { From de5b8fe154d5fbbf5840eaeab8fbaeb6a968731e Mon Sep 17 00:00:00 2001 From: Eduardo Date: Fri, 29 Sep 2023 14:59:39 +0200 Subject: [PATCH 06/26] removed console logs --- src/pages/home/report/ReportActionsList.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index 3392799bc4d0..0a85bb0e91a9 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -185,9 +185,7 @@ function ReportActionsList({ if (!userActiveSince.current || report.reportID !== prevReportID.current) { return; } - console.log('ReportActionsList.js useEffect(): ', lastReadRef.current, ' < report.lastRead: ', report.lastReadTime); if (!messageManuallyMarkedUnread && lastReadRef.current && lastReadRef.current < report.lastReadTime) { - console.log('ReportActionsList.js useEffect(): delete reportID from cache'); cacheUnreadMarkers.delete(report.reportID); } lastReadRef.current = report.lastReadTime; From 89255151125cecd985f1b4078b23d67bb66c332b Mon Sep 17 00:00:00 2001 From: Eduardo Date: Tue, 3 Oct 2023 09:10:04 +0200 Subject: [PATCH 07/26] fixed lint issues --- src/pages/home/report/ReportActionsList.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index 1be51973fbac..23a9fbb00c05 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -3,14 +3,14 @@ import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react'; import Animated, {useAnimatedStyle, useSharedValue, withTiming} from 'react-native-reanimated'; import _ from 'underscore'; import {DeviceEventEmitter} from 'react-native'; +import {useRoute} from '@react-navigation/native'; +import lodashGet from 'lodash/get'; import compose from '../../../libs/compose'; import styles from '../../../styles/styles'; import * as ReportUtils from '../../../libs/ReportUtils'; import * as Report from '../../../libs/actions/Report'; import withWindowDimensions, {windowDimensionsPropTypes} from '../../../components/withWindowDimensions'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsPropTypes, withCurrentUserPersonalDetailsDefaultProps} from '../../../components/withCurrentUserPersonalDetails'; -import {useRoute} from '@react-navigation/native'; -import lodashGet from 'lodash/get'; import CONST from '../../../CONST'; import InvertedFlatList from '../../../components/InvertedFlatList'; import {withPersonalDetails} from '../../../components/OnyxProvider'; From 71495589834b33b3f1a957bc40bae336304c47db Mon Sep 17 00:00:00 2001 From: Eduardo Date: Mon, 9 Oct 2023 10:50:14 +0200 Subject: [PATCH 08/26] Moved the DeviceEventEmitter into the markCommentAsUnread function --- src/libs/actions/Report.js | 6 ++---- src/pages/home/report/ContextMenu/ContextMenuActions.js | 4 +--- 2 files changed, 3 insertions(+), 7 deletions(-) diff --git a/src/libs/actions/Report.js b/src/libs/actions/Report.js index 19b77fd2c331..37d52baa720b 100644 --- a/src/libs/actions/Report.js +++ b/src/libs/actions/Report.js @@ -1,4 +1,4 @@ -import {InteractionManager} from 'react-native'; +import {InteractionManager, DeviceEventEmitter} from 'react-native'; import _ from 'underscore'; import lodashGet from 'lodash/get'; import ExpensiMark from 'expensify-common/lib/ExpensiMark'; @@ -842,8 +842,6 @@ function readNewestAction(reportID) { * * @param {String} reportID * @param {String} reportActionCreated - * - * @returns {String} lastReadTime */ function markCommentAsUnread(reportID, reportActionCreated) { // If no action created date is provided, use the last action's @@ -871,7 +869,7 @@ function markCommentAsUnread(reportID, reportActionCreated) { ], }, ); - return lastReadTime; + DeviceEventEmitter.emit(`unreadAction_${reportID}`, lastReadTime); } /** diff --git a/src/pages/home/report/ContextMenu/ContextMenuActions.js b/src/pages/home/report/ContextMenu/ContextMenuActions.js index 919dfd037703..92f6c5a454e8 100644 --- a/src/pages/home/report/ContextMenu/ContextMenuActions.js +++ b/src/pages/home/report/ContextMenu/ContextMenuActions.js @@ -2,7 +2,6 @@ import React from 'react'; import _ from 'underscore'; import ExpensiMark from 'expensify-common/lib/ExpensiMark'; import lodashGet from 'lodash/get'; -import {DeviceEventEmitter} from 'react-native'; import * as Expensicons from '../../../../components/Icon/Expensicons'; import * as Report from '../../../../libs/actions/Report'; import * as Download from '../../../../libs/actions/Download'; @@ -252,8 +251,7 @@ export default [ shouldShow: (type, reportAction, isArchivedRoom, betas, anchor, isChronosReport, reportID, isPinnedChat, isUnreadChat) => type === CONTEXT_MENU_TYPES.REPORT_ACTION || (type === CONTEXT_MENU_TYPES.REPORT && !isUnreadChat), onPress: (closePopover, {reportAction, reportID}) => { - const lastReadTime = Report.markCommentAsUnread(reportID, reportAction.created); - DeviceEventEmitter.emit(`unreadAction_${reportID}`, lastReadTime); + Report.markCommentAsUnread(reportID, reportAction.created); if (closePopover) { hideContextMenu(true, ReportActionComposeFocusManager.focus); } From f40773ba045de3050b22ec4d2ca3fcd49828df45 Mon Sep 17 00:00:00 2001 From: Eduardo Date: Fri, 13 Oct 2023 10:28:58 +0200 Subject: [PATCH 09/26] Updated scrolling direction and amount --- tests/ui/UnreadIndicatorsTest.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/ui/UnreadIndicatorsTest.js b/tests/ui/UnreadIndicatorsTest.js index 361eb8f87081..94f55b1e9b86 100644 --- a/tests/ui/UnreadIndicatorsTest.js +++ b/tests/ui/UnreadIndicatorsTest.js @@ -78,7 +78,7 @@ function scrollUpToRevealNewMessagesBadge() { function isNewMessagesBadgeVisible() { const hintText = Localize.translateLocal('accessibilityHints.scrollToNewestMessages'); const badge = screen.queryByAccessibilityHint(hintText); - return Math.round(badge.props.style.transform[0].translateY) === 10; + return Math.round(badge.props.style.transform[0].translateY) === -40; } /** From c784057d3ede873ed8ec6f94620e78867e8ea453 Mon Sep 17 00:00:00 2001 From: Eduardo Date: Wed, 18 Oct 2023 10:35:21 +0200 Subject: [PATCH 10/26] Fix to add report into map --- ios/Podfile.lock | 2 +- src/pages/home/report/ReportActionsList.js | 2 ++ 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/ios/Podfile.lock b/ios/Podfile.lock index a4a8089c9c05..1979fdbb37ea 100644 --- a/ios/Podfile.lock +++ b/ios/Podfile.lock @@ -1293,4 +1293,4 @@ SPEC CHECKSUMS: PODFILE CHECKSUM: ff769666b7221c15936ebc5576a8c8e467dc6879 -COCOAPODS: 1.12.1 +COCOAPODS: 1.13.0 diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index 5d304ee3cdca..c55b3a810d0a 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -322,7 +322,9 @@ function ReportActionsList({ const canDisplayMarker = scrollingVerticalOffset.current < MSG_VISIBLE_THRESHOLD ? reportAction.created < userActiveSince.current : true; if (!currentUnreadMarker && shouldDisplayNewMarker && canDisplayMarker) { + cacheUnreadMarkers.set(report.reportID, reportAction.reportActionID); setCurrentUnreadMarker(reportAction.reportActionID); + shouldDisplayNewMarker = true; } } else { shouldDisplayNewMarker = reportAction.reportActionID === currentUnreadMarker; From eee1e833ed7e531daaa4444d47fe5512310f087b Mon Sep 17 00:00:00 2001 From: Eduardo Date: Wed, 18 Oct 2023 15:34:14 +0200 Subject: [PATCH 11/26] Fixed green line placement --- src/pages/home/report/ReportActionsList.js | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index a57f8320ed0a..ded764a70b3f 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -310,10 +310,11 @@ function ReportActionsList({ const shouldDisplayNewMarker = useCallback( (reportAction, index) => { let shouldDisplay = false; + if (!currentUnreadMarker) { const nextMessage = sortedReportActions[index + 1]; - const isCurrentMessageUnread = isMessageUnread(reportAction, report.lastReadTime); - shouldDisplay = isCurrentMessageUnread && !isMessageUnread(nextMessage, report.lastReadTime); + const isCurrentMessageUnread = isMessageUnread(reportAction, lastReadRef.current); + shouldDisplay = isCurrentMessageUnread && !isMessageUnread(nextMessage, lastReadRef.current); if (!messageManuallyMarkedUnread) { shouldDisplay = shouldDisplay && reportAction.actorAccountID !== Report.getCurrentUserAccountID(); } @@ -323,6 +324,7 @@ function ReportActionsList({ } else { shouldDisplay = reportAction.reportActionID === currentUnreadMarker; } + return shouldDisplay; }, [currentUnreadMarker, sortedReportActions, report.lastReadTime, messageManuallyMarkedUnread], @@ -337,6 +339,7 @@ function ReportActionsList({ return; } if (!currentUnreadMarker && currentUnreadMarker !== reportAction.reportActionID) { + cacheUnreadMarkers.set(report.reportID, reportAction.reportActionID); setCurrentUnreadMarker(reportAction.reportActionID); } }); From f1de9240a250cfb31ea9a56b4aff8e6320dc3557 Mon Sep 17 00:00:00 2001 From: Eduardo Date: Wed, 18 Oct 2023 16:22:00 +0200 Subject: [PATCH 12/26] fixed lint errors --- ios/Podfile.lock | 2 +- src/pages/home/report/ReportActionsList.js | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/ios/Podfile.lock b/ios/Podfile.lock index b3933fe7b1a3..f41c2880563b 100644 --- a/ios/Podfile.lock +++ b/ios/Podfile.lock @@ -1293,4 +1293,4 @@ SPEC CHECKSUMS: PODFILE CHECKSUM: ff769666b7221c15936ebc5576a8c8e467dc6879 -COCOAPODS: 1.13.0 +COCOAPODS: 1.12.1 \ No newline at end of file diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index ded764a70b3f..43ebe7c15271 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -327,7 +327,7 @@ function ReportActionsList({ return shouldDisplay; }, - [currentUnreadMarker, sortedReportActions, report.lastReadTime, messageManuallyMarkedUnread], + [currentUnreadMarker, sortedReportActions, report.lastReadTime, report.reportID, messageManuallyMarkedUnread], ); useEffect(() => { @@ -343,7 +343,7 @@ function ReportActionsList({ setCurrentUnreadMarker(reportAction.reportActionID); } }); - }, [sortedReportActions, report.lastReadTime, messageManuallyMarkedUnread, shouldDisplayNewMarker, currentUnreadMarker]); + }, [sortedReportActions, report.lastReadTime, report.reportID, messageManuallyMarkedUnread, shouldDisplayNewMarker, currentUnreadMarker]); const renderItem = useCallback( ({item: reportAction, index}) => ( From c8d48532458284670e45e0a585b4307e38408360 Mon Sep 17 00:00:00 2001 From: Eduardo Date: Wed, 18 Oct 2023 16:39:06 +0200 Subject: [PATCH 13/26] fixed lint issue --- src/pages/home/report/ReportActionsList.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index 43ebe7c15271..08f11c16abe9 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -327,7 +327,7 @@ function ReportActionsList({ return shouldDisplay; }, - [currentUnreadMarker, sortedReportActions, report.lastReadTime, report.reportID, messageManuallyMarkedUnread], + [currentUnreadMarker, sortedReportActions, report.reportID, messageManuallyMarkedUnread], ); useEffect(() => { From c9722d90b4644e4fc6af35e2324c883f9554d86e Mon Sep 17 00:00:00 2001 From: Eduardo Date: Fri, 20 Oct 2023 07:10:53 +0200 Subject: [PATCH 14/26] Fixed test --- src/components/EmojiPicker/EmojiPicker.js | 4 +++- tests/ui/UnreadIndicatorsTest.js | 16 ++++++++++++---- 2 files changed, 15 insertions(+), 5 deletions(-) diff --git a/src/components/EmojiPicker/EmojiPicker.js b/src/components/EmojiPicker/EmojiPicker.js index a12b089ddf97..95a852f6489f 100644 --- a/src/components/EmojiPicker/EmojiPicker.js +++ b/src/components/EmojiPicker/EmojiPicker.js @@ -134,7 +134,9 @@ const EmojiPicker = forwardRef((props, ref) => { }); }); return () => { - emojiPopoverDimensionListener.remove(); + if (emojiPopoverDimensionListener) { + emojiPopoverDimensionListener.remove(); + } }; }, [isEmojiPickerVisible, props.isSmallScreenWidth, emojiPopoverAnchorOrigin]); diff --git a/tests/ui/UnreadIndicatorsTest.js b/tests/ui/UnreadIndicatorsTest.js index 9bbe893877ed..a3370a54d7e2 100644 --- a/tests/ui/UnreadIndicatorsTest.js +++ b/tests/ui/UnreadIndicatorsTest.js @@ -1,6 +1,6 @@ import React from 'react'; import Onyx from 'react-native-onyx'; -import {Linking, AppState} from 'react-native'; +import {Linking, AppState, DeviceEventEmitter} from 'react-native'; import {fireEvent, render, screen, waitFor} from '@testing-library/react-native'; import lodashGet from 'lodash/get'; import {subMinutes, format, addSeconds, subSeconds} from 'date-fns'; @@ -251,8 +251,12 @@ describe('Unread Indicators', () => { signInAndGetAppWithUnreadChat() // Navigate to the unread chat from the sidebar .then(() => navigateToSidebarOption(0)) - // Navigate to the unread chat from the sidebar - .then(() => navigateToSidebarOption(0)) + .then(() => { + // Verify the unread indicator is present + const newMessageLineIndicatorHintText = Localize.translateLocal('accessibilityHints.newMessageLineIndicator'); + const unreadIndicator = screen.queryAllByLabelText(newMessageLineIndicatorHintText); + expect(unreadIndicator).toHaveLength(1); + }) .then(() => { expect(areYouOnChatListScreen()).toBe(false); @@ -263,9 +267,13 @@ describe('Unread Indicators', () => { // Verify the LHN is now open expect(areYouOnChatListScreen()).toBe(true); - // Tap on the chat again return navigateToSidebarOption(0); }) + .then(() => { + // Sending event to clear the unread indicator cache, given that the test doesn't behave as the app + DeviceEventEmitter.emit(`unreadAction_${REPORT_ID}`, format(new Date(), CONST.DATE.FNS_DB_FORMAT_STRING)); + return waitForBatchedUpdatesWithAct(); + }) .then(() => { // Verify the unread indicator is not present const newMessageLineIndicatorHintText = Localize.translateLocal('accessibilityHints.newMessageLineIndicator'); From 8782bf7c0abd3f3bc938737299117be1373e1db9 Mon Sep 17 00:00:00 2001 From: Eduardo Date: Fri, 20 Oct 2023 07:17:24 +0200 Subject: [PATCH 15/26] fixed lint error --- src/components/EmojiPicker/EmojiPicker.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/components/EmojiPicker/EmojiPicker.js b/src/components/EmojiPicker/EmojiPicker.js index 95a852f6489f..633fd5f6b899 100644 --- a/src/components/EmojiPicker/EmojiPicker.js +++ b/src/components/EmojiPicker/EmojiPicker.js @@ -134,9 +134,10 @@ const EmojiPicker = forwardRef((props, ref) => { }); }); return () => { - if (emojiPopoverDimensionListener) { - emojiPopoverDimensionListener.remove(); + if (!emojiPopoverDimensionListener) { + return; } + emojiPopoverDimensionListener.remove(); }; }, [isEmojiPickerVisible, props.isSmallScreenWidth, emojiPopoverAnchorOrigin]); From 57978b63e4573a9b91c4c3c3a3c79b63b013c4da Mon Sep 17 00:00:00 2001 From: Eduardo Date: Mon, 30 Oct 2023 16:01:02 +0100 Subject: [PATCH 16/26] updated dependency array --- src/pages/home/report/ReportActionsList.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index 6fea4e60911c..f2b4a4b5b6cf 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -365,7 +365,7 @@ function ReportActionsList({ if (!markerFound) { setCurrentUnreadMarker(null); } - }, [sortedReportActions, report.lastReadTime, , report.reportID, messageManuallyMarkedUnread, shouldDisplayNewMarker, currentUnreadMarker]); + }, [sortedReportActions, report.lastReadTime, report.reportID, messageManuallyMarkedUnread, shouldDisplayNewMarker, currentUnreadMarker]); const renderItem = useCallback( ({item: reportAction, index}) => ( From 6546ba50f47c8e89b9c12a655bc5c661251f99bb Mon Sep 17 00:00:00 2001 From: Eduardo Date: Mon, 30 Oct 2023 16:22:24 +0100 Subject: [PATCH 17/26] Prettier fixes --- src/libs/actions/Report.js | 4 ++-- src/pages/home/report/ReportActionsList.js | 4 ++-- tests/ui/UnreadIndicatorsTest.js | 6 +++--- 3 files changed, 7 insertions(+), 7 deletions(-) diff --git a/src/libs/actions/Report.js b/src/libs/actions/Report.js index 776372392ac6..97b56a0d1327 100644 --- a/src/libs/actions/Report.js +++ b/src/libs/actions/Report.js @@ -1,9 +1,9 @@ -import {InteractionManager, DeviceEventEmitter} from 'react-native'; -import lodashDebounce from 'lodash/debounce'; import {format as timezoneFormat, utcToZonedTime} from 'date-fns-tz'; import ExpensiMark from 'expensify-common/lib/ExpensiMark'; import Str from 'expensify-common/lib/str'; +import lodashDebounce from 'lodash/debounce'; import lodashGet from 'lodash/get'; +import {DeviceEventEmitter, InteractionManager} from 'react-native'; import Onyx from 'react-native-onyx'; import _ from 'underscore'; import * as ActiveClientManager from '@libs/ActiveClientManager'; diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index f2b4a4b5b6cf..58c6fe01e007 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -1,10 +1,10 @@ import {useRoute} from '@react-navigation/native'; +import lodashGet from 'lodash/get'; import PropTypes from 'prop-types'; import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react'; +import {DeviceEventEmitter} from 'react-native'; import Animated, {useAnimatedStyle, useSharedValue, withTiming} from 'react-native-reanimated'; import _ from 'underscore'; -import {DeviceEventEmitter} from 'react-native'; -import lodashGet from 'lodash/get'; import InvertedFlatList from '@components/InvertedFlatList'; import {withPersonalDetails} from '@components/OnyxProvider'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; diff --git a/tests/ui/UnreadIndicatorsTest.js b/tests/ui/UnreadIndicatorsTest.js index a7b1c2df7b21..788aed6233af 100644 --- a/tests/ui/UnreadIndicatorsTest.js +++ b/tests/ui/UnreadIndicatorsTest.js @@ -1,10 +1,10 @@ -import React from 'react'; -import Onyx from 'react-native-onyx'; -import {Linking, AppState, DeviceEventEmitter} from 'react-native'; import {fireEvent, render, screen, waitFor} from '@testing-library/react-native'; import {addSeconds, format, subMinutes, subSeconds} from 'date-fns'; import {utcToZonedTime} from 'date-fns-tz'; import lodashGet from 'lodash/get'; +import React from 'react'; +import {AppState, DeviceEventEmitter, Linking} from 'react-native'; +import Onyx from 'react-native-onyx'; import App from '../../src/App'; import CONFIG from '../../src/CONFIG'; import CONST from '../../src/CONST'; From cdb1b804c19eef54c0841d0ba8d426ab7a79a9d2 Mon Sep 17 00:00:00 2001 From: Eduardo Date: Tue, 14 Nov 2023 15:37:48 +0100 Subject: [PATCH 18/26] reverting changes --- ios/Podfile.lock | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/ios/Podfile.lock b/ios/Podfile.lock index 5b7886c8ebcd..952451ff88bf 100644 --- a/ios/Podfile.lock +++ b/ios/Podfile.lock @@ -234,8 +234,8 @@ PODS: - libwebp/demux - libwebp/webp (1.2.4) - lottie-ios (4.3.3) - - lottie-react-native (6.4.0): - - lottie-ios (~> 4.3.3) + - lottie-react-native (6.3.1): + - lottie-ios (~> 4.3.0) - React-Core - MapboxCommon (23.6.0) - MapboxCoreMaps (10.14.0): @@ -1203,7 +1203,7 @@ SPEC CHECKSUMS: libevent: 4049cae6c81cdb3654a443be001fb9bdceff7913 libwebp: f62cb61d0a484ba548448a4bd52aabf150ff6eef lottie-ios: 25e7b2675dad5c3ddad369ac9baab03560c5bfdd - lottie-react-native: 3a3084faddd3891c276f23fd6e797b83f2021bbc + lottie-react-native: c9f1db4f4124dcce9f8159e65d8dc6e8bcb11fb4 MapboxCommon: 4a0251dd470ee37e7fadda8e285c01921a5e1eb0 MapboxCoreMaps: eb07203bbb0b1509395db5ab89cd3ad6c2e3c04c MapboxMaps: af50ec61a7eb3b032c3f7962c6bd671d93d2a209 From 5dde6f20f053480024bc298bba130ba45269fed9 Mon Sep 17 00:00:00 2001 From: Eduardo Date: Tue, 14 Nov 2023 16:07:38 +0100 Subject: [PATCH 19/26] Fixed comments --- ios/Podfile.lock | 6 +++--- src/pages/home/report/ReportActionsList.js | 4 +--- 2 files changed, 4 insertions(+), 6 deletions(-) diff --git a/ios/Podfile.lock b/ios/Podfile.lock index 952451ff88bf..5b7886c8ebcd 100644 --- a/ios/Podfile.lock +++ b/ios/Podfile.lock @@ -234,8 +234,8 @@ PODS: - libwebp/demux - libwebp/webp (1.2.4) - lottie-ios (4.3.3) - - lottie-react-native (6.3.1): - - lottie-ios (~> 4.3.0) + - lottie-react-native (6.4.0): + - lottie-ios (~> 4.3.3) - React-Core - MapboxCommon (23.6.0) - MapboxCoreMaps (10.14.0): @@ -1203,7 +1203,7 @@ SPEC CHECKSUMS: libevent: 4049cae6c81cdb3654a443be001fb9bdceff7913 libwebp: f62cb61d0a484ba548448a4bd52aabf150ff6eef lottie-ios: 25e7b2675dad5c3ddad369ac9baab03560c5bfdd - lottie-react-native: c9f1db4f4124dcce9f8159e65d8dc6e8bcb11fb4 + lottie-react-native: 3a3084faddd3891c276f23fd6e797b83f2021bbc MapboxCommon: 4a0251dd470ee37e7fadda8e285c01921a5e1eb0 MapboxCoreMaps: eb07203bbb0b1509395db5ab89cd3ad6c2e3c04c MapboxMaps: af50ec61a7eb3b032c3f7962c6bd671d93d2a209 diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index c808dfbbb8be..c3e4371cdfbf 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -222,7 +222,7 @@ function ReportActionsList({ unreadActionSubscription.current = null; } - // Need to listen for the specific reportID, otherwise we could be listening to all the reports + // Listen to specific reportID for unread event and set the marker to new message unreadActionSubscription.current = DeviceEventEmitter.addListener(`unreadAction_${report.reportID}`, (newLastReadTime) => { cacheUnreadMarkers.delete(report.reportID); lastReadRef.current = newLastReadTime; @@ -326,12 +326,10 @@ function ReportActionsList({ const shouldDisplayNewMarker = useCallback( (reportAction, index) => { let shouldDisplay = false; - if (!currentUnreadMarker) { const nextMessage = sortedReportActions[index + 1]; const isCurrentMessageUnread = isMessageUnread(reportAction, lastReadRef.current); shouldDisplay = isCurrentMessageUnread && (!nextMessage || !isMessageUnread(nextMessage, lastReadRef.current)); - if (!messageManuallyMarkedUnread) { shouldDisplay = shouldDisplay && reportAction.actorAccountID !== Report.getCurrentUserAccountID(); } From 2b83ba6ff04e606f33d7acaca510c81076e29a2f Mon Sep 17 00:00:00 2001 From: Eduardo Date: Wed, 15 Nov 2023 08:22:52 +0100 Subject: [PATCH 20/26] fixed more comments --- ios/Podfile.lock | 2 -- src/pages/home/report/ReportActionsList.js | 12 ++++++------ 2 files changed, 6 insertions(+), 8 deletions(-) diff --git a/ios/Podfile.lock b/ios/Podfile.lock index 5b7886c8ebcd..c49543eb8217 100644 --- a/ios/Podfile.lock +++ b/ios/Podfile.lock @@ -1298,5 +1298,3 @@ SPEC CHECKSUMS: YogaKit: f782866e155069a2cca2517aafea43200b01fd5a PODFILE CHECKSUM: ff769666b7221c15936ebc5576a8c8e467dc6879 - -COCOAPODS: 1.12.1 \ No newline at end of file diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index c3e4371cdfbf..1ee68ab165d8 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -150,7 +150,7 @@ function ReportActionsList({ const hasHeaderRendered = useRef(false); const hasFooterRendered = useRef(false); const reportActionSize = useRef(sortedReportActions.length); - const lastReadRef = useRef(report.lastReadTime); + const lastReadTimeRef = useRef(report.lastReadTime); const linkedReportActionID = lodashGet(route, 'params.reportActionID', ''); @@ -205,10 +205,10 @@ function ReportActionsList({ if (!userActiveSince.current || report.reportID !== prevReportID.current) { return; } - if (!messageManuallyMarkedUnread && lastReadRef.current && lastReadRef.current < report.lastReadTime) { + if (!messageManuallyMarkedUnread && lastReadTimeRef.current && lastReadTimeRef.current < report.lastReadTime) { cacheUnreadMarkers.delete(report.reportID); } - lastReadRef.current = report.lastReadTime; + lastReadTimeRef.current = report.lastReadTime; setMessageManuallyMarkedUnread(0); // eslint-disable-next-line react-hooks/exhaustive-deps @@ -225,7 +225,7 @@ function ReportActionsList({ // Listen to specific reportID for unread event and set the marker to new message unreadActionSubscription.current = DeviceEventEmitter.addListener(`unreadAction_${report.reportID}`, (newLastReadTime) => { cacheUnreadMarkers.delete(report.reportID); - lastReadRef.current = newLastReadTime; + lastReadTimeRef.current = newLastReadTime; setCurrentUnreadMarker(null); setMessageManuallyMarkedUnread(new Date().getTime()); }); @@ -328,8 +328,8 @@ function ReportActionsList({ let shouldDisplay = false; if (!currentUnreadMarker) { const nextMessage = sortedReportActions[index + 1]; - const isCurrentMessageUnread = isMessageUnread(reportAction, lastReadRef.current); - shouldDisplay = isCurrentMessageUnread && (!nextMessage || !isMessageUnread(nextMessage, lastReadRef.current)); + const isCurrentMessageUnread = isMessageUnread(reportAction, lastReadTimeRef.current); + shouldDisplay = isCurrentMessageUnread && (!nextMessage || !isMessageUnread(nextMessage, lastReadTimeRef.current)); if (!messageManuallyMarkedUnread) { shouldDisplay = shouldDisplay && reportAction.actorAccountID !== Report.getCurrentUserAccountID(); } From c4541fb3ceaadb243f973726bad07e296bca0e06 Mon Sep 17 00:00:00 2001 From: Eduardo Date: Wed, 15 Nov 2023 12:11:01 +0100 Subject: [PATCH 21/26] improved the comments --- ios/Podfile.lock | 2 ++ src/pages/home/report/ReportActionsList.js | 5 +++-- 2 files changed, 5 insertions(+), 2 deletions(-) diff --git a/ios/Podfile.lock b/ios/Podfile.lock index c49543eb8217..5b7886c8ebcd 100644 --- a/ios/Podfile.lock +++ b/ios/Podfile.lock @@ -1298,3 +1298,5 @@ SPEC CHECKSUMS: YogaKit: f782866e155069a2cca2517aafea43200b01fd5a PODFILE CHECKSUM: ff769666b7221c15936ebc5576a8c8e467dc6879 + +COCOAPODS: 1.12.1 \ No newline at end of file diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index 1ee68ab165d8..31d418c37d4a 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -89,8 +89,9 @@ const MSG_VISIBLE_THRESHOLD = 250; // the subscriptions could otherwise be conflicting. const newActionUnsubscribeMap = {}; -// We cache the unread markers for each report, because the unread marker isn't -// kept between reports. +// Caching the reportID and reportActionID for unread markers ensures persistent tracking +// across multiple reports, preserving the green line placement and allowing retrieval +// of the relevant reportActionID for displaying the green line. const cacheUnreadMarkers = new Map(); /** * Create a unique key for each action in the FlatList. From 58e2f9c2bb1a80236581250f8c8476713c92b0b3 Mon Sep 17 00:00:00 2001 From: Eduardo Date: Wed, 15 Nov 2023 13:36:21 +0100 Subject: [PATCH 22/26] added new line after pods --- ios/Podfile.lock | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ios/Podfile.lock b/ios/Podfile.lock index 5b7886c8ebcd..d94e36b0b3c9 100644 --- a/ios/Podfile.lock +++ b/ios/Podfile.lock @@ -1299,4 +1299,4 @@ SPEC CHECKSUMS: PODFILE CHECKSUM: ff769666b7221c15936ebc5576a8c8e467dc6879 -COCOAPODS: 1.12.1 \ No newline at end of file +COCOAPODS: 1.12.1 From 12a92a79ebb223a1b36ed0036fd72b16deb3a6a8 Mon Sep 17 00:00:00 2001 From: Eduardo Date: Wed, 15 Nov 2023 14:29:35 +0100 Subject: [PATCH 23/26] explaining why we cache --- src/pages/home/report/ReportActionsList.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index 31d418c37d4a..728d3b0cd6a2 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -92,6 +92,8 @@ const newActionUnsubscribeMap = {}; // Caching the reportID and reportActionID for unread markers ensures persistent tracking // across multiple reports, preserving the green line placement and allowing retrieval // of the relevant reportActionID for displaying the green line. +// Is not persisted across Reports because the are at least 3 ReportScreen components created so the +// internal states are resetted or recreated. const cacheUnreadMarkers = new Map(); /** * Create a unique key for each action in the FlatList. From 823f3b7b86ed7f7ae642e6b738243995b9dcd928 Mon Sep 17 00:00:00 2001 From: edug Date: Wed, 15 Nov 2023 15:52:38 +0100 Subject: [PATCH 24/26] Update src/pages/home/report/ReportActionsList.js Co-authored-by: Monil Bhavsar --- src/pages/home/report/ReportActionsList.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index 728d3b0cd6a2..d2c401593d40 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -92,7 +92,7 @@ const newActionUnsubscribeMap = {}; // Caching the reportID and reportActionID for unread markers ensures persistent tracking // across multiple reports, preserving the green line placement and allowing retrieval // of the relevant reportActionID for displaying the green line. -// Is not persisted across Reports because the are at least 3 ReportScreen components created so the +// We need to persist it across reports because there are at least 3 ReportScreen components created so the // internal states are resetted or recreated. const cacheUnreadMarkers = new Map(); /** From 0a578dd0efca2bd902b0fe57c7af63872f8ddfb0 Mon Sep 17 00:00:00 2001 From: Eduardo Date: Thu, 16 Nov 2023 14:55:47 +0100 Subject: [PATCH 25/26] Moved out the the prevReportID --- src/pages/home/report/ReportActionsList.js | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index 0bb31902bf51..e18263178c4b 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -95,6 +95,8 @@ const newActionUnsubscribeMap = {}; // We need to persist it across reports because there are at least 3 ReportScreen components created so the // internal states are resetted or recreated. const cacheUnreadMarkers = new Map(); + +let prevReportID = null; /** * Create a unique key for each action in the FlatList. * We use the reportActionID that is a string representation of a random 64-bit int, which should be @@ -140,7 +142,6 @@ function ReportActionsList({ const route = useRoute(); const opacity = useSharedValue(0); const userActiveSince = useRef(null); - const prevReportID = useRef(null); const unreadActionSubscription = useRef(null); const markerInit = () => { if (!cacheUnreadMarkers.has(report.reportID)) { @@ -174,16 +175,16 @@ function ReportActionsList({ // If the reportID changes, we reset the userActiveSince to null, we need to do it because // the parent component is sending the previous reportID even when the user isn't active // on the report - if (userActiveSince.current && prevReportID.current && prevReportID.current !== report.reportID) { + if (userActiveSince.current && prevReportID && prevReportID !== report.reportID) { userActiveSince.current = null; } else { userActiveSince.current = DateUtils.getDBTime(); } - prevReportID.current = report.reportID; + prevReportID = report.reportID; }, [report.reportID]); useEffect(() => { - if (!userActiveSince.current || report.reportID !== prevReportID.current) { + if (!userActiveSince.current || report.reportID !== prevReportID) { return; } @@ -206,7 +207,7 @@ function ReportActionsList({ }, [sortedReportActions.length, report.reportID]); useEffect(() => { - if (!userActiveSince.current || report.reportID !== prevReportID.current) { + if (!userActiveSince.current || report.reportID !== prevReportID) { return; } if (!messageManuallyMarkedUnread && lastReadTimeRef.current && lastReadTimeRef.current < report.lastReadTime) { From 8bb02a4715e0724499a9c8969b73ba34f0037d3e Mon Sep 17 00:00:00 2001 From: Eduardo Date: Thu, 16 Nov 2023 14:58:58 +0100 Subject: [PATCH 26/26] commenting the new variable --- src/pages/home/report/ReportActionsList.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index e18263178c4b..dd537959c91f 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -96,7 +96,10 @@ const newActionUnsubscribeMap = {}; // internal states are resetted or recreated. const cacheUnreadMarkers = new Map(); +// Seems that there is an architecture issue that prevents us from using the reportID with useRef +// the useRef value gets reset when the reportID changes, so we use a global variable to keep track let prevReportID = null; + /** * Create a unique key for each action in the FlatList. * We use the reportActionID that is a string representation of a random 64-bit int, which should be