From fa89d7af12df0360dcb516535a0a9dccd4613ec6 Mon Sep 17 00:00:00 2001 From: FitseTLT Date: Thu, 19 Dec 2024 17:12:03 +0300 Subject: [PATCH 1/6] updated to request search on transaction or report action list change --- src/hooks/useSearchHighlightAndScroll.ts | 25 ++++++++++++++---------- 1 file changed, 15 insertions(+), 10 deletions(-) diff --git a/src/hooks/useSearchHighlightAndScroll.ts b/src/hooks/useSearchHighlightAndScroll.ts index a5937559fd2f..6cd53dcf9bd7 100644 --- a/src/hooks/useSearchHighlightAndScroll.ts +++ b/src/hooks/useSearchHighlightAndScroll.ts @@ -1,3 +1,4 @@ +import isEqual from 'lodash/isEqual'; import {useCallback, useEffect, useRef, useState} from 'react'; import type {OnyxCollection, OnyxEntry} from 'react-native-onyx'; import type {SearchQueryJSON} from '@components/Search/types'; @@ -34,20 +35,24 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans // Trigger search when a new report action is added while on chat or when a new transaction is added for the other search types. useEffect(() => { - const previousTransactionsLength = previousTransactions && Object.keys(previousTransactions).length; - const transactionsLength = transactions && Object.keys(transactions).length; + const previousTransactionIDList = Object.keys(previousTransactions ?? {}); + const transactionIDList = Object.keys(transactions ?? {}); - const reportActionsLength = reportActions && Object.values(reportActions).reduce((sum, curr) => sum + Object.keys(curr ?? {}).length, 0); - const prevReportActionsLength = previousReportActions && Object.values(previousReportActions).reduce((sum, curr) => sum + Object.keys(curr ?? {}).length, 0); - // Return early if search was already triggered or there's no change in current and previous data length - if (searchTriggeredRef.current || (!isChat && previousTransactionsLength === transactionsLength) || (isChat && reportActionsLength === prevReportActionsLength)) { + const reportActionIDList = Object.values(reportActions ?? {}) + .map((actions) => Object.keys(actions ?? {})) + .flat(); + const prevReportActionIDList = Object.values(previousReportActions ?? {}) + .map((actions) => Object.keys(actions ?? {})) + .flat(); + + if (searchTriggeredRef.current) { return; } - const newTransactionAdded = transactionsLength && typeof previousTransactionsLength === 'number' && transactionsLength > previousTransactionsLength; - const newReportActionAdded = reportActionsLength && typeof prevReportActionsLength === 'number' && reportActionsLength > prevReportActionsLength; + const hasTransactionChange = !isEqual(transactionIDList, previousTransactionIDList); + const hasReportActionChange = !isEqual(reportActionIDList, prevReportActionIDList); - // Check if a new transaction or report action was added - if ((!isChat && !!newTransactionAdded) || (isChat && !!newReportActionAdded)) { + // Check if there is a change in transaction or report action list + if ((!isChat && hasTransactionChange) || (isChat && hasReportActionChange)) { // Set the flag indicating the search is triggered by the hook triggeredByHookRef.current = true; From f2b8c3369643612a31dfc95bf0de67db3f63c1c1 Mon Sep 17 00:00:00 2001 From: FitseTLT Date: Thu, 19 Dec 2024 17:15:36 +0300 Subject: [PATCH 2/6] changed var name --- src/hooks/useSearchHighlightAndScroll.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/hooks/useSearchHighlightAndScroll.ts b/src/hooks/useSearchHighlightAndScroll.ts index 6cd53dcf9bd7..6110a5037a3a 100644 --- a/src/hooks/useSearchHighlightAndScroll.ts +++ b/src/hooks/useSearchHighlightAndScroll.ts @@ -41,7 +41,7 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans const reportActionIDList = Object.values(reportActions ?? {}) .map((actions) => Object.keys(actions ?? {})) .flat(); - const prevReportActionIDList = Object.values(previousReportActions ?? {}) + const previousReportActionIDList = Object.values(previousReportActions ?? {}) .map((actions) => Object.keys(actions ?? {})) .flat(); @@ -49,7 +49,7 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans return; } const hasTransactionChange = !isEqual(transactionIDList, previousTransactionIDList); - const hasReportActionChange = !isEqual(reportActionIDList, prevReportActionIDList); + const hasReportActionChange = !isEqual(reportActionIDList, previousReportActionIDList); // Check if there is a change in transaction or report action list if ((!isChat && hasTransactionChange) || (isChat && hasReportActionChange)) { From 08649be4f397817702b06cba556d53df43ce4eca Mon Sep 17 00:00:00 2001 From: FitseTLT Date: Thu, 26 Dec 2024 02:20:17 +0300 Subject: [PATCH 3/6] fix an edge case problem on deletion --- src/hooks/useSearchHighlightAndScroll.ts | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/src/hooks/useSearchHighlightAndScroll.ts b/src/hooks/useSearchHighlightAndScroll.ts index 6110a5037a3a..c27552ef0547 100644 --- a/src/hooks/useSearchHighlightAndScroll.ts +++ b/src/hooks/useSearchHighlightAndScroll.ts @@ -27,6 +27,7 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans // Ref to track if the search was triggered by this hook const triggeredByHookRef = useRef(false); const searchTriggeredRef = useRef(false); + const hasItemBeenAddedRef = useRef(false); const previousSearchResults = usePrevious(searchResults?.data); const [newSearchResultKey, setNewSearchResultKey] = useState(null); const highlightedIDs = useRef>(new Set()); @@ -51,6 +52,11 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans const hasTransactionChange = !isEqual(transactionIDList, previousTransactionIDList); const hasReportActionChange = !isEqual(reportActionIDList, previousReportActionIDList); + // We only want to highlight new items only if addition of transactions or report actions triggered the search. + // This is because on deletion of items sometimes the BE returns old items in place of the deleted ones + // but we don't want to highlight these old items although they are new to the current search result. + hasItemBeenAddedRef.current = isChat ? reportActionIDList.length > previousReportActionIDList.length : transactionIDList.length > previousTransactionIDList.length; + // Check if there is a change in transaction or report action list if ((!isChat && hasTransactionChange) || (isChat && hasReportActionChange)) { // Set the flag indicating the search is triggered by the hook @@ -92,7 +98,7 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans // Find new report action IDs that are not in the previousReportActionIDs and not already highlighted const newReportActionIDs = currentReportActionIDs.filter((id) => !previousReportActionIDs.includes(id) && !highlightedIDs.current.has(id)); - if (!triggeredByHookRef.current || newReportActionIDs.length === 0) { + if (!triggeredByHookRef.current || newReportActionIDs.length === 0 || !hasItemBeenAddedRef.current) { return; } @@ -108,7 +114,7 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans // Find new transaction IDs that are not in the previousTransactionIDs and not already highlighted const newTransactionIDs = currentTransactionIDs.filter((id) => !previousTransactionIDs.includes(id) && !highlightedIDs.current.has(id)); - if (!triggeredByHookRef.current || newTransactionIDs.length === 0) { + if (!triggeredByHookRef.current || newTransactionIDs.length === 0 || !hasItemBeenAddedRef.current) { return; } From af28f6eae4e4e5c34c757121a00b4d39ac9fe88d Mon Sep 17 00:00:00 2001 From: FitseTLT Date: Thu, 26 Dec 2024 02:30:07 +0300 Subject: [PATCH 4/6] revert --- src/hooks/useSearchHighlightAndScroll.ts | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) diff --git a/src/hooks/useSearchHighlightAndScroll.ts b/src/hooks/useSearchHighlightAndScroll.ts index c27552ef0547..6110a5037a3a 100644 --- a/src/hooks/useSearchHighlightAndScroll.ts +++ b/src/hooks/useSearchHighlightAndScroll.ts @@ -27,7 +27,6 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans // Ref to track if the search was triggered by this hook const triggeredByHookRef = useRef(false); const searchTriggeredRef = useRef(false); - const hasItemBeenAddedRef = useRef(false); const previousSearchResults = usePrevious(searchResults?.data); const [newSearchResultKey, setNewSearchResultKey] = useState(null); const highlightedIDs = useRef>(new Set()); @@ -52,11 +51,6 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans const hasTransactionChange = !isEqual(transactionIDList, previousTransactionIDList); const hasReportActionChange = !isEqual(reportActionIDList, previousReportActionIDList); - // We only want to highlight new items only if addition of transactions or report actions triggered the search. - // This is because on deletion of items sometimes the BE returns old items in place of the deleted ones - // but we don't want to highlight these old items although they are new to the current search result. - hasItemBeenAddedRef.current = isChat ? reportActionIDList.length > previousReportActionIDList.length : transactionIDList.length > previousTransactionIDList.length; - // Check if there is a change in transaction or report action list if ((!isChat && hasTransactionChange) || (isChat && hasReportActionChange)) { // Set the flag indicating the search is triggered by the hook @@ -98,7 +92,7 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans // Find new report action IDs that are not in the previousReportActionIDs and not already highlighted const newReportActionIDs = currentReportActionIDs.filter((id) => !previousReportActionIDs.includes(id) && !highlightedIDs.current.has(id)); - if (!triggeredByHookRef.current || newReportActionIDs.length === 0 || !hasItemBeenAddedRef.current) { + if (!triggeredByHookRef.current || newReportActionIDs.length === 0) { return; } @@ -114,7 +108,7 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans // Find new transaction IDs that are not in the previousTransactionIDs and not already highlighted const newTransactionIDs = currentTransactionIDs.filter((id) => !previousTransactionIDs.includes(id) && !highlightedIDs.current.has(id)); - if (!triggeredByHookRef.current || newTransactionIDs.length === 0 || !hasItemBeenAddedRef.current) { + if (!triggeredByHookRef.current || newTransactionIDs.length === 0) { return; } From e077cd8fc8edcb2c96e9022dbc844f30e8592a7b Mon Sep 17 00:00:00 2001 From: FitseTLT Date: Thu, 26 Dec 2024 17:58:03 +0300 Subject: [PATCH 5/6] Revert "revert" This reverts commit af28f6eae4e4e5c34c757121a00b4d39ac9fe88d. --- src/hooks/useSearchHighlightAndScroll.ts | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/src/hooks/useSearchHighlightAndScroll.ts b/src/hooks/useSearchHighlightAndScroll.ts index 6110a5037a3a..c27552ef0547 100644 --- a/src/hooks/useSearchHighlightAndScroll.ts +++ b/src/hooks/useSearchHighlightAndScroll.ts @@ -27,6 +27,7 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans // Ref to track if the search was triggered by this hook const triggeredByHookRef = useRef(false); const searchTriggeredRef = useRef(false); + const hasItemBeenAddedRef = useRef(false); const previousSearchResults = usePrevious(searchResults?.data); const [newSearchResultKey, setNewSearchResultKey] = useState(null); const highlightedIDs = useRef>(new Set()); @@ -51,6 +52,11 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans const hasTransactionChange = !isEqual(transactionIDList, previousTransactionIDList); const hasReportActionChange = !isEqual(reportActionIDList, previousReportActionIDList); + // We only want to highlight new items only if addition of transactions or report actions triggered the search. + // This is because on deletion of items sometimes the BE returns old items in place of the deleted ones + // but we don't want to highlight these old items although they are new to the current search result. + hasItemBeenAddedRef.current = isChat ? reportActionIDList.length > previousReportActionIDList.length : transactionIDList.length > previousTransactionIDList.length; + // Check if there is a change in transaction or report action list if ((!isChat && hasTransactionChange) || (isChat && hasReportActionChange)) { // Set the flag indicating the search is triggered by the hook @@ -92,7 +98,7 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans // Find new report action IDs that are not in the previousReportActionIDs and not already highlighted const newReportActionIDs = currentReportActionIDs.filter((id) => !previousReportActionIDs.includes(id) && !highlightedIDs.current.has(id)); - if (!triggeredByHookRef.current || newReportActionIDs.length === 0) { + if (!triggeredByHookRef.current || newReportActionIDs.length === 0 || !hasItemBeenAddedRef.current) { return; } @@ -108,7 +114,7 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans // Find new transaction IDs that are not in the previousTransactionIDs and not already highlighted const newTransactionIDs = currentTransactionIDs.filter((id) => !previousTransactionIDs.includes(id) && !highlightedIDs.current.has(id)); - if (!triggeredByHookRef.current || newTransactionIDs.length === 0) { + if (!triggeredByHookRef.current || newTransactionIDs.length === 0 || !hasItemBeenAddedRef.current) { return; } From 6c54952e3d021c442119c59346cfcbbbdc70d0b7 Mon Sep 17 00:00:00 2001 From: FitseTLT Date: Thu, 26 Dec 2024 18:08:30 +0300 Subject: [PATCH 6/6] minor fix --- src/hooks/useSearchHighlightAndScroll.ts | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/hooks/useSearchHighlightAndScroll.ts b/src/hooks/useSearchHighlightAndScroll.ts index c27552ef0547..99d7df5ba481 100644 --- a/src/hooks/useSearchHighlightAndScroll.ts +++ b/src/hooks/useSearchHighlightAndScroll.ts @@ -52,13 +52,13 @@ function useSearchHighlightAndScroll({searchResults, transactions, previousTrans const hasTransactionChange = !isEqual(transactionIDList, previousTransactionIDList); const hasReportActionChange = !isEqual(reportActionIDList, previousReportActionIDList); - // We only want to highlight new items only if addition of transactions or report actions triggered the search. - // This is because on deletion of items sometimes the BE returns old items in place of the deleted ones - // but we don't want to highlight these old items although they are new to the current search result. - hasItemBeenAddedRef.current = isChat ? reportActionIDList.length > previousReportActionIDList.length : transactionIDList.length > previousTransactionIDList.length; - // Check if there is a change in transaction or report action list if ((!isChat && hasTransactionChange) || (isChat && hasReportActionChange)) { + // We only want to highlight new items only if addition of transactions or report actions triggered the search. + // This is because on deletion of items sometimes the BE returns old items in place of the deleted ones + // but we don't want to highlight these old items although they are new to the current search result. + hasItemBeenAddedRef.current = isChat ? reportActionIDList.length > previousReportActionIDList.length : transactionIDList.length > previousTransactionIDList.length; + // Set the flag indicating the search is triggered by the hook triggeredByHookRef.current = true;