From fdb33ff7a963f2e1400a9790dcee189642105d6f Mon Sep 17 00:00:00 2001 From: Hubert Sosinski Date: Thu, 8 Oct 2026 18:15:46 +0200 Subject: [PATCH 1/3] Replace VISIBLE_REPORT_ACTIONS derived value with per-report and whole-map useOnyxState hooks --- __mocks__/react-native-onyx.ts | 4 +- src/ONYXKEYS.ts | 2 - .../AttachmentCarousel/extractAttachments.ts | 4 +- .../OptionRowLHN/OptionRowLHNData.tsx | 27 +- .../useMoneyRequestReportVisibleActions.ts | 7 +- src/components/ParentNavigationSubtitle.tsx | 3 +- .../Search/SearchAutocompleteList.tsx | 3 +- .../SearchRouterOptionsWarmer.tsx | 3 +- src/hooks/useAllVisibleReportActions.ts | 24 ++ src/hooks/useAutocompleteSuggestions.ts | 6 +- src/hooks/useReportActionsVisibility.ts | 7 +- src/hooks/useSearchSelector/base.ts | 3 +- src/hooks/useVisibleReportActions.ts | 24 ++ src/libs/OptionsListUtils/index.ts | 24 +- src/libs/OptionsListUtils/types.ts | 6 +- src/libs/ReportActionsUtils.ts | 20 +- src/libs/ReportAlternateTextUtils.ts | 12 +- src/libs/ReportUtils.ts | 11 +- src/libs/SearchUIUtils.ts | 4 +- src/libs/SidebarUtils.ts | 4 +- .../OnyxDerived/ONYX_DERIVED_VALUES.ts | 2 - .../configs/visibleReportActions.ts | 83 ------- src/libs/actions/Report/index.ts | 4 +- src/pages/Share/ShareTab.tsx | 3 +- src/pages/inbox/LinkedActionNotFoundGuard.tsx | 3 +- .../PopoverReportActionContextMenu.tsx | 5 +- src/selectors/ReportAction.ts | 10 - src/selectors/VisibleReportActions.ts | 121 +++++++++ src/types/onyx/DerivedValues.ts | 6 - src/types/onyx/ReportAction.ts | 5 +- src/types/onyx/index.ts | 5 +- .../LinkedActionNotFoundGuardTest.tsx | 1 - tests/ui/components/LHNOptionsListTest.tsx | 10 - .../OnyxDerived/visibleReportActionsTest.ts | 34 --- tests/unit/OnyxDerivedTest.tsx | 127 ---------- tests/unit/SidebarUtilsTest.ts | 6 - .../selectors/VisibleReportActionsTest.ts | 107 ++++++++ tests/unit/useAllVisibleReportActionsTest.tsx | 233 ++++++++++++++++++ ...seMoneyRequestReportVisibleActionsTest.tsx | 5 +- tests/unit/useReportActionsVisibilityTest.tsx | 81 +----- tests/unit/useVisibleReportActionsTest.tsx | 156 ++++++++++++ 41 files changed, 746 insertions(+), 459 deletions(-) create mode 100644 src/hooks/useAllVisibleReportActions.ts create mode 100644 src/hooks/useVisibleReportActions.ts delete mode 100644 src/libs/actions/OnyxDerived/configs/visibleReportActions.ts create mode 100644 src/selectors/VisibleReportActions.ts delete mode 100644 tests/unit/OnyxDerived/visibleReportActionsTest.ts create mode 100644 tests/unit/selectors/VisibleReportActionsTest.ts create mode 100644 tests/unit/useAllVisibleReportActionsTest.tsx create mode 100644 tests/unit/useVisibleReportActionsTest.tsx diff --git a/__mocks__/react-native-onyx.ts b/__mocks__/react-native-onyx.ts index 6db22ac1b627..f5b09f2949da 100644 --- a/__mocks__/react-native-onyx.ts +++ b/__mocks__/react-native-onyx.ts @@ -5,7 +5,7 @@ import type {ConnectOptions, OnyxKey} from 'react-native-onyx'; // eslint-disable-next-line no-restricted-imports -import Onyx, {useOnyx} from 'react-native-onyx'; +import Onyx, {useOnyx, useOnyxState} from 'react-native-onyx'; let connectCallbackDelay = 0; function addDelayToConnectCallback(delay: number) { @@ -41,4 +41,4 @@ const reactNativeOnyxMock: ReactNativeOnyxMock = { export default reactNativeOnyxMock; -export {useOnyx}; +export {useOnyx, useOnyxState}; diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts index d2b16572d106..9c773a448211 100755 --- a/src/ONYXKEYS.ts +++ b/src/ONYXKEYS.ts @@ -1405,7 +1405,6 @@ const ONYXKEYS = { REPORT_ATTRIBUTES: 'reportAttributes', REPORT_TRANSACTIONS_AND_VIOLATIONS: 'reportTransactionsAndViolations', OUTSTANDING_REPORTS_BY_POLICY_ID: 'outstandingReportsByPolicyID', - VISIBLE_REPORT_ACTIONS: 'visibleReportActions', NON_PERSONAL_AND_WORKSPACE_CARD_LIST: 'nonPersonalAndWorkspaceCardList', PERSONAL_AND_WORKSPACE_CARD_LIST: 'personalAndWorkspaceCardList', CARD_FEED_ERRORS: 'cardFeedErrors', @@ -1976,7 +1975,6 @@ type OnyxDerivedValuesMapping = { [ONYXKEYS.DERIVED.REPORT_ATTRIBUTES]: OnyxTypes.ReportAttributesDerivedValue; [ONYXKEYS.DERIVED.REPORT_TRANSACTIONS_AND_VIOLATIONS]: OnyxTypes.ReportTransactionsAndViolationsDerivedValue; [ONYXKEYS.DERIVED.OUTSTANDING_REPORTS_BY_POLICY_ID]: OnyxTypes.OutstandingReportsByPolicyIDDerivedValue; - [ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS]: OnyxTypes.VisibleReportActionsDerivedValue; [ONYXKEYS.DERIVED.NON_PERSONAL_AND_WORKSPACE_CARD_LIST]: OnyxTypes.NonPersonalAndWorkspaceCardListDerivedValue; [ONYXKEYS.DERIVED.PERSONAL_AND_WORKSPACE_CARD_LIST]: OnyxTypes.PersonalAndWorkspaceCardListDerivedValue; [ONYXKEYS.DERIVED.CARD_FEED_ERRORS]: OnyxTypes.CardFeedErrorsDerivedValue; diff --git a/src/components/Attachments/AttachmentCarousel/extractAttachments.ts b/src/components/Attachments/AttachmentCarousel/extractAttachments.ts index 1333bceb87db..ff30637024ac 100644 --- a/src/components/Attachments/AttachmentCarousel/extractAttachments.ts +++ b/src/components/Attachments/AttachmentCarousel/extractAttachments.ts @@ -6,7 +6,7 @@ import {canUserPerformWriteAction} from '@libs/ReportUtils'; import tryResolveUrlFromApiRoot from '@libs/tryResolveUrlFromApiRoot'; import CONST from '@src/CONST'; -import type {Report, ReportAction, ReportActions, VisibleReportActionsDerivedValue} from '@src/types/onyx'; +import type {Report, ReportAction, ReportActions, VisibleReportActions} from '@src/types/onyx'; import type {Note} from '@src/types/onyx/Report'; import type {OnyxEntry} from 'react-native-onyx'; @@ -34,7 +34,7 @@ function extractAttachments( reportActions?: OnyxEntry; report: OnyxEntry; isReportArchived: boolean | undefined; - visibleReportActionsData?: VisibleReportActionsDerivedValue; + visibleReportActionsData?: VisibleReportActions; }, ) { const targetNote = privateNotes?.[Number(accountID)]?.note ?? ''; diff --git a/src/components/LHNOptionsList/OptionRowLHN/OptionRowLHNData.tsx b/src/components/LHNOptionsList/OptionRowLHN/OptionRowLHNData.tsx index e90e1e05fb5a..92b2b2cd175d 100644 --- a/src/components/LHNOptionsList/OptionRowLHN/OptionRowLHNData.tsx +++ b/src/components/LHNOptionsList/OptionRowLHN/OptionRowLHNData.tsx @@ -8,6 +8,7 @@ import useGetExpensifyCardFromReportAction from '@hooks/useGetExpensifyCardFromR import useLocalize from '@hooks/useLocalize'; import useOnyx from '@hooks/useOnyx'; import useThemeStyles from '@hooks/useThemeStyles'; +import useVisibleReportActions from '@hooks/useVisibleReportActions'; import getNonEmptyStringOnyxID from '@libs/getNonEmptyStringOnyxID'; import {getLastVisibleActionIncludingTransactionThread, getOriginalMessage, isActionableTrackExpense, isInviteOrRemovedAction} from '@libs/ReportActionsUtils'; @@ -18,14 +19,13 @@ import CONST from '@src/CONST'; import {getMovedReportID} from '@src/libs/ModifiedExpenseMessage'; import ONYXKEYS from '@src/ONYXKEYS'; import type {ReportActions as ReportActionsType} from '@src/types/onyx'; -import type {VisibleReportActionsDerivedValue} from '@src/types/onyx/DerivedValues'; import type {Icon} from '@src/types/onyx/OnyxCommon'; import type {ViewStyle} from 'react-native'; import type {OnyxCollection} from 'react-native-onyx'; import {isTrackIntentUserSelector} from '@selectors/Onboarding'; -import React, {useCallback, useMemo} from 'react'; +import React, {useMemo} from 'react'; import {StyleSheet, View} from 'react-native'; import OptionRowLHN from './OptionRowLHN'; @@ -64,28 +64,7 @@ function OptionRowLHNData({ const [parentReportActions] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${getNonEmptyStringOnyxID(fullReport?.parentReportID)}`); const [transactionThreadReportActions] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${getNonEmptyStringOnyxID(oneTransactionThreadReportID)}`); - // Scoped VISIBLE_REPORT_ACTIONS selector - const visibleActionsSelector = useCallback( - (data: VisibleReportActionsDerivedValue | undefined) => { - if (!data) { - return undefined; - } - const result: VisibleReportActionsDerivedValue = {}; - const reportEntry = data[reportID]; - if (reportEntry) { - result[reportID] = reportEntry; - } - if (oneTransactionThreadReportID) { - const txThreadEntry = data[oneTransactionThreadReportID]; - if (txThreadEntry) { - result[oneTransactionThreadReportID] = txThreadEntry; - } - } - return result; - }, - [reportID, oneTransactionThreadReportID], - ); - const [visibleReportActionsData] = useOnyx(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS, {selector: visibleActionsSelector}); + const visibleReportActionsData = useVisibleReportActions(reportID, oneTransactionThreadReportID); // Per-item NVP subscription instead of collection-level subscription in parent const [reportNameValuePairs] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_NAME_VALUE_PAIRS}${reportID}`); diff --git a/src/components/MoneyRequestReportView/useMoneyRequestReportVisibleActions.ts b/src/components/MoneyRequestReportView/useMoneyRequestReportVisibleActions.ts index 2af2729445e9..c698870141b6 100644 --- a/src/components/MoneyRequestReportView/useMoneyRequestReportVisibleActions.ts +++ b/src/components/MoneyRequestReportView/useMoneyRequestReportVisibleActions.ts @@ -8,17 +8,14 @@ * non-inverted unified list, newest-first for the shared unread/mark-as-read hooks - so callers never * re-derive or re-sort them. */ -import useOnyx from '@hooks/useOnyx'; +import useVisibleReportActions from '@hooks/useVisibleReportActions'; import {isActionVisibleOnMoneyRequestReport} from '@libs/MoneyRequestReportUtils'; import {getFirstVisibleReportActionID, isDeletedParentAction, isIOUActionMatchingTransactionList, isReportActionVisible} from '@libs/ReportActionsUtils'; import CONST from '@src/CONST'; -import ONYXKEYS from '@src/ONYXKEYS'; import type * as OnyxTypes from '@src/types/onyx'; -import {reportVisibleActionsSelector} from '@selectors/ReportAction'; - type UseMoneyRequestReportVisibleActionsParams = { /** The report whose actions are being displayed */ reportID: string | undefined; @@ -66,7 +63,7 @@ function useMoneyRequestReportVisibleActions({ shouldShowHarvestCreatedAction, isOffline, }: UseMoneyRequestReportVisibleActionsParams): UseMoneyRequestReportVisibleActionsResult { - const [visibleReportActionsData] = useOnyx(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS, {selector: reportVisibleActionsSelector(reportID)}); + const visibleReportActionsData = useVisibleReportActions(reportID); const visibleReportActionsNewestFirst = reportActions.filter((reportAction) => { const isActionVisibleOnMoneyReport = isActionVisibleOnMoneyRequestReport(reportAction, shouldShowHarvestCreatedAction); diff --git a/src/components/ParentNavigationSubtitle.tsx b/src/components/ParentNavigationSubtitle.tsx index 530d9d639627..9d7ae83fedb1 100644 --- a/src/components/ParentNavigationSubtitle.tsx +++ b/src/components/ParentNavigationSubtitle.tsx @@ -7,6 +7,7 @@ import useRootNavigationState from '@hooks/useRootNavigationState'; import useStyleUtils from '@hooks/useStyleUtils'; import useTheme from '@hooks/useTheme'; import useThemeStyles from '@hooks/useThemeStyles'; +import useVisibleReportActions from '@hooks/useVisibleReportActions'; import {isFullScreenName} from '@libs/Navigation/helpers/isNavigatorName'; import Navigation from '@libs/Navigation/Navigation'; @@ -100,7 +101,7 @@ function ParentNavigationSubtitle({ const {translate} = useLocalize(); const [currentReport] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${reportID}`); const [report] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${parentReportID}`); - const [visibleReportActionsData] = useOnyx(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); + const visibleReportActionsData = useVisibleReportActions(parentReportID); const isReportArchived = useReportIsArchived(report?.reportID); const canUserPerformWriteAction = canUserPerformWriteActionReportUtils(report, isReportArchived); const hasAccessToParentReport = currentReport?.hasParentAccess !== false; diff --git a/src/components/Search/SearchAutocompleteList.tsx b/src/components/Search/SearchAutocompleteList.tsx index 413871add079..f84c0929b21d 100644 --- a/src/components/Search/SearchAutocompleteList.tsx +++ b/src/components/Search/SearchAutocompleteList.tsx @@ -7,6 +7,7 @@ import type {ListItem as NewListItem, ListItemProps} from '@components/Selection import SelectionListWithSections from '@components/SelectionList/SelectionListWithSections'; import type {Section, SelectionListWithSectionsHandle} from '@components/SelectionList/SelectionListWithSections/types'; +import useAllVisibleReportActions from '@hooks/useAllVisibleReportActions'; import useAutocompleteSuggestions from '@hooks/useAutocompleteSuggestions'; import useBottomSafeSafeAreaPaddingStyle from '@hooks/useBottomSafeSafeAreaPaddingStyle'; import {useCurrencyListActions} from '@hooks/useCurrencyList'; @@ -215,7 +216,7 @@ function SearchAutocompleteList({ }); const [policies = getEmptyObject>>()] = useOnyx(ONYXKEYS.COLLECTION.POLICY); const [allPolicyTags] = useOnyx(ONYXKEYS.COLLECTION.POLICY_TAGS); - const [visibleReportActionsData] = useOnyx(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); + const visibleReportActionsData = useAllVisibleReportActions(); const {activePolicyID} = useActivePolicyContext(); const sortedReportActionsData = useSortedReportActionsData(); const sortedActions = sortedReportActionsData?.sortedActions; diff --git a/src/components/Search/SearchRouter/SearchRouterOptionsWarmer.tsx b/src/components/Search/SearchRouter/SearchRouterOptionsWarmer.tsx index 6318b0bca6ba..aa5bb94c64ba 100644 --- a/src/components/Search/SearchRouter/SearchRouterOptionsWarmer.tsx +++ b/src/components/Search/SearchRouter/SearchRouterOptionsWarmer.tsx @@ -1,3 +1,4 @@ +import useAllVisibleReportActions from '@hooks/useAllVisibleReportActions'; import useFilteredOptions from '@hooks/useFilteredOptions'; import useOnyx from '@hooks/useOnyx'; import {useAllPersonalDetails} from '@hooks/usePersonalDetails'; @@ -38,7 +39,7 @@ function SearchRouterOptionsWarmer({onDone}: SearchRouterOptionsWarmerProps) { const reportAttributes = useReportAttributes(); const sortedReportActionsData = useSortedReportActionsData(); const [allPolicyTags] = useOnyx(ONYXKEYS.COLLECTION.POLICY_TAGS); - const [visibleReportActionsData] = useOnyx(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); + const visibleReportActionsData = useAllVisibleReportActions(); const churnVersionRef = useRef(0); useEffect(() => { diff --git a/src/hooks/useAllVisibleReportActions.ts b/src/hooks/useAllVisibleReportActions.ts new file mode 100644 index 000000000000..6ce66cc9725e --- /dev/null +++ b/src/hooks/useAllVisibleReportActions.ts @@ -0,0 +1,24 @@ +import ONYXKEYS from '@src/ONYXKEYS'; +import type {ReportActions, VisibleReportActions} from '@src/types/onyx'; + +import type {OnyxCollection} from 'react-native-onyx'; + +import {getAllVisibleReportActions} from '@selectors/VisibleReportActions'; +import {useOnyxState} from 'react-native-onyx'; + +const dependencies = [ONYXKEYS.COLLECTION.REPORT_ACTIONS, ONYXKEYS.SESSION]; + +/** The cached visibility of every report's actions, keyed by reportID. Reads live data, also inside the Search scope. */ +function useAllVisibleReportActions(): VisibleReportActions { + return useOnyxState( + (state) => { + // useOnyxState's state view types a collection key as one member, but at runtime it returns the whole collection + // eslint-disable-next-line @typescript-eslint/no-unsafe-type-assertion + const allReportActions = state[ONYXKEYS.COLLECTION.REPORT_ACTIONS] as OnyxCollection; + return getAllVisibleReportActions(allReportActions, state[ONYXKEYS.SESSION]?.accountID); + }, + {dependencies}, + ); +} + +export default useAllVisibleReportActions; diff --git a/src/hooks/useAutocompleteSuggestions.ts b/src/hooks/useAutocompleteSuggestions.ts index 2bd13293d02d..cbff1acb90e1 100644 --- a/src/hooks/useAutocompleteSuggestions.ts +++ b/src/hooks/useAutocompleteSuggestions.ts @@ -24,8 +24,8 @@ import {getDatePresets, getHasOptions} from '@libs/SearchUIUtils'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; -import type {CardFeeds, CardList, PersonalDetailsList, Policy} from '@src/types/onyx'; -import type {ReportAttributesDerivedValue, VisibleReportActionsDerivedValue} from '@src/types/onyx/DerivedValues'; +import type {CardFeeds, CardList, PersonalDetailsList, Policy, VisibleReportActions} from '@src/types/onyx'; +import type {ReportAttributesDerivedValue} from '@src/types/onyx/DerivedValues'; import type {Icon} from '@src/types/onyx/OnyxCommon'; import type {SearchDataTypes} from '@src/types/onyx/SearchResults'; import getEmptyArray from '@src/types/utils/getEmptyArray'; @@ -64,7 +64,7 @@ type UseAutocompleteSuggestionsParams = { countryCode: OnyxEntry; loginList: OnyxEntry>; policies: NonNullable>; - visibleReportActionsData?: VisibleReportActionsDerivedValue; + visibleReportActionsData?: VisibleReportActions; reportAttributesDerived?: ReportAttributesDerivedValue['reports']; currentUserAccountID: number; currentUserEmail: string; diff --git a/src/hooks/useReportActionsVisibility.ts b/src/hooks/useReportActionsVisibility.ts index b99e6d56d5e7..979933ec7653 100644 --- a/src/hooks/useReportActionsVisibility.ts +++ b/src/hooks/useReportActionsVisibility.ts @@ -6,8 +6,6 @@ import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import type {ReportAction} from '@src/types/onyx'; -import {reportVisibleActionsSelector} from '@selectors/ReportAction'; - import useConciergeSidePanelReportActions from './useConciergeSidePanelReportActions'; import useCurrentUserPersonalDetails from './useCurrentUserPersonalDetails'; import useIsInSidePanel from './useIsInSidePanel'; @@ -16,6 +14,7 @@ import useNetwork from './useNetwork'; import useOnyx from './useOnyx'; import useSidePanelState from './useSidePanelState'; import useTransactionsAndViolationsForReport from './useTransactionsAndViolationsForReport'; +import useVisibleReportActions from './useVisibleReportActions'; type UseReportActionsVisibilityParams = { reportID: string | undefined; @@ -62,9 +61,7 @@ function useReportActionsVisibility({ const [report] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${reportID}`); const [conciergeReportID] = useOnyx(ONYXKEYS.CONCIERGE_REPORT_ID); - const [visibleReportActionsData] = useOnyx(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS, { - selector: reportVisibleActionsSelector(reportID), - }); + const visibleReportActionsData = useVisibleReportActions(reportID); const isInSidePanel = useIsInSidePanel(); const isConciergeSidePanel = isInSidePanel && isConciergeChatReport(report, conciergeReportID); diff --git a/src/hooks/useSearchSelector/base.ts b/src/hooks/useSearchSelector/base.ts index f016fda7c9a3..219242094e08 100644 --- a/src/hooks/useSearchSelector/base.ts +++ b/src/hooks/useSearchSelector/base.ts @@ -1,5 +1,6 @@ import {usePersonalDetails} from '@components/OnyxListItemProvider'; +import useAllVisibleReportActions from '@hooks/useAllVisibleReportActions'; import {useCurrencyListActions} from '@hooks/useCurrencyList'; import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails'; import useDebounce from '@hooks/useDebounce'; @@ -198,7 +199,7 @@ function useSearchSelectorBase({ const [loginList] = useOnyx(ONYXKEYS.LOGINS, {selector: expensifyLoginsSelector}); const [allPolicies] = useOnyx(ONYXKEYS.COLLECTION.POLICY); const [draftComments] = useOnyx(ONYXKEYS.COLLECTION.REPORT_DRAFT_COMMENT); - const [visibleReportActionsData] = useOnyx(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); + const visibleReportActionsData = useAllVisibleReportActions(); const sortedReportActionsData = useSortedReportActionsData(); const sortedActions = sortedReportActionsData?.sortedActions; const transactionThreadIDs = sortedReportActionsData?.transactionThreadIDs; diff --git a/src/hooks/useVisibleReportActions.ts b/src/hooks/useVisibleReportActions.ts new file mode 100644 index 000000000000..0642457de86f --- /dev/null +++ b/src/hooks/useVisibleReportActions.ts @@ -0,0 +1,24 @@ +import ONYXKEYS from '@src/ONYXKEYS'; +import type {VisibleReportActions} from '@src/types/onyx'; + +import {getVisibleReportActionsForReports} from '@selectors/VisibleReportActions'; +import {useOnyxState} from 'react-native-onyx'; + +/** + * The cached visibility of one report's actions, plus its transaction thread's when given, in the `{[reportID]: visibility}` + * shape `isReportActionVisible` expects. It depends only on those reports' actions, so writes to other reports don't re-run it. + */ +function useVisibleReportActions(reportID: string | undefined, transactionThreadReportID?: string): VisibleReportActions | undefined { + const reportIDs = [reportID, transactionThreadReportID].filter((id): id is string => !!id); + + return useOnyxState( + (state) => + getVisibleReportActionsForReports( + reportIDs.map((id) => [id, state[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${id}`]]), + state[ONYXKEYS.SESSION]?.accountID, + ), + {dependencies: [...reportIDs.map((id) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${id}` as const), ONYXKEYS.SESSION]}, + ); +} + +export default useVisibleReportActions; diff --git a/src/libs/OptionsListUtils/index.ts b/src/libs/OptionsListUtils/index.ts index 65801e62558e..1a88768a4baa 100644 --- a/src/libs/OptionsListUtils/index.ts +++ b/src/libs/OptionsListUtils/index.ts @@ -89,7 +89,7 @@ import type { ReportAction, ReportAttributesDerivedValue, Rule, - VisibleReportActionsDerivedValue, + VisibleReportActions, } from '@src/types/onyx'; import type {Participant} from '@src/types/onyx/IOU'; import {isEmptyObject} from '@src/types/utils/EmptyObject'; @@ -220,7 +220,7 @@ type GetAlternateTextConfig = { // We'll make it required in the next PR. Ref: https://github.com/Expensify/App/issues/66415 policy?: OnyxEntry; invoiceReceiverPolicy?: OnyxEntry; - visibleReportActionsData?: VisibleReportActionsDerivedValue; + visibleReportActionsData?: VisibleReportActions; translate?: LocalizedTranslate; reportAttributesDerived?: ReportAttributesDerivedValue['reports']; policyTags?: OnyxEntry; @@ -386,7 +386,7 @@ type CreateOptionParams = { config?: PreviewConfig; reportAttributesDerived?: ReportAttributesDerivedValue['reports']; policyTags?: OnyxEntry; - visibleReportActionsData?: VisibleReportActionsDerivedValue; + visibleReportActionsData?: VisibleReportActions; translate?: LocalizedTranslate; convertToDisplayString: CurrencyListActionsContextType['convertToDisplayString']; convertToDisplayStringWithoutCurrency?: CurrencyListActionsContextType['convertToDisplayStringWithoutCurrency']; @@ -702,7 +702,7 @@ type GetReportDisplayOptionParams = { currentUserAccountID: number; reportAttributesDerived?: ReportAttributesDerivedValue['reports']; policyTags?: OnyxEntry; - visibleReportActionsData?: VisibleReportActionsDerivedValue; + visibleReportActionsData?: VisibleReportActions; convertToDisplayString: CurrencyListActionsContextType['convertToDisplayString']; pendingDeleteMemberAccountIDs: string[] | undefined; }; @@ -789,7 +789,7 @@ function getPolicyExpenseReportOption( rules: OnyxCollection, reportAttributesDerived?: ReportAttributesDerivedValue['reports'], policyTags?: OnyxEntry, - visibleReportActionsData: VisibleReportActionsDerivedValue = {}, + visibleReportActionsData: VisibleReportActions = {}, ): SearchOptionData { const {translate, dateFnsLocale, convertToDisplayString} = localize; const visibleParticipantAccountIDs = Object.entries(expenseReport?.participants ?? {}) @@ -954,7 +954,7 @@ function processReport( convertToDisplayString: CurrencyListActionsContextType['convertToDisplayString']; reportAttributesDerived?: ReportAttributesDerivedValue['reports']; policyTags?: OnyxEntry; - visibleReportActionsData?: VisibleReportActionsDerivedValue; + visibleReportActionsData?: VisibleReportActions; isTrackIntentUser?: boolean; // TODO: Remove optional (?) once all callers pass sortedActions. Refactor issue: https://github.com/Expensify/App/issues/66381 sortedActions?: Record; @@ -1024,7 +1024,7 @@ const reportSortComparator = (report: Report, privateIsArchivedMap: PrivateIsArc /** Builds an option list with pre-filtered reports and lazy contact shells. */ // Stable default used by the cache when no report-action data is provided. -const EMPTY_VISIBLE_REPORT_ACTIONS: VisibleReportActionsDerivedValue = {}; +const EMPTY_VISIBLE_REPORT_ACTIONS: VisibleReportActions = {}; // Each configuration gets its own entry and is reused while its Onyx inputs are unchanged. const filteredOptionListCache = new Map(); @@ -1212,7 +1212,7 @@ function createFilteredOptionList( }, rules: OnyxCollection, policyTags?: OnyxCollection, - visibleReportActionsData: VisibleReportActionsDerivedValue = EMPTY_VISIBLE_REPORT_ACTIONS, + visibleReportActionsData: VisibleReportActions = EMPTY_VISIBLE_REPORT_ACTIONS, isTrackIntentUser?: boolean, // TODO: Remove optional (?) once all callers pass sortedActions. Refactor issue: https://github.com/Expensify/App/issues/66381 sortedActions?: Record, @@ -1430,7 +1430,7 @@ type CreateOptionFromReportParams = { reportAttributesDerived?: ReportAttributesDerivedValue['reports']; config?: PreviewConfig; policyTags?: OnyxEntry; - visibleReportActionsData?: VisibleReportActionsDerivedValue; + visibleReportActionsData?: VisibleReportActions; isTrackIntentUser?: boolean; convertToDisplayString: CurrencyListActionsContextType['convertToDisplayString']; convertToDisplayStringWithoutCurrency?: CurrencyListActionsContextType['convertToDisplayStringWithoutCurrency']; @@ -1815,7 +1815,7 @@ function getUserToInviteOption({ currentUserAccountID, visibleReportActionsData = {}, rules, -}: GetUserToInviteConfig & {visibleReportActionsData?: VisibleReportActionsDerivedValue; dateFnsLocale: DateFnsLocale | undefined; rules: OnyxCollection}): SearchOptionData | null { +}: GetUserToInviteConfig & {visibleReportActionsData?: VisibleReportActions; dateFnsLocale: DateFnsLocale | undefined; rules: OnyxCollection}): SearchOptionData | null { if (!searchValue) { return null; } @@ -2135,7 +2135,7 @@ function prepareReportOptionsForDisplay( conciergeReportID: string | undefined, sortedActions: Record | undefined, rules: OnyxCollection, - visibleReportActionsData: VisibleReportActionsDerivedValue = EMPTY_VISIBLE_REPORT_ACTIONS, + visibleReportActionsData: VisibleReportActions = EMPTY_VISIBLE_REPORT_ACTIONS, reportAttributesDerived?: ReportAttributesDerivedValue['reports'], policyTags?: OnyxCollection, isTrackIntentUser?: boolean, @@ -2711,7 +2711,7 @@ type SearchOptionsConfig = { shouldShowGBR?: boolean; shouldUnreadBeBold?: boolean; loginList: OnyxEntry; - visibleReportActionsData?: VisibleReportActionsDerivedValue; + visibleReportActionsData?: VisibleReportActions; policyCollection: OnyxCollection; currentUserAccountID: number; currentUserEmail: string; diff --git a/src/libs/OptionsListUtils/types.ts b/src/libs/OptionsListUtils/types.ts index f548aab4e3b4..69332be7a856 100644 --- a/src/libs/OptionsListUtils/types.ts +++ b/src/libs/OptionsListUtils/types.ts @@ -19,7 +19,7 @@ import type { ReportActions, ReportAttributesDerivedValue, TransactionViolation, - VisibleReportActionsDerivedValue, + VisibleReportActions, } from '@src/types/onyx'; import type {Icon, PendingAction} from '@src/types/onyx/OnyxCommon'; @@ -108,7 +108,7 @@ type LazyHydrationContext = { policiesCollection: OnyxCollection; reportAttributesDerived: ReportAttributesDerivedValue['reports'] | undefined; policyTags: OnyxCollection; - visibleReportActionsData: VisibleReportActionsDerivedValue; + visibleReportActionsData: VisibleReportActions; privateIsArchivedMap: PrivateIsArchivedMap; conciergeReportID: string | undefined; currentUserAccountID: number; @@ -289,7 +289,7 @@ type GetOptionsConfig = { includeUserToInvite?: boolean; shouldAcceptName?: boolean; countryCode?: number; - visibleReportActionsData?: VisibleReportActionsDerivedValue; + visibleReportActionsData?: VisibleReportActions; reportAttributesDerived?: ReportAttributesDerivedValue['reports']; sortedActions?: Record; transactionThreadIDs?: Record; diff --git a/src/libs/ReportActionsUtils.ts b/src/libs/ReportActionsUtils.ts index eeffab614908..52b9eefe5821 100644 --- a/src/libs/ReportActionsUtils.ts +++ b/src/libs/ReportActionsUtils.ts @@ -23,7 +23,7 @@ import type { PrivatePersonalDetails, ReportMetadata, ReportNameValuePairs, - VisibleReportActionsDerivedValue, + VisibleReportActions, } from '@src/types/onyx'; import type { DecisionName, @@ -1404,14 +1404,14 @@ function shouldHideNewMarker(reportAction: OnyxEntry, isOffline: b } /** - * Checks if a report action is visible using the pre-computed derived value when available, + * Checks if a report action is visible using the cached visibility when available, * falling back to runtime calculation if not. */ function isReportActionVisible( reportAction: OnyxEntry, reportID: string | undefined, canUserPerformWriteAction?: boolean, - visibleReportActions?: VisibleReportActionsDerivedValue, + visibleReportActions?: VisibleReportActions, // TODO: Remove optional (?) once all callers pass currentUserAccountID. Refactor issue: https://github.com/Expensify/App/issues/66408 currentUserAccountID?: number, ): boolean { @@ -1432,7 +1432,7 @@ function isReportActionVisible( return shouldReportActionBeVisible(reportAction, reportAction.reportActionID, canUserPerformWriteAction, currentUserAccountID, reportID); } const staticVisibility = reportCache[reportAction.reportActionID]; - // If action is not in derived value cache, fall back to runtime calculation + // If action is not in the visibility cache, fall back to runtime calculation if (staticVisibility === undefined) { return shouldReportActionBeVisible(reportAction, reportAction.reportActionID, canUserPerformWriteAction, currentUserAccountID, reportID); } @@ -1448,13 +1448,13 @@ function isReportActionVisible( } /** - * Checks if a report action is visible as last action using the pre-computed derived value when available, + * Checks if a report action is visible as last action using the cached visibility when available, * falling back to runtime calculation if not. */ function isReportActionVisibleAsLastAction( reportAction: OnyxInputOrEntry, canUserPerformWriteAction?: boolean, - visibleReportActions?: VisibleReportActionsDerivedValue, + visibleReportActions?: VisibleReportActions, reportID?: string, // TODO: Remove optional (?) once all callers pass currentUserAccountID. Refactor issue: https://github.com/Expensify/App/issues/66408 currentUserAccountID?: number, @@ -1512,7 +1512,7 @@ function getLastVisibleAction( canUserPerformWriteAction?: boolean, actionsToMerge: Record | null> = {}, reportActionsParam: OnyxCollection = allReportActions, - visibleReportActionsData?: VisibleReportActionsDerivedValue, + visibleReportActionsData?: VisibleReportActions, // TODO: Remove optional (?) once all callers pass currentUserAccountID. Refactor issue: https://github.com/Expensify/App/issues/66408 currentUserAccountID?: number, ): OnyxEntry { @@ -1546,7 +1546,7 @@ function getLastVisibleActionIncludingTransactionThread( reportID: string | undefined, canUserPerformWriteAction?: boolean, reportActionsParam: OnyxCollection = allReportActions, - visibleReportActionsData?: VisibleReportActionsDerivedValue, + visibleReportActionsData?: VisibleReportActions, transactionThreadReportID?: string, // TODO: Remove optional (?) once all callers pass currentUserAccountID. Refactor issue: https://github.com/Expensify/App/issues/66408 currentUserAccountID?: number, @@ -1592,7 +1592,7 @@ function getLastVisibleMessage( canUserPerformWriteAction?: boolean, actionsToMerge: Record | null> = {}, reportAction: OnyxInputOrEntry | undefined = undefined, - visibleReportActionsData?: VisibleReportActionsDerivedValue, + visibleReportActionsData?: VisibleReportActions, // TODO: Remove optional (?) once all callers pass currentUserAccountID. Refactor issue: https://github.com/Expensify/App/issues/66408 currentUserAccountID?: number, ): LastVisibleMessage { @@ -1700,7 +1700,7 @@ function getSortedReportActionsForDisplay( reportActions: OnyxEntry | ReportAction[], canUserPerformWriteAction?: boolean, shouldIncludeInvisibleActions = false, - visibleReportActionsData?: VisibleReportActionsDerivedValue, + visibleReportActionsData?: VisibleReportActions, reportID?: string, ): ReportAction[] { let filteredReportActions: ReportAction[] = []; diff --git a/src/libs/ReportAlternateTextUtils.ts b/src/libs/ReportAlternateTextUtils.ts index cbb7f3a3ecc3..4fbbe5ff5516 100644 --- a/src/libs/ReportAlternateTextUtils.ts +++ b/src/libs/ReportAlternateTextUtils.ts @@ -18,7 +18,7 @@ import type { ReportMetadata, Rule, Transaction, - VisibleReportActionsDerivedValue, + VisibleReportActions, WorkspaceCardsList, } from '@src/types/onyx'; import {isEmptyObject} from '@src/types/utils/EmptyObject'; @@ -377,7 +377,7 @@ function getLatestVisibleMoneyRequestAction( reportID: string, canUserPerformWrite: boolean | undefined, sortedReportActions: ReportAction[] = [], - visibleReportActionsData?: VisibleReportActionsDerivedValue, + visibleReportActionsData?: VisibleReportActions, ): OnyxEntry> { return sortedReportActions.find( (reportAction): reportAction is ReportAction => @@ -421,7 +421,7 @@ type LastActionContext = { function resolveLastActionContext( report: Report, isReportArchived: boolean | undefined, - visibleReportActionsData: VisibleReportActionsDerivedValue | undefined, + visibleReportActionsData: VisibleReportActions | undefined, oneTransactionThreadReportID?: string, ): LastActionContext { const canUserPerformWrite = canUserPerformWriteAction(report, isReportArchived); @@ -448,7 +448,7 @@ function getLastActorDisplayNameFromLastVisibleActions( personalDetails: OnyxEntry, privateIsArchived: boolean | undefined, translate: LocalizedTranslate, - visibleReportActionsData?: VisibleReportActionsDerivedValue, + visibleReportActionsData?: VisibleReportActions, lastAction?: OnyxEntry, oneTransactionThreadReportID?: string, ): string { @@ -516,7 +516,7 @@ function getLastMessageTextForReport({ isReportArchived?: boolean; policyForMovingExpensesID?: string; reportMetadata?: OnyxEntry; - visibleReportActionsDataParam?: VisibleReportActionsDerivedValue; + visibleReportActionsDataParam?: VisibleReportActions; lastAction?: OnyxEntry; reportAttributesDerived?: ReportAttributesDerivedValue['reports']; policyTags?: OnyxEntry; @@ -1180,7 +1180,7 @@ type GetReportAlternateTextParams = { privateIsArchived: boolean; conciergeReportID: string | undefined; reportAttributesDerived?: ReportAttributesDerivedValue['reports']; - visibleReportActionsData?: VisibleReportActionsDerivedValue; + visibleReportActionsData?: VisibleReportActions; sortedActions?: Record; oneTransactionThreadReportID?: string; lastOriginalAction?: OnyxEntry; diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts index 439fa74a2dea..3f38827e39fc 100644 --- a/src/libs/ReportUtils.ts +++ b/src/libs/ReportUtils.ts @@ -52,7 +52,7 @@ import type { TransactionViolation, TransactionViolations, ViolationName, - VisibleReportActionsDerivedValue, + VisibleReportActions, } from '@src/types/onyx'; import type {ReportTransactionsAndViolations} from '@src/types/onyx/DerivedValues'; import type {Attendee, Participant} from '@src/types/onyx/IOU'; @@ -10145,12 +10145,7 @@ function isReportNotFound(report: OnyxEntry): boolean { /** * Check if the report is the parent report of the currently viewed report or at least one child report has report action */ -function shouldHideReport( - report: OnyxEntry, - currentReportId: string | undefined, - isReportArchived: boolean | undefined, - visibleReportActionsData?: VisibleReportActionsDerivedValue, -): boolean { +function shouldHideReport(report: OnyxEntry, currentReportId: string | undefined, isReportArchived: boolean | undefined, visibleReportActionsData?: VisibleReportActions): boolean { const currentReport = getReportOrDraftReport(currentReportId); const parentReport = getParentReport(!isEmptyObject(currentReport) ? currentReport : undefined); const reportActions = allReportActions?.[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report?.reportID}`] ?? {}; @@ -11381,7 +11376,7 @@ function navigateToLinkedReportAction( isInNarrowPaneModal: boolean, canUserPerformWrite: boolean | undefined, isOffline: boolean, - visibleReportActionsData?: VisibleReportActionsDerivedValue, + visibleReportActionsData?: VisibleReportActions, ) { if (isInNarrowPaneModal) { const rootState = navigationRef.current?.getRootState(); diff --git a/src/libs/SearchUIUtils.ts b/src/libs/SearchUIUtils.ts index ed706c659eb5..11926a6f4dd3 100644 --- a/src/libs/SearchUIUtils.ts +++ b/src/libs/SearchUIUtils.ts @@ -626,7 +626,7 @@ type GetSectionsParams = { cardList?: OnyxEntry; nonPersonalAndWorkspaceCardList?: OnyxEntry; customCardNames?: Record; - visibleReportActionsData?: OnyxTypes.VisibleReportActionsDerivedValue; + visibleReportActionsData?: OnyxTypes.VisibleReportActions; conciergeReportID: string | undefined; onyxPersonalDetailsList?: OnyxTypes.PersonalDetailsList; isAttendeesEnabledForMovingPolicy?: boolean; @@ -2551,7 +2551,7 @@ function createAndOpenSearchTransactionThread({ function getReportActionsSections( data: OnyxTypes.SearchResults['data'], reportAttributesDerivedValue: OnyxTypes.ReportAttributesDerivedValue['reports'] | undefined, - visibleReportActionsData?: OnyxTypes.VisibleReportActionsDerivedValue, + visibleReportActionsData?: OnyxTypes.VisibleReportActions, ): [ReportActionListItemType[], number] { const reportActionItems: ReportActionListItemType[] = []; diff --git a/src/libs/SidebarUtils.ts b/src/libs/SidebarUtils.ts index 956a15f5adcf..dbf68c0cf222 100644 --- a/src/libs/SidebarUtils.ts +++ b/src/libs/SidebarUtils.ts @@ -16,7 +16,7 @@ import type { ReportNameValuePairs, Transaction, TransactionViolation, - VisibleReportActionsDerivedValue, + VisibleReportActions, } from '@src/types/onyx'; import type {ReportAttributes} from '@src/types/onyx/DerivedValues'; import type {Errors} from '@src/types/onyx/OnyxCommon'; @@ -748,7 +748,7 @@ function getOptionData({ movedFromReport?: OnyxEntry; movedToReport?: OnyxEntry; currentUserAccountID: number; - visibleReportActionsData?: VisibleReportActionsDerivedValue; + visibleReportActionsData?: VisibleReportActions; reportAttributesDerived?: ReportAttributesDerivedValue['reports']; policyTags?: OnyxEntry; currentUserLogin: string; diff --git a/src/libs/actions/OnyxDerived/ONYX_DERIVED_VALUES.ts b/src/libs/actions/OnyxDerived/ONYX_DERIVED_VALUES.ts index 4ea4fabd9560..8cea095800b3 100644 --- a/src/libs/actions/OnyxDerived/ONYX_DERIVED_VALUES.ts +++ b/src/libs/actions/OnyxDerived/ONYX_DERIVED_VALUES.ts @@ -15,7 +15,6 @@ import reportAttributesConfig from './configs/reportAttributes'; import reportTransactionsAndViolationsConfig from './configs/reportTransactionsAndViolations'; import sortedReportActionsConfig from './configs/sortedReportActions'; import spendDataSignatureConfig from './configs/spendDataSignature'; -import visibleReportActionsConfig from './configs/visibleReportActions'; /** * Global map of derived configs. @@ -25,7 +24,6 @@ const ONYX_DERIVED_VALUES = { [ONYXKEYS.DERIVED.REPORT_ATTRIBUTES]: reportAttributesConfig, [ONYXKEYS.DERIVED.REPORT_TRANSACTIONS_AND_VIOLATIONS]: reportTransactionsAndViolationsConfig, [ONYXKEYS.DERIVED.OUTSTANDING_REPORTS_BY_POLICY_ID]: outstandingReportsByPolicyIDConfig, - [ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS]: visibleReportActionsConfig, [ONYXKEYS.DERIVED.NON_PERSONAL_AND_WORKSPACE_CARD_LIST]: nonPersonalAndWorkspaceCardListConfig, [ONYXKEYS.DERIVED.PERSONAL_AND_WORKSPACE_CARD_LIST]: personalAndWorkspaceCardListConfig, [ONYXKEYS.DERIVED.CARD_FEED_ERRORS]: cardFeedErrorsConfig, diff --git a/src/libs/actions/OnyxDerived/configs/visibleReportActions.ts b/src/libs/actions/OnyxDerived/configs/visibleReportActions.ts deleted file mode 100644 index b30f87c7ea41..000000000000 --- a/src/libs/actions/OnyxDerived/configs/visibleReportActions.ts +++ /dev/null @@ -1,83 +0,0 @@ -import {isActionableWhisperRequiringWritePermission, isActionOfType, isConciergeCategoryOptions, shouldReportActionBeVisible} from '@libs/ReportActionsUtils'; - -import createOnyxDerivedValueConfig from '@userActions/OnyxDerived/createOnyxDerivedValueConfig'; - -import CONST from '@src/CONST'; -import ONYXKEYS from '@src/ONYXKEYS'; -import type {ReportAction, ReportActions} from '@src/types/onyx'; -import type {VisibleReportActionsDerivedValue} from '@src/types/onyx/DerivedValues'; - -/** - * Returns true if the action's visibility depends on runtime context that can't be cached, - * such as write permissions, policy settings, or sibling actions. - */ -function shouldSkipCachingAction(action: ReportAction): boolean { - return isActionableWhisperRequiringWritePermission(action) || isConciergeCategoryOptions(action) || isActionOfType(action, CONST.REPORT.ACTIONS.TYPE.MARKED_REIMBURSED); -} - -/** - * Builds a report's action-visibility map (keyed by `reportActionID`) from its full set of report - * actions. Rebuilding the whole map rather than updating individual entries keeps deletions correct: - * a removed action is absent from `reportActions`, so it drops out of the result. - */ -function computeReportVisibility(reportActions: ReportActions, currentUserAccountID: number | undefined): Record { - const reportVisibility: Record = {}; - - for (const [actionID, action] of Object.entries(reportActions)) { - if (!action) { - continue; - } - // Skip deprecated keys (e.g. sequenceNumber-keyed duplicates) so they - // cannot overwrite the canonical entry's visibility with false. - if (actionID !== action.reportActionID) { - continue; - } - if (shouldSkipCachingAction(action)) { - continue; - } - reportVisibility[action.reportActionID] = shouldReportActionBeVisible(action, actionID, undefined, currentUserAccountID); - } - - return reportVisibility; -} - -export default createOnyxDerivedValueConfig({ - key: ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS, - // Note: REPORT dependency is needed both to trigger recompute when reports change - // (for UNREPORTED_TRANSACTION/MOVED_TRANSACTION visibility) AND to provide the current - // report collection to the visibility check, avoiding stale data from global connections. - // SESSION dependency is needed for whisper targeting when user changes. - dependencies: [ONYXKEYS.COLLECTION.REPORT_ACTIONS, ONYXKEYS.SESSION], - compute: ([allReportActions, session], {sourceValues, currentValue, triggeredKeys}): VisibleReportActionsDerivedValue => { - if (!allReportActions) { - return {}; - } - - const currentUserAccountID = session?.accountID; - const reportActionsUpdates = sourceValues?.[ONYXKEYS.COLLECTION.REPORT_ACTIONS]; - - // Recompute only the reports whose actions changed when we have a usable delta. Otherwise - // recompute everything: on first load, when there's no delta, or on a SESSION change (the - // user changed, which affects whisper targeting for every report). SESSION is checked via - // triggeredKeys, not sourceValues, so a session cleared to `undefined` still forces the full recompute. - const isIncremental = !!reportActionsUpdates && !triggeredKeys?.has(ONYXKEYS.SESSION) && !!currentValue; - - const result: VisibleReportActionsDerivedValue = isIncremental ? {...currentValue} : {}; - const reportActionsKeysToProcess = isIncremental ? Object.keys(reportActionsUpdates) : Object.keys(allReportActions); - - for (const reportActionsKey of reportActionsKeysToProcess) { - const reportID = reportActionsKey.replace(ONYXKEYS.COLLECTION.REPORT_ACTIONS, ''); - const reportActions = allReportActions[reportActionsKey]; - - // The member was removed entirely — drop the report from the result. - if (!reportActions) { - delete result[reportID]; - continue; - } - - result[reportID] = computeReportVisibility(reportActions, currentUserAccountID); - } - - return result; - }, -}); diff --git a/src/libs/actions/Report/index.ts b/src/libs/actions/Report/index.ts index 44e0e35afd93..fecf847fde42 100644 --- a/src/libs/actions/Report/index.ts +++ b/src/libs/actions/Report/index.ts @@ -253,7 +253,7 @@ import type { Transaction, TransactionViolation, TransactionViolations, - VisibleReportActionsDerivedValue, + VisibleReportActions, } from '@src/types/onyx'; import type {Decision} from '@src/types/onyx/OriginalMessage'; import type PersonalDetails from '@src/types/onyx/PersonalDetails'; @@ -3376,7 +3376,7 @@ function deleteReportComment( isOriginalReportArchived: boolean | undefined, currentEmail: string, isOffline: boolean, - visibleReportActionsDataParam?: VisibleReportActionsDerivedValue, + visibleReportActionsDataParam?: VisibleReportActions, ) { const reportID = report?.reportID; const originalReportID = getOriginalReportID(reportID, reportAction, reportActions, isOffline); diff --git a/src/pages/Share/ShareTab.tsx b/src/pages/Share/ShareTab.tsx index 20e568250960..4aa976f6eae6 100644 --- a/src/pages/Share/ShareTab.tsx +++ b/src/pages/Share/ShareTab.tsx @@ -4,6 +4,7 @@ import SelectionList from '@components/SelectionList'; import InviteMemberListItem from '@components/SelectionList/ListItem/InviteMemberListItem'; import Text from '@components/Text'; +import useAllVisibleReportActions from '@hooks/useAllVisibleReportActions'; import {useCurrencyListActions} from '@hooks/useCurrencyList'; import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails'; import useDebouncedState from '@hooks/useDebouncedState'; @@ -53,7 +54,7 @@ function ShareTab() { const [allPolicies] = useOnyx(ONYXKEYS.COLLECTION.POLICY); const {activePolicyID} = useActivePolicyContext(); const [draftComments] = useOnyx(ONYXKEYS.COLLECTION.REPORT_DRAFT_COMMENT); - const [visibleReportActionsData] = useOnyx(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); + const visibleReportActionsData = useAllVisibleReportActions(); const sortedReportActionsData = useSortedReportActionsData(); const sortedActions = sortedReportActionsData?.sortedActions; const [conciergeReportID] = useOnyx(ONYXKEYS.CONCIERGE_REPORT_ID); diff --git a/src/pages/inbox/LinkedActionNotFoundGuard.tsx b/src/pages/inbox/LinkedActionNotFoundGuard.tsx index d77c311a4068..6d285c0aea42 100644 --- a/src/pages/inbox/LinkedActionNotFoundGuard.tsx +++ b/src/pages/inbox/LinkedActionNotFoundGuard.tsx @@ -1,6 +1,7 @@ import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails'; import useOnyx from '@hooks/useOnyx'; import useReportIsArchived from '@hooks/useReportIsArchived'; +import useVisibleReportActions from '@hooks/useVisibleReportActions'; import getNonEmptyStringOnyxID from '@libs/getNonEmptyStringOnyxID'; import Navigation from '@libs/Navigation/Navigation'; @@ -65,12 +66,12 @@ function LinkedActionNotFoundGate({reportActionIDFromRoute, children}: LinkedAct const [linkedAction] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportIDFromRoute}`, { selector: (actions: OnyxEntry) => getReportActionByIDSelector(actions, reportActionIDFromRoute), }); - const [visibleReportActionsData] = useOnyx(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); const isReportArchived = useReportIsArchived(reportIDFromRoute); // --- Linked action status --- const actionReportID = linkedAction?.reportID ?? reportIDFromRoute; + const visibleReportActionsData = useVisibleReportActions(actionReportID); const hasNoActionReportID = !!linkedAction && !actionReportID; const isActionHidden = !!linkedAction && !!actionReportID && !isReportActionVisible(linkedAction, actionReportID, canUserPerformWriteAction(report, isReportArchived), visibleReportActionsData); diff --git a/src/pages/inbox/report/ContextMenu/PopoverReportActionContextMenu.tsx b/src/pages/inbox/report/ContextMenu/PopoverReportActionContextMenu.tsx index e5ca3a3d9ba4..4a86c18efffa 100644 --- a/src/pages/inbox/report/ContextMenu/PopoverReportActionContextMenu.tsx +++ b/src/pages/inbox/report/ContextMenu/PopoverReportActionContextMenu.tsx @@ -17,6 +17,7 @@ import useParentReportAction from '@hooks/useParentReportAction'; import useReportIsArchived from '@hooks/useReportIsArchived'; import useReportTransactionsCollection from '@hooks/useReportTransactionsCollection'; import useTransactionsAndViolationsForReport from '@hooks/useTransactionsAndViolationsForReport'; +import useVisibleReportActions from '@hooks/useVisibleReportActions'; import {deleteTrackExpense} from '@libs/actions/IOU/TrackExpense'; import {deleteAppReport, deleteReportComment} from '@libs/actions/Report'; @@ -101,7 +102,6 @@ function PopoverReportActionContextMenu({ref}: PopoverReportActionContextMenuPro const [shouldSwitchPositionIfOverflow, setShouldSwitchPositionIfOverflow] = useState(false); const [isWithoutOverlay, setIsWithoutOverlay] = useState(true); const [allTransactionViolations] = useOnyx(ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS); - const [visibleReportActionsData] = useOnyx(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); const contentRef = useRef>(null); const anchorRef = useRef | HTMLDivElement | null>(null); @@ -350,6 +350,7 @@ function PopoverReportActionContextMenu({ref}: PopoverReportActionContextMenuPro const [iouTransaction] = useOnyx(`${ONYXKEYS.COLLECTION.TRANSACTION}${transactionIDs.at(0) ?? ''}`); const [iouOriginalTransaction] = useOnyx(`${ONYXKEYS.COLLECTION.TRANSACTION}${getNonEmptyStringOnyxID(iouTransaction?.comment?.originalTransactionID)}`); const [report] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${reportIDRef.current}`); + const visibleReportActionsData = useVisibleReportActions(report?.reportID); const [childReport] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${reportActionRef.current?.childReportID}`); const [childReportActions] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${childReport?.reportID}`); const [selfDMReportID] = useOnyx(ONYXKEYS.SELF_DM_REPORT_ID); @@ -440,7 +441,7 @@ function PopoverReportActionContextMenu({ref}: PopoverReportActionContextMenuPro isOriginalReportArchived, email ?? '', isOffline, - visibleReportActionsData ?? undefined, + visibleReportActionsData, ); }; } diff --git a/src/selectors/ReportAction.ts b/src/selectors/ReportAction.ts index 468dd9bfd28c..c8a6ab2c3a20 100644 --- a/src/selectors/ReportAction.ts +++ b/src/selectors/ReportAction.ts @@ -2,7 +2,6 @@ import {filterOutDeprecatedReportActions, getIOUActionForTransactionID, getLinke import CONST from '@src/CONST'; import type {ReportAction, ReportActions} from '@src/types/onyx'; -import type {VisibleReportActionsDerivedValue} from '@src/types/onyx/DerivedValues'; import type {OnyxEntry} from 'react-native-onyx'; @@ -10,14 +9,6 @@ import lodashFindLast from 'lodash/findLast'; type NewestReportAction = Pick; -/** - * Scopes VISIBLE_REPORT_ACTIONS to one report, pre-wrapped in the `{[reportID]: slice}` shape - * `isReportActionVisible` expects. Built here (not inline in the hook) so the consumer has no computed-key - * literal, which the React Compiler won't memoize; `useOnyx` returns a stable ref while the slice is unchanged. - */ -const reportVisibleActionsSelector = (reportID: string | undefined) => (data: VisibleReportActionsDerivedValue | undefined) => - reportID && data?.[reportID] ? {[reportID]: data[reportID]} : undefined; - function getParentReportActionSelector(parentReportActions: OnyxEntry, parentReportActionID?: string): OnyxEntry { if (!parentReportActions || !parentReportActionID) { return; @@ -149,7 +140,6 @@ export { getReimbursedExpectedDateSelector, getReportActionByIDSelector, getReceiptScanFailedIOUActionDataSelector, - reportVisibleActionsSelector, transactionThreadReportIDSelector, }; export type {NewestReportAction}; diff --git a/src/selectors/VisibleReportActions.ts b/src/selectors/VisibleReportActions.ts new file mode 100644 index 000000000000..5a0ada9facce --- /dev/null +++ b/src/selectors/VisibleReportActions.ts @@ -0,0 +1,121 @@ +import {isActionableWhisperRequiringWritePermission, isActionOfType, isConciergeCategoryOptions, shouldReportActionBeVisible} from '@libs/ReportActionsUtils'; + +import CONST from '@src/CONST'; +import ONYXKEYS from '@src/ONYXKEYS'; +import type {ReportAction, ReportActions, VisibleReportActions} from '@src/types/onyx'; + +import type {OnyxCollection, OnyxEntry} from 'react-native-onyx'; + +/** + * Returns true if the action's visibility depends on runtime context that can't be cached, + * such as write permissions, policy settings, or sibling actions. + */ +function shouldSkipCachingAction(action: ReportAction): boolean { + return isActionableWhisperRequiringWritePermission(action) || isConciergeCategoryOptions(action) || isActionOfType(action, CONST.REPORT.ACTIONS.TYPE.MARKED_REIMBURSED); +} + +/** + * Builds a report's action-visibility map (keyed by `reportActionID`) from its full set of report + * actions. Rebuilding the whole map rather than updating individual entries keeps deletions correct: + * a removed action is absent from `reportActions`, so it drops out of the result. + */ +function computeReportVisibility(reportActions: ReportActions, currentUserAccountID: number | undefined): Record { + const reportVisibility: Record = {}; + + for (const [actionID, action] of Object.entries(reportActions)) { + if (!action) { + continue; + } + // Skip deprecated keys (e.g. sequenceNumber-keyed duplicates) so they + // cannot overwrite the canonical entry's visibility with false. + if (actionID !== action.reportActionID) { + continue; + } + if (shouldSkipCachingAction(action)) { + continue; + } + reportVisibility[action.reportActionID] = shouldReportActionBeVisible(action, actionID, undefined, currentUserAccountID); + } + + return reportVisibility; +} + +// Onyx gives a report's actions a new object only when they change, so every consumer shares one compute per report and user +const reportVisibilityCache = new WeakMap}>(); + +function getReportVisibility(reportActions: ReportActions, currentUserAccountID: number | undefined): Record { + const cached = reportVisibilityCache.get(reportActions); + if (cached && cached.currentUserAccountID === currentUserAccountID) { + return cached.reportVisibility; + } + const reportVisibility = computeReportVisibility(reportActions, currentUserAccountID); + reportVisibilityCache.set(reportActions, {currentUserAccountID, reportVisibility}); + return reportVisibility; +} + +/** The visibility of the given reports' actions, keyed by reportID. Reports without actions are left out. */ +function getVisibleReportActionsForReports(reportActionsByReportID: Array<[string, OnyxEntry]>, currentUserAccountID: number | undefined): VisibleReportActions | undefined { + let result: VisibleReportActions | undefined; + for (const [reportID, reportActions] of reportActionsByReportID) { + if (!reportActions) { + continue; + } + result ??= {}; + result[reportID] = getReportVisibility(reportActions, currentUserAccountID); + } + return result; +} + +function isSameReportVisibility(reportVisibility: Record, otherReportVisibility: Record): boolean { + const actionIDs = Object.keys(reportVisibility); + if (actionIDs.length !== Object.keys(otherReportVisibility).length) { + return false; + } + return actionIDs.every((actionID) => reportVisibility[actionID] === otherReportVisibility[actionID]); +} + +let lastAllReportActions: OnyxCollection | undefined; +let lastCurrentUserAccountID: number | undefined; +let lastAllVisibleReportActions: VisibleReportActions | undefined; + +/** + * The visibility of every report's actions, keyed by reportID. Every mounted consumer shares one walk per collection + * snapshot. A report whose visibility didn't change keeps its previous object, and so does the whole map when no report changed. + */ +function getAllVisibleReportActions(allReportActions: OnyxCollection, currentUserAccountID: number | undefined): VisibleReportActions { + if (lastAllVisibleReportActions && allReportActions === lastAllReportActions && currentUserAccountID === lastCurrentUserAccountID) { + return lastAllVisibleReportActions; + } + + const previous = lastAllVisibleReportActions; + const result: VisibleReportActions = {}; + let reportCount = 0; + let isSameAsPrevious = !!previous; + for (const [reportActionsKey, reportActions] of Object.entries(allReportActions ?? {})) { + if (!reportActions) { + continue; + } + const reportID = reportActionsKey.replace(ONYXKEYS.COLLECTION.REPORT_ACTIONS, ''); + const previousReportVisibility = previous?.[reportID]; + let reportVisibility = getReportVisibility(reportActions, currentUserAccountID); + if (previousReportVisibility && reportVisibility !== previousReportVisibility && isSameReportVisibility(reportVisibility, previousReportVisibility)) { + reportVisibility = previousReportVisibility; + reportVisibilityCache.set(reportActions, {currentUserAccountID, reportVisibility}); + } + result[reportID] = reportVisibility; + reportCount++; + if (isSameAsPrevious && previous?.[reportID] !== reportVisibility) { + isSameAsPrevious = false; + } + } + + lastAllReportActions = allReportActions; + lastCurrentUserAccountID = currentUserAccountID; + if (previous && isSameAsPrevious && Object.keys(previous).length === reportCount) { + return previous; + } + lastAllVisibleReportActions = result; + return result; +} + +export {computeReportVisibility, getAllVisibleReportActions, getVisibleReportActionsForReports}; diff --git a/src/types/onyx/DerivedValues.ts b/src/types/onyx/DerivedValues.ts index 3f5e2a136157..1cde2a52a0f8 100644 --- a/src/types/onyx/DerivedValues.ts +++ b/src/types/onyx/DerivedValues.ts @@ -83,11 +83,6 @@ type ReportTransactionsAndViolationsDerivedValue = Record>; -/** - * The derived value for visible report actions. - */ -type VisibleReportActionsDerivedValue = Record>; - /** * The errors of a card. */ @@ -250,7 +245,6 @@ export type { ReportTransactionsAndViolationsDerivedValue, ReportTransactionsAndViolations, OutstandingReportsByPolicyIDDerivedValue, - VisibleReportActionsDerivedValue, SortedReportActionsDerivedValue, NonPersonalAndWorkspaceCardListDerivedValue, PersonalAndWorkspaceCardListDerivedValue, diff --git a/src/types/onyx/ReportAction.ts b/src/types/onyx/ReportAction.ts index eb30b958c0be..5ea1fc09210b 100644 --- a/src/types/onyx/ReportAction.ts +++ b/src/types/onyx/ReportAction.ts @@ -284,6 +284,9 @@ type ReportAction = ReportActionB /** Record of report actions, indexed by report action ID */ type ReportActions = Record; +/** Cached visibility of report actions, indexed by reportID and then by report action ID */ +type VisibleReportActions = Record>; + /** Collection of mock report actions, indexed by reportActions_${reportID} */ type ReportActionsCollectionDataSet = CollectionDataSet; @@ -309,4 +312,4 @@ type PolicyChangeLogCopyReportActionNames = | typeof CONST.REPORT.ACTIONS.TYPE.POLICY_CHANGE_LOG.COPY_TRAVEL; export default ReportAction; -export type {ReportActions, Message, LinkMetadata, OriginalMessage, ReportActionsCollectionDataSet, OldDotReportAction, PolicyChangeLogCopyReportActionNames}; +export type {ReportActions, VisibleReportActions, Message, LinkMetadata, OriginalMessage, ReportActionsCollectionDataSet, OldDotReportAction, PolicyChangeLogCopyReportActionNames}; diff --git a/src/types/onyx/index.ts b/src/types/onyx/index.ts index fad7cf8b5ab5..b298240b1162 100644 --- a/src/types/onyx/index.ts +++ b/src/types/onyx/index.ts @@ -70,7 +70,6 @@ import type { ReportAttributesDerivedValue, ReportTransactionsAndViolationsDerivedValue, SortedReportActionsDerivedValue, - VisibleReportActionsDerivedValue, } from './DerivedValues'; import type DeviceBiometrics from './DeviceBiometrics'; import type DismissedProductTraining from './DismissedProductTraining'; @@ -162,7 +161,7 @@ import type {RecentSearchItem} from './RecentSearch'; import type RecentWaypoint from './RecentWaypoint'; import type ReimbursementAccount from './ReimbursementAccount'; import type Report from './Report'; -import type {ReportActions} from './ReportAction'; +import type {ReportActions, VisibleReportActions} from './ReportAction'; import type ReportAction from './ReportAction'; import type ReportActionReactions from './ReportActionReactions'; import type ReportActionsDraft from './ReportActionsDraft'; @@ -456,7 +455,7 @@ export type { LastSearchParams, ReportTransactionsAndViolationsDerivedValue, OutstandingReportsByPolicyIDDerivedValue, - VisibleReportActionsDerivedValue, + VisibleReportActions, SortedReportActionsDerivedValue, NonPersonalAndWorkspaceCardListDerivedValue, PersonalAndWorkspaceCardListDerivedValue, diff --git a/tests/navigation/LinkedActionNotFoundGuardTest.tsx b/tests/navigation/LinkedActionNotFoundGuardTest.tsx index b464add1f92b..913470a9b147 100644 --- a/tests/navigation/LinkedActionNotFoundGuardTest.tsx +++ b/tests/navigation/LinkedActionNotFoundGuardTest.tsx @@ -96,7 +96,6 @@ jest.mock('@hooks/useOnyx', () => ({ if (key.startsWith('report_')) { return [{reportID: '12345', type: 'chat'}, {status: 'loaded'}]; } - // DERIVED.VISIBLE_REPORT_ACTIONS return [undefined, {status: 'loaded'}]; }, })); diff --git a/tests/ui/components/LHNOptionsListTest.tsx b/tests/ui/components/LHNOptionsListTest.tsx index 022643fe8dd3..cb3ebdf1d5d7 100644 --- a/tests/ui/components/LHNOptionsListTest.tsx +++ b/tests/ui/components/LHNOptionsListTest.tsx @@ -253,11 +253,6 @@ describe('LHNOptionsList', () => { pendingExpenseAction: CONST.EXPENSE_PENDING_ACTION.SUBMIT, }); - await Onyx.merge(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS, { - [reportID]: { - [submittedAction.reportActionID]: true, - }, - }); await Onyx.merge(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`, { [submittedAction.reportActionID]: submittedAction, }); @@ -310,11 +305,6 @@ describe('LHNOptionsList', () => { pendingExpenseAction: CONST.EXPENSE_PENDING_ACTION.SUBMIT, }); - await Onyx.merge(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS, { - [reportID]: { - [commentAction.reportActionID]: true, - }, - }); await Onyx.merge(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`, { [commentAction.reportActionID]: commentAction, }); diff --git a/tests/unit/OnyxDerived/visibleReportActionsTest.ts b/tests/unit/OnyxDerived/visibleReportActionsTest.ts deleted file mode 100644 index b0a5f44d9ebe..000000000000 --- a/tests/unit/OnyxDerived/visibleReportActionsTest.ts +++ /dev/null @@ -1,34 +0,0 @@ -import visibleReportActionsConfig from '@libs/actions/OnyxDerived/configs/visibleReportActions'; - -import type {OnyxKey} from '@src/ONYXKEYS'; -import ONYXKEYS from '@src/ONYXKEYS'; -import type {ReportActions} from '@src/types/onyx'; -import type {VisibleReportActionsDerivedValue} from '@src/types/onyx/DerivedValues'; - -import type {OnyxCollection} from 'react-native-onyx'; - -describe('visibleReportActions', () => { - describe('SESSION detected via triggeredKeys', () => { - const reportActionsKeyA = `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}A`; - // Only report A has report actions now; report B exists only in the previous derived value (currentValue). - const allReportActions: OnyxCollection = {[reportActionsKeyA]: {}}; - const args: Parameters[0] = [allReportActions, undefined]; - const currentValue: VisibleReportActionsDerivedValue = {A: {}, B: {}}; - const sourceValues: Parameters[1]['sourceValues'] = {[ONYXKEYS.COLLECTION.REPORT_ACTIONS]: {[reportActionsKeyA]: {}}}; - - it('recomputes incrementally (keeps a stale report) when only report actions triggered', () => { - const result = visibleReportActionsConfig.compute(args, {currentValue, sourceValues, triggeredKeys: new Set([ONYXKEYS.COLLECTION.REPORT_ACTIONS])}); - - // Incremental: report B (absent from allReportActions) is retained from the previous value. - expect(result.B).toBeDefined(); - }); - - it('does a full recompute (drops the stale report) when SESSION also triggered, even with no SESSION delta', () => { - const result = visibleReportActionsConfig.compute(args, {currentValue, sourceValues, triggeredKeys: new Set([ONYXKEYS.COLLECTION.REPORT_ACTIONS, ONYXKEYS.SESSION])}); - - // Full recompute: report B is not in allReportActions, so it is dropped. - expect(result.B).toBeUndefined(); - expect(result.A).toBeDefined(); - }); - }); -}); diff --git a/tests/unit/OnyxDerivedTest.tsx b/tests/unit/OnyxDerivedTest.tsx index cb5d50da8939..1732cfeb38a4 100644 --- a/tests/unit/OnyxDerivedTest.tsx +++ b/tests/unit/OnyxDerivedTest.tsx @@ -1,5 +1,4 @@ import reportAttributes from '@libs/actions/OnyxDerived/configs/reportAttributes'; -import {isReportActionVisible} from '@libs/ReportActionsUtils'; import initOnyxDerivedValues from '@userActions/OnyxDerived'; import * as OnyxDerivedUtils from '@userActions/OnyxDerived/utils'; @@ -35,132 +34,6 @@ describe('OnyxDerived', () => { await Onyx.clear(); }); - describe('visibleReportActions', () => { - it.each([ - CONST.REPORT.ACTIONS.TYPE.REIMBURSEMENT_DEQUEUED, - CONST.REPORT.ACTIONS.TYPE.REIMBURSEMENT_ACH_CANCELED, - CONST.REPORT.ACTIONS.TYPE.REIMBURSEMENT_ACH_BOUNCE, - CONST.REPORT.ACTIONS.TYPE.RETRACTED, - CONST.REPORT.ACTIONS.TYPE.REOPENED, - CONST.REPORT.ACTIONS.TYPE.UNAPPROVED, - ])('keeps a later reimbursement visible after %s even when the earlier PAY was cached', async (actionName) => { - const reportID = `reportWithHistoricalPay-${actionName}`; - const reportActionsKey = `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}` as const; - const markedReimbursed = getFakeReportAction(1, { - reportID, - actionName: CONST.REPORT.ACTIONS.TYPE.MARKED_REIMBURSED, - created: '2025-01-01 00:00:00.000', - originalMessage: {}, - }); - const pay = getFakeReportAction(2, { - reportID, - actionName: CONST.REPORT.ACTIONS.TYPE.IOU, - created: '2025-01-01 00:00:01.000', - originalMessage: {type: CONST.IOU.REPORT_ACTION_TYPE.PAY, IOUReportID: reportID, amount: 100, currency: CONST.CURRENCY.USD}, - }); - await Onyx.set(reportActionsKey, {[markedReimbursed.reportActionID]: markedReimbursed, [pay.reportActionID]: pay}); - await waitForBatchedUpdates(); - - const initialVisibility = await OnyxUtils.get(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); - expect(isReportActionVisible(markedReimbursed, reportID, true, initialVisibility)).toBe(false); - - const cancellation = getFakeReportAction(3, {reportID, actionName, created: '2025-01-02 00:00:00.000'}); - const laterReimbursement = {...markedReimbursed, reportActionID: '4', created: '2025-01-03 00:00:00.000'}; - // History can arrive out of order: initially the earlier payment appears to cover this action too. - await Onyx.mergeCollection(ONYXKEYS.COLLECTION.REPORT_ACTIONS, {[reportActionsKey]: {[laterReimbursement.reportActionID]: laterReimbursement}}); - await waitForBatchedUpdates(); - const incompleteVisibility = await OnyxUtils.get(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); - expect(isReportActionVisible(laterReimbursement, reportID, true, incompleteVisibility)).toBe(false); - - await Onyx.mergeCollection(ONYXKEYS.COLLECTION.REPORT_ACTIONS, { - [reportActionsKey]: {[cancellation.reportActionID]: cancellation}, - }); - await waitForBatchedUpdates(); - - const updatedVisibility = await OnyxUtils.get(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); - expect(isReportActionVisible(laterReimbursement, reportID, true, updatedVisibility)).toBe(true); - expect(isReportActionVisible(markedReimbursed, reportID, true, updatedVisibility)).toBe(false); - - // A PAY belonging to the new payment attempt should still hide its duplicate when it arrives later. - const laterPay = {...pay, reportActionID: '5', created: '2025-01-03 00:00:01.000'}; - await Onyx.mergeCollection(ONYXKEYS.COLLECTION.REPORT_ACTIONS, {[reportActionsKey]: {[laterPay.reportActionID]: laterPay}}); - await waitForBatchedUpdates(); - - const finalVisibility = await OnyxUtils.get(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); - expect(isReportActionVisible(laterReimbursement, reportID, true, finalVisibility)).toBe(false); - }); - - it.each([CONST.REPORT.ACTIONS.TYPE.RETRACTED, CONST.REPORT.ACTIONS.TYPE.REOPENED, CONST.REPORT.ACTIONS.TYPE.UNAPPROVED])( - 'does not retroactively hide a standalone reimbursement when PAY arrives after %s', - async (actionName) => { - const reportID = `reportWithFuturePay-${actionName}`; - const reportActionsKey = `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}` as const; - const markedReimbursed = getFakeReportAction(1, { - actionName: CONST.REPORT.ACTIONS.TYPE.MARKED_REIMBURSED, - created: '2025-01-01 00:00:00.000', - originalMessage: {}, - }); - await Onyx.set(reportActionsKey, {[markedReimbursed.reportActionID]: markedReimbursed}); - await waitForBatchedUpdates(); - const initialVisibility = await OnyxUtils.get(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); - expect(isReportActionVisible(markedReimbursed, reportID, true, initialVisibility)).toBe(true); - - const boundary = getFakeReportAction(2, {actionName, created: '2025-02-01 00:00:00.000'}); - const pay = getFakeReportAction(3, { - actionName: CONST.REPORT.ACTIONS.TYPE.IOU, - created: '2025-06-01 00:00:00.000', - originalMessage: {type: CONST.IOU.REPORT_ACTION_TYPE.PAY, IOUReportID: reportID, amount: 100, currency: CONST.CURRENCY.USD}, - }); - const laterReimbursement = {...markedReimbursed, reportActionID: '4', created: '2025-06-01 00:00:01.000'}; - await Onyx.mergeCollection(ONYXKEYS.COLLECTION.REPORT_ACTIONS, { - [reportActionsKey]: {[boundary.reportActionID]: boundary, [pay.reportActionID]: pay, [laterReimbursement.reportActionID]: laterReimbursement}, - }); - await waitForBatchedUpdates(); - - const updatedVisibility = await OnyxUtils.get(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); - expect(isReportActionVisible(markedReimbursed, reportID, true, updatedVisibility)).toBe(true); - expect(isReportActionVisible(laterReimbursement, reportID, true, updatedVisibility)).toBe(false); - }, - ); - - it('uses the collection reportID to hide MARKED_REIMBURSED when its sibling PAY arrives later', async () => { - const reportID = 'reportWithLatePaySibling'; - const reportActionsKey = `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}` as const; - const markedReimbursedAction: ReportAction = { - actionName: CONST.REPORT.ACTIONS.TYPE.MARKED_REIMBURSED, - reportActionID: '1', - created: '2025-01-01 00:00:00', - message: [{type: 'TEXT', style: 'normal', text: 'Marked as reimbursed'}], - originalMessage: {}, - }; - const payAction = { - actionName: CONST.REPORT.ACTIONS.TYPE.IOU, - reportActionID: '2', - created: '2025-01-01 00:00:01', - message: [{type: 'TEXT', style: 'normal', text: 'paid'}], - originalMessage: {type: CONST.IOU.REPORT_ACTION_TYPE.PAY, IOUReportID: reportID, amount: 100, currency: CONST.CURRENCY.USD}, - } as ReportAction; - - await Onyx.set(reportActionsKey, {[markedReimbursedAction.reportActionID]: markedReimbursedAction}); - await waitForBatchedUpdates(); - - const initialVisibility = await OnyxUtils.get(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); - expect(initialVisibility?.[reportID]).toBeDefined(); - expect(isReportActionVisible(markedReimbursedAction, reportID, true, initialVisibility)).toBe(true); - - // Only PAY is included in this update, so derived visibility must not retain a stale result for its sibling. - await Onyx.mergeCollection(ONYXKEYS.COLLECTION.REPORT_ACTIONS, {[reportActionsKey]: {[payAction.reportActionID]: payAction}}); - await waitForBatchedUpdates(); - - const updatedVisibility = await OnyxUtils.get(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); - expect(updatedVisibility?.[reportID]?.[payAction.reportActionID]).toBe(true); - expect(isReportActionVisible(markedReimbursedAction, reportID, true, updatedVisibility)).toBe(false); - expect(isReportActionVisible(markedReimbursedAction, reportID, true)).toBe(false); - expect(isReportActionVisible(markedReimbursedAction, reportID, true, {})).toBe(false); - expect(isReportActionVisible({...markedReimbursedAction, pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD}, reportID, true, updatedVisibility)).toBe(false); - }); - }); - describe('reportAttributes', () => { beforeAll(async () => { await IntlStore.load(CONST.LOCALES.EN); diff --git a/tests/unit/SidebarUtilsTest.ts b/tests/unit/SidebarUtilsTest.ts index a4e0dafc6137..ab7441c809c3 100644 --- a/tests/unit/SidebarUtilsTest.ts +++ b/tests/unit/SidebarUtilsTest.ts @@ -3458,12 +3458,6 @@ describe('SidebarUtils', () => { [linkedCreateAction.reportActionID]: linkedCreateAction, [lastAction.reportActionID]: lastAction, }); - await Onyx.set(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS, { - [iouReportR14932.reportID]: { - [linkedCreateAction.reportActionID]: true, - [lastAction.reportActionID]: true, - }, - }); }); const result = SidebarUtils.getOptionData({ diff --git a/tests/unit/selectors/VisibleReportActionsTest.ts b/tests/unit/selectors/VisibleReportActionsTest.ts new file mode 100644 index 000000000000..3f72a869651e --- /dev/null +++ b/tests/unit/selectors/VisibleReportActionsTest.ts @@ -0,0 +1,107 @@ +/* eslint-disable @typescript-eslint/naming-convention */ +import CONST from '@src/CONST'; +import ONYXKEYS from '@src/ONYXKEYS'; +import type {ReportAction, ReportActions} from '@src/types/onyx'; + +import type {OnyxCollection} from 'react-native-onyx'; + +import {computeReportVisibility, getAllVisibleReportActions, getVisibleReportActionsForReports} from '@selectors/VisibleReportActions'; + +import {getFakeReportAction} from '../../utils/ReportTestUtils'; + +const CURRENT_USER_ACCOUNT_ID = 10; +const OTHER_USER_ACCOUNT_ID = 20; + +function createComment(reportActionID: number, overrides: Partial = {}): ReportAction { + return getFakeReportAction(reportActionID, {actionName: CONST.REPORT.ACTIONS.TYPE.ADD_COMMENT, ...overrides}); +} + +function toReportActions(...actions: ReportAction[]): ReportActions { + return Object.fromEntries(actions.map((action) => [action.reportActionID, action])); +} + +function toCollection(reportActionsByReportID: Record): OnyxCollection { + return Object.fromEntries(Object.entries(reportActionsByReportID).map(([reportID, reportActions]) => [`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`, reportActions])); +} + +describe('computeReportVisibility', () => { + it('should skip deprecated keys and actions whose visibility depends on runtime context', () => { + // Given a visible comment, the same comment under a deprecated key, and a MARKED_REIMBURSED whose visibility depends on its siblings + const comment = createComment(1); + const markedReimbursed = createComment(2, {actionName: CONST.REPORT.ACTIONS.TYPE.MARKED_REIMBURSED, originalMessage: {}}); + const reportActions: ReportActions = {...toReportActions(comment, markedReimbursed), deprecatedKey: comment}; + + // When the report's visibility is computed + const visibility = computeReportVisibility(reportActions, CURRENT_USER_ACCOUNT_ID); + + // Then only the canonical comment is cached, so the other two fall back to the runtime check + expect(visibility).toEqual({[comment.reportActionID]: true}); + }); +}); + +describe('getVisibleReportActionsForReports', () => { + it('should reuse a report visibility for the same actions object and user and recompute for another user', () => { + // Given a report's actions + const reportActions = toReportActions(createComment(1)); + + // When the selector runs twice for the same user, then once for another user + const first = getVisibleReportActionsForReports([['1', reportActions]], CURRENT_USER_ACCOUNT_ID); + const second = getVisibleReportActionsForReports([['1', reportActions]], CURRENT_USER_ACCOUNT_ID); + const otherUser = getVisibleReportActionsForReports([['1', reportActions]], OTHER_USER_ACCOUNT_ID); + + // Then mounted LHN rows share one compute per report, while a user switch doesn't reuse a result for the previous user + expect(second?.['1']).toBe(first?.['1']); + expect(otherUser?.['1']).not.toBe(first?.['1']); + }); + + it('should leave out reports without actions', () => { + // Given a report with actions and a transaction thread without any + + // When the selector runs for both + const result = getVisibleReportActionsForReports( + [ + ['1', toReportActions(createComment(1))], + ['2', undefined], + ], + CURRENT_USER_ACCOUNT_ID, + ); + + // Then only the report with actions has an entry, as in the derived value it replaces + expect(Object.keys(result ?? {})).toEqual(['1']); + }); +}); + +describe('getAllVisibleReportActions', () => { + it('should return the previous map when a write leaves every report visibility unchanged', () => { + // Given two reports + const comment = createComment(1); + const otherReportActions = toReportActions(createComment(2)); + const previous = getAllVisibleReportActions(toCollection({'1': toReportActions(comment), '2': otherReportActions}), CURRENT_USER_ACCOUNT_ID); + + // When the comment is edited, which gives the report's actions and the collection new objects without changing visibility + const next = getAllVisibleReportActions( + toCollection({'1': toReportActions({...comment, lastModified: '2025-01-01 00:00:00.000'}), '2': otherReportActions}), + CURRENT_USER_ACCOUNT_ID, + ); + + // Then the same map object comes back, so Search consumers pass Object.is without a deep walk over every report + expect(next).toBe(previous); + }); + + it('should keep untouched reports and drop removed ones when a report changes', () => { + // Given three reports + const otherReportActions = toReportActions(createComment(2)); + const previous = getAllVisibleReportActions( + toCollection({'1': toReportActions(createComment(1)), '2': otherReportActions, '3': toReportActions(createComment(3))}), + CURRENT_USER_ACCOUNT_ID, + ); + + // When a comment is added to the first report and the third report's actions are removed + const next = getAllVisibleReportActions(toCollection({'1': toReportActions(createComment(1), createComment(4)), '2': otherReportActions}), CURRENT_USER_ACCOUNT_ID); + + // Then the map is new, the untouched report keeps its object, and the removed report is gone + expect(next).not.toBe(previous); + expect(next).toEqual({'1': {'1': true, '4': true}, '2': {'2': true}}); + expect(next['2']).toBe(previous['2']); + }); +}); diff --git a/tests/unit/useAllVisibleReportActionsTest.tsx b/tests/unit/useAllVisibleReportActionsTest.tsx new file mode 100644 index 000000000000..3a64a92850f3 --- /dev/null +++ b/tests/unit/useAllVisibleReportActionsTest.tsx @@ -0,0 +1,233 @@ +/* eslint-disable @typescript-eslint/naming-convention */ +import {act, renderHook} from '@testing-library/react-native'; + +import useAllVisibleReportActions from '@hooks/useAllVisibleReportActions'; + +import {isReportActionVisible} from '@libs/ReportActionsUtils'; + +import CONST from '@src/CONST'; +import ONYXKEYS from '@src/ONYXKEYS'; +import type {ReportAction} from '@src/types/onyx'; + +import Onyx from 'react-native-onyx'; + +import {getFakeReportAction} from '../utils/ReportTestUtils'; +import waitForBatchedUpdates from '../utils/waitForBatchedUpdates'; +import waitForBatchedUpdatesWithAct from '../utils/waitForBatchedUpdatesWithAct'; + +const REPORT_ID = '1'; +const OTHER_REPORT_ID = '3'; + +function createComment(reportActionID: number, reportID: string): ReportAction { + return getFakeReportAction(reportActionID, {reportID, actionName: CONST.REPORT.ACTIONS.TYPE.ADD_COMMENT}); +} + +async function setReportActions(reportID: string, actions: ReportAction[]) { + await act(async () => { + await Onyx.set(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`, Object.fromEntries(actions.map((action) => [action.reportActionID, action]))); + }); + await waitForBatchedUpdatesWithAct(); +} + +async function mergeReportAction(reportID: string, action: ReportAction) { + await act(async () => { + await Onyx.merge(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`, {[action.reportActionID]: action}); + }); + await waitForBatchedUpdatesWithAct(); +} + +/** Mounts the hook for one read, so every read goes through the module memo the way a newly opened Search surface does */ +async function getVisibleReportActions() { + const {result, unmount} = renderHook(() => useAllVisibleReportActions()); + await waitForBatchedUpdatesWithAct(); + const visibleReportActions = result.current; + unmount(); + return visibleReportActions; +} + +describe('useAllVisibleReportActions', () => { + beforeAll(() => { + Onyx.init({keys: ONYXKEYS}); + }); + + beforeEach(async () => { + await Onyx.clear(); + }); + + it.each([ + CONST.REPORT.ACTIONS.TYPE.REIMBURSEMENT_DEQUEUED, + CONST.REPORT.ACTIONS.TYPE.REIMBURSEMENT_ACH_CANCELED, + CONST.REPORT.ACTIONS.TYPE.REIMBURSEMENT_ACH_BOUNCE, + CONST.REPORT.ACTIONS.TYPE.RETRACTED, + CONST.REPORT.ACTIONS.TYPE.REOPENED, + CONST.REPORT.ACTIONS.TYPE.UNAPPROVED, + ])('should keep a later reimbursement visible after %s even when the earlier PAY was cached', async (actionName) => { + // Given a report whose MARKED_REIMBURSED is hidden by its PAY + const reportID = `reportWithHistoricalPay-${actionName}`; + const reportActionsKey = `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}` as const; + const markedReimbursed = getFakeReportAction(1, { + reportID, + actionName: CONST.REPORT.ACTIONS.TYPE.MARKED_REIMBURSED, + created: '2025-01-01 00:00:00.000', + originalMessage: {}, + }); + const pay = getFakeReportAction(2, { + reportID, + actionName: CONST.REPORT.ACTIONS.TYPE.IOU, + created: '2025-01-01 00:00:01.000', + originalMessage: {type: CONST.IOU.REPORT_ACTION_TYPE.PAY, IOUReportID: reportID, amount: 100, currency: CONST.CURRENCY.USD}, + }); + await Onyx.set(reportActionsKey, {[markedReimbursed.reportActionID]: markedReimbursed, [pay.reportActionID]: pay}); + await waitForBatchedUpdates(); + const initialVisibility = await getVisibleReportActions(); + expect(isReportActionVisible(markedReimbursed, reportID, true, initialVisibility)).toBe(false); + + // When a later reimbursement arrives before the action that cancels the first payment, as history can arrive out of order + const cancellation = getFakeReportAction(3, {reportID, actionName, created: '2025-01-02 00:00:00.000'}); + const laterReimbursement = {...markedReimbursed, reportActionID: '4', created: '2025-01-03 00:00:00.000'}; + await Onyx.mergeCollection(ONYXKEYS.COLLECTION.REPORT_ACTIONS, {[reportActionsKey]: {[laterReimbursement.reportActionID]: laterReimbursement}}); + await waitForBatchedUpdates(); + const incompleteVisibility = await getVisibleReportActions(); + + // Then the earlier payment still appears to cover it + expect(isReportActionVisible(laterReimbursement, reportID, true, incompleteVisibility)).toBe(false); + + // When the cancellation arrives + await Onyx.mergeCollection(ONYXKEYS.COLLECTION.REPORT_ACTIONS, {[reportActionsKey]: {[cancellation.reportActionID]: cancellation}}); + await waitForBatchedUpdates(); + const updatedVisibility = await getVisibleReportActions(); + + // Then the later reimbursement shows and the earlier one stays hidden, so no stale cached entry survives + expect(isReportActionVisible(laterReimbursement, reportID, true, updatedVisibility)).toBe(true); + expect(isReportActionVisible(markedReimbursed, reportID, true, updatedVisibility)).toBe(false); + + // When a PAY of the new payment attempt arrives later + const laterPay = {...pay, reportActionID: '5', created: '2025-01-03 00:00:01.000'}; + await Onyx.mergeCollection(ONYXKEYS.COLLECTION.REPORT_ACTIONS, {[reportActionsKey]: {[laterPay.reportActionID]: laterPay}}); + await waitForBatchedUpdates(); + const finalVisibility = await getVisibleReportActions(); + + // Then it hides its duplicate reimbursement + expect(isReportActionVisible(laterReimbursement, reportID, true, finalVisibility)).toBe(false); + }); + + it.each([CONST.REPORT.ACTIONS.TYPE.RETRACTED, CONST.REPORT.ACTIONS.TYPE.REOPENED, CONST.REPORT.ACTIONS.TYPE.UNAPPROVED])( + 'should not retroactively hide a standalone reimbursement when PAY arrives after %s', + async (actionName) => { + // Given a report with a standalone MARKED_REIMBURSED, which is visible + const reportID = `reportWithFuturePay-${actionName}`; + const reportActionsKey = `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}` as const; + const markedReimbursed = getFakeReportAction(1, { + actionName: CONST.REPORT.ACTIONS.TYPE.MARKED_REIMBURSED, + created: '2025-01-01 00:00:00.000', + originalMessage: {}, + }); + await Onyx.set(reportActionsKey, {[markedReimbursed.reportActionID]: markedReimbursed}); + await waitForBatchedUpdates(); + const initialVisibility = await getVisibleReportActions(); + expect(isReportActionVisible(markedReimbursed, reportID, true, initialVisibility)).toBe(true); + + // When a boundary action, a PAY and a later reimbursement arrive together + const boundary = getFakeReportAction(2, {actionName, created: '2025-02-01 00:00:00.000'}); + const pay = getFakeReportAction(3, { + actionName: CONST.REPORT.ACTIONS.TYPE.IOU, + created: '2025-06-01 00:00:00.000', + originalMessage: {type: CONST.IOU.REPORT_ACTION_TYPE.PAY, IOUReportID: reportID, amount: 100, currency: CONST.CURRENCY.USD}, + }); + const laterReimbursement = {...markedReimbursed, reportActionID: '4', created: '2025-06-01 00:00:01.000'}; + await Onyx.mergeCollection(ONYXKEYS.COLLECTION.REPORT_ACTIONS, { + [reportActionsKey]: {[boundary.reportActionID]: boundary, [pay.reportActionID]: pay, [laterReimbursement.reportActionID]: laterReimbursement}, + }); + await waitForBatchedUpdates(); + const updatedVisibility = await getVisibleReportActions(); + + // Then only the reimbursement after the boundary is hidden by the PAY + expect(isReportActionVisible(markedReimbursed, reportID, true, updatedVisibility)).toBe(true); + expect(isReportActionVisible(laterReimbursement, reportID, true, updatedVisibility)).toBe(false); + }, + ); + + it('should use the collection reportID to hide MARKED_REIMBURSED when its sibling PAY arrives later', async () => { + // Given a report with a MARKED_REIMBURSED and no PAY yet + const reportID = 'reportWithLatePaySibling'; + const reportActionsKey = `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}` as const; + const markedReimbursedAction: ReportAction = { + actionName: CONST.REPORT.ACTIONS.TYPE.MARKED_REIMBURSED, + reportActionID: '1', + created: '2025-01-01 00:00:00', + message: [{type: 'TEXT', style: 'normal', text: 'Marked as reimbursed'}], + originalMessage: {}, + }; + const payAction = { + actionName: CONST.REPORT.ACTIONS.TYPE.IOU, + reportActionID: '2', + created: '2025-01-01 00:00:01', + message: [{type: 'TEXT', style: 'normal', text: 'paid'}], + originalMessage: {type: CONST.IOU.REPORT_ACTION_TYPE.PAY, IOUReportID: reportID, amount: 100, currency: CONST.CURRENCY.USD}, + } as ReportAction; + await Onyx.set(reportActionsKey, {[markedReimbursedAction.reportActionID]: markedReimbursedAction}); + await waitForBatchedUpdates(); + const initialVisibility = await getVisibleReportActions(); + expect(initialVisibility[reportID]).toBeDefined(); + expect(isReportActionVisible(markedReimbursedAction, reportID, true, initialVisibility)).toBe(true); + + // When only the PAY arrives + await Onyx.mergeCollection(ONYXKEYS.COLLECTION.REPORT_ACTIONS, {[reportActionsKey]: {[payAction.reportActionID]: payAction}}); + await waitForBatchedUpdates(); + const updatedVisibility = await getVisibleReportActions(); + + // Then the cached visibility doesn't keep a stale result for its sibling, which is now hidden on every path + expect(updatedVisibility[reportID]?.[payAction.reportActionID]).toBe(true); + expect(isReportActionVisible(markedReimbursedAction, reportID, true, updatedVisibility)).toBe(false); + expect(isReportActionVisible(markedReimbursedAction, reportID, true)).toBe(false); + expect(isReportActionVisible(markedReimbursedAction, reportID, true, {})).toBe(false); + expect(isReportActionVisible({...markedReimbursedAction, pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD}, reportID, true, updatedVisibility)).toBe(false); + }); + + it('should keep the previous map and the untouched reports when a write leaves visibility unchanged', async () => { + // Given two reports with a comment each + const comment = createComment(1, REPORT_ID); + await setReportActions(REPORT_ID, [comment]); + await setReportActions(OTHER_REPORT_ID, [createComment(2, OTHER_REPORT_ID)]); + let renderCount = 0; + const {result} = renderHook(() => { + renderCount++; + return useAllVisibleReportActions(); + }); + await waitForBatchedUpdatesWithAct(); + const mapBeforeWrite = result.current; + const renderCountBeforeWrite = renderCount; + expect(mapBeforeWrite).toEqual({[REPORT_ID]: {'1': true}, [OTHER_REPORT_ID]: {'2': true}}); + + // When the comment is edited, which gives the report's actions a new object but leaves every action visible + await mergeReportAction(REPORT_ID, {...comment, lastModified: '2025-01-01 00:00:00.000'}); + + // Then the hook returns the same map object and doesn't re-render, so Search consumers keep their memoized work + expect(result.current).toBe(mapBeforeWrite); + expect(renderCount).toBe(renderCountBeforeWrite); + + // When a comment is added to the first report + await mergeReportAction(REPORT_ID, createComment(3, REPORT_ID)); + + // Then the map changes and the other report keeps its object + expect(result.current).toEqual({[REPORT_ID]: {'1': true, '3': true}, [OTHER_REPORT_ID]: {'2': true}}); + expect(result.current[OTHER_REPORT_ID]).toBe(mapBeforeWrite[OTHER_REPORT_ID]); + }); + + it('should drop a report whose actions are removed', async () => { + // Given two reports with a comment each + await setReportActions(REPORT_ID, [createComment(1, REPORT_ID)]); + await setReportActions(OTHER_REPORT_ID, [createComment(2, OTHER_REPORT_ID)]); + const {result} = renderHook(() => useAllVisibleReportActions()); + await waitForBatchedUpdatesWithAct(); + + // When the actions of one report are removed entirely + await act(async () => { + await Onyx.set(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${OTHER_REPORT_ID}`, null); + }); + await waitForBatchedUpdatesWithAct(); + + // Then the report leaves the map, as it left the derived value + expect(result.current).toEqual({[REPORT_ID]: {'1': true}}); + }); +}); diff --git a/tests/unit/useMoneyRequestReportVisibleActionsTest.tsx b/tests/unit/useMoneyRequestReportVisibleActionsTest.tsx index 42ccfd4b640e..08ba189b29bf 100644 --- a/tests/unit/useMoneyRequestReportVisibleActionsTest.tsx +++ b/tests/unit/useMoneyRequestReportVisibleActionsTest.tsx @@ -3,8 +3,6 @@ import {act, renderHook} from '@testing-library/react-native'; import useMoneyRequestReportVisibleActions from '@components/MoneyRequestReportView/useMoneyRequestReportVisibleActions'; import OnyxListItemProvider from '@components/OnyxListItemProvider'; -import initOnyxDerivedValues from '@userActions/OnyxDerived'; - import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import type {ReportAction, ReportActions} from '@src/types/onyx'; @@ -63,7 +61,7 @@ function buildParams(reportActions: ReportAction[], overrides: Partial = }; } -/** Push the same actions into Onyx so the VISIBLE_REPORT_ACTIONS derived value the hook subscribes to is populated. */ +/** Push the same actions into Onyx so the cached visibility the hook reads is populated. */ function setReportActions(reportActions: ReportAction[]) { const actions: ReportActions = Object.fromEntries(reportActions.map((action) => [action.reportActionID, action])); return Onyx.merge(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${REPORT_ID}`, actions); @@ -88,7 +86,6 @@ function getVisibleIDs(actions: ReportAction[]) { describe('useMoneyRequestReportVisibleActions', () => { beforeAll(() => { Onyx.init({keys: ONYXKEYS}); - initOnyxDerivedValues(); }); beforeEach(async () => { diff --git a/tests/unit/useReportActionsVisibilityTest.tsx b/tests/unit/useReportActionsVisibilityTest.tsx index 07eaee35c421..ff9f15f2e113 100644 --- a/tests/unit/useReportActionsVisibilityTest.tsx +++ b/tests/unit/useReportActionsVisibilityTest.tsx @@ -4,8 +4,6 @@ import OnyxListItemProvider from '@components/OnyxListItemProvider'; import useReportActionsVisibility from '@hooks/useReportActionsVisibility'; -import initOnyxDerivedValues from '@userActions/OnyxDerived'; - import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import type {ReportActions} from '@src/types/onyx'; @@ -14,16 +12,14 @@ import type {ReactNode} from 'react'; import Onyx from 'react-native-onyx'; -import getOnyxValue from '../utils/getOnyxValue'; import {getFakeReportAction} from '../utils/ReportTestUtils'; import * as TestHelper from '../utils/TestHelper'; import waitForBatchedUpdates from '../utils/waitForBatchedUpdates'; /** - * Guards that `useReportActionsVisibility` subscribes to VISIBLE_REPORT_ACTIONS scoped to its own - * report via `reportVisibleActionsSelector`. The test renders the real hook and counts how often a - * consumer re-renders: with the per-report selector, an unrelated report's activity must not - * re-render this report's consumer. + * Guards that `useReportActionsVisibility` reads the cached visibility of its own report only, through + * `useVisibleReportActions`. The test renders the real hook and counts how often a consumer re-renders: + * an unrelated report's activity must not re-render this report's consumer. */ const REPORT_A = 'reportA'; @@ -38,16 +34,6 @@ function buildActions(...reportActionIDs: string[]): ReportActions { return Object.fromEntries(reportActionIDs.map((id) => [id, buildVisibleComment(id)])); } -/** Build an ADD_COMMENT action whispered to specific accounts (visible only to those accounts). */ -function buildWhisperedComment(reportActionID: string, whisperedTo: number[]) { - return getFakeReportAction(1, { - reportActionID, - actionName: CONST.REPORT.ACTIONS.TYPE.ADD_COMMENT, - message: [{html: 'hey', isDeletedParentAction: false, isEdited: false, text: 'test', type: 'COMMENT', whisperedTo}], - originalMessage: {whisperedTo}, - }); -} - function setReportActions(reportID: string, actions: ReportActions) { return Onyx.merge(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`, actions); } @@ -68,10 +54,9 @@ function buildHookProps(reportID: string, actions: ReportActions): HookProps { const wrapper = ({children}: {children: ReactNode}) => {children}; -describe('useReportActionsVisibility scopes VISIBLE_REPORT_ACTIONS per report', () => { +describe('useReportActionsVisibility scopes the visibility cache per report', () => { beforeAll(() => { Onyx.init({keys: ONYXKEYS}); - initOnyxDerivedValues(); }); beforeEach(async () => { @@ -81,7 +66,7 @@ describe('useReportActionsVisibility scopes VISIBLE_REPORT_ACTIONS per report', }); it('does not re-render the open report (A) when an unrelated report (B) actions change', async () => { - // Given reports A and B both have visible actions in the derived value, and the hook is mounted for A + // Given reports A and B both have visible actions, and the hook is mounted for A await setReportActions(REPORT_A, buildActions('a1', 'a2')); await setReportActions(REPORT_B, buildActions('b1')); await waitForBatchedUpdates(); @@ -140,59 +125,3 @@ describe('useReportActionsVisibility scopes VISIBLE_REPORT_ACTIONS per report', unmount(); }); }); - -describe('VISIBLE_REPORT_ACTIONS reflects deleted report actions', () => { - beforeAll(() => { - Onyx.init({keys: ONYXKEYS}); - initOnyxDerivedValues(); - }); - - beforeEach(async () => { - await Onyx.clear(); - TestHelper.signInWithTestUser(1, 'test@test.com'); - await waitForBatchedUpdates(); - }); - - it('recomputes visibility on a session change (account switch) even when no report action changed', async () => { - // Given report A holds a whisper targeted to account 1, and account 1 is signed in. - // (signInWithTestUser in beforeEach signs in accountID 1.) - await setReportActions(REPORT_A, {whisper: buildWhisperedComment('whisper', [1])}); - await waitForBatchedUpdates(); - - // The whisper is visible to its target (account 1). - const visibleAsTarget = await getOnyxValue(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); - expect(visibleAsTarget?.[REPORT_A]?.whisper).toBe(true); - - // When the session switches to a different user (account 2) without touching the report's actions - await act(async () => { - await Onyx.merge(ONYXKEYS.SESSION, {accountID: 2}); - await waitForBatchedUpdates(); - }); - - // Then the derived value is recomputed against the new user: the whisper now targets "others" and is hidden. - // This only flips if the SESSION delta forces a recompute despite REPORT_ACTIONS being unchanged. - const visibleAsOther = await getOnyxValue(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); - expect(visibleAsOther?.[REPORT_A]?.whisper).toBe(false); - }); - - it('drops a deleted action from the derived value via the incremental delta path', async () => { - // Given a report with two visible actions (so the derived value has a cached entry to update incrementally) - await setReportActions(REPORT_A, buildActions('a1', 'a2')); - await waitForBatchedUpdates(); - - const visibleBefore = await getOnyxValue(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); - expect(Object.keys(visibleBefore?.[REPORT_A] ?? {}).sort()).toEqual(['a1', 'a2']); - - // When one action is deleted (a null tombstone merge, exactly how report action deletion works) - await act(async () => { - await Onyx.merge(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${REPORT_A}`, {a1: null}); - await waitForBatchedUpdates(); - }); - - // Then the deleted action is gone from the derived visibility map (not left stale). - // The member-level delta no longer carries the per-action `null`, so this only passes - // because the changed report is rebuilt from its full current action set. - const visibleAfter = await getOnyxValue(ONYXKEYS.DERIVED.VISIBLE_REPORT_ACTIONS); - expect(Object.keys(visibleAfter?.[REPORT_A] ?? {})).toEqual(['a2']); - }); -}); diff --git a/tests/unit/useVisibleReportActionsTest.tsx b/tests/unit/useVisibleReportActionsTest.tsx new file mode 100644 index 000000000000..44e1a437c8ec --- /dev/null +++ b/tests/unit/useVisibleReportActionsTest.tsx @@ -0,0 +1,156 @@ +/* eslint-disable @typescript-eslint/naming-convention */ +import {act, renderHook} from '@testing-library/react-native'; + +import useVisibleReportActions from '@hooks/useVisibleReportActions'; + +import CONST from '@src/CONST'; +import ONYXKEYS from '@src/ONYXKEYS'; +import type {ReportAction} from '@src/types/onyx'; + +import type * as VisibleReportActionsSelectors from '@selectors/VisibleReportActions'; + +import {getVisibleReportActionsForReports} from '@selectors/VisibleReportActions'; +import Onyx from 'react-native-onyx'; + +import {getFakeReportAction} from '../utils/ReportTestUtils'; +import waitForBatchedUpdatesWithAct from '../utils/waitForBatchedUpdatesWithAct'; + +jest.mock('@selectors/VisibleReportActions', () => { + const actual = jest.requireActual('@selectors/VisibleReportActions'); + return {...actual, getVisibleReportActionsForReports: jest.fn(actual.getVisibleReportActionsForReports)}; +}); + +const REPORT_ID = '1'; +const TRANSACTION_THREAD_REPORT_ID = '2'; +const OTHER_REPORT_ID = '3'; +const CURRENT_USER_ACCOUNT_ID = 10; +const OTHER_USER_ACCOUNT_ID = 20; + +const selectorMock = jest.mocked(getVisibleReportActionsForReports); + +function createComment(reportActionID: number, reportID: string): ReportAction { + return getFakeReportAction(reportActionID, {reportID, actionName: CONST.REPORT.ACTIONS.TYPE.ADD_COMMENT}); +} + +function createWhisper(reportActionID: number, reportID: string, whisperedToAccountID: number): ReportAction { + return getFakeReportAction(reportActionID, { + reportID, + actionName: CONST.REPORT.ACTIONS.TYPE.ADD_COMMENT, + message: [{html: 'whisper', text: 'whisper', type: 'COMMENT', whisperedTo: [whisperedToAccountID]}], + originalMessage: {html: 'whisper', whisperedTo: [whisperedToAccountID]}, + }); +} + +async function setReportActions(reportID: string, actions: ReportAction[]) { + await act(async () => { + await Onyx.set(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`, Object.fromEntries(actions.map((action) => [action.reportActionID, action]))); + }); + await waitForBatchedUpdatesWithAct(); +} + +async function mergeReportAction(reportID: string, action: ReportAction) { + await act(async () => { + await Onyx.merge(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`, {[action.reportActionID]: action}); + }); + await waitForBatchedUpdatesWithAct(); +} + +describe('useVisibleReportActions', () => { + beforeAll(() => { + Onyx.init({keys: ONYXKEYS}); + }); + + beforeEach(async () => { + selectorMock.mockClear(); + await act(async () => { + await Onyx.clear(); + await Onyx.set(ONYXKEYS.SESSION, {accountID: CURRENT_USER_ACCOUNT_ID}); + }); + await waitForBatchedUpdatesWithAct(); + }); + + it('should re-run only when its own report actions change', async () => { + // Given a report and another report, each with one comment, and the hook mounted for the first one + await setReportActions(REPORT_ID, [createComment(1, REPORT_ID)]); + await setReportActions(OTHER_REPORT_ID, [createComment(2, OTHER_REPORT_ID)]); + const {result} = renderHook(() => useVisibleReportActions(REPORT_ID)); + await waitForBatchedUpdatesWithAct(); + const visibilityBeforeWrites = result.current; + const runsBeforeWrites = selectorMock.mock.calls.length; + expect(visibilityBeforeWrites).toEqual({[REPORT_ID]: {'1': true}}); + + // When a comment is added to the other report, which is a write to another member of the same collection + await mergeReportAction(OTHER_REPORT_ID, createComment(3, OTHER_REPORT_ID)); + + // Then the selector doesn't run at all, because the hook depends on its report's member key, not the whole collection + expect(selectorMock.mock.calls.length).toBe(runsBeforeWrites); + expect(result.current).toBe(visibilityBeforeWrites); + + // When a comment is added to the hook's own report + await mergeReportAction(REPORT_ID, createComment(4, REPORT_ID)); + + // Then the selector runs and the new action shows up + expect(selectorMock.mock.calls.length).toBeGreaterThan(runsBeforeWrites); + expect(result.current).toEqual({[REPORT_ID]: {'1': true, '4': true}}); + }); + + it('should follow the transaction thread when one is given', async () => { + // Given a report with a transaction thread, as an LHN row of a one-transaction report sees it + await setReportActions(REPORT_ID, [createComment(1, REPORT_ID)]); + await setReportActions(TRANSACTION_THREAD_REPORT_ID, [createComment(2, TRANSACTION_THREAD_REPORT_ID)]); + const {result} = renderHook(() => useVisibleReportActions(REPORT_ID, TRANSACTION_THREAD_REPORT_ID)); + await waitForBatchedUpdatesWithAct(); + expect(result.current).toEqual({[REPORT_ID]: {'1': true}, [TRANSACTION_THREAD_REPORT_ID]: {'2': true}}); + + // When a comment is added to the transaction thread only + await mergeReportAction(TRANSACTION_THREAD_REPORT_ID, createComment(3, TRANSACTION_THREAD_REPORT_ID)); + + // Then the row sees it, since the thread's member key is a dependency too + expect(result.current?.[TRANSACTION_THREAD_REPORT_ID]).toEqual({'2': true, '3': true}); + }); + + it('should recompute when the session user changes', async () => { + // Given a whisper to the current user + await setReportActions(REPORT_ID, [createWhisper(1, REPORT_ID, CURRENT_USER_ACCOUNT_ID)]); + const {result} = renderHook(() => useVisibleReportActions(REPORT_ID)); + await waitForBatchedUpdatesWithAct(); + expect(result.current?.[REPORT_ID]?.['1']).toBe(true); + + // When another user signs in, which changes whisper targeting while the report actions stay the same + await act(async () => { + await Onyx.set(ONYXKEYS.SESSION, {accountID: OTHER_USER_ACCOUNT_ID}); + }); + await waitForBatchedUpdatesWithAct(); + + // Then the whisper is hidden, so a cached result for the previous user is not reused + expect(result.current?.[REPORT_ID]?.['1']).toBe(false); + }); + + it('should drop a deleted action', async () => { + // Given a report with two visible comments + await setReportActions(REPORT_ID, [createComment(1, REPORT_ID), createComment(2, REPORT_ID)]); + const {result} = renderHook(() => useVisibleReportActions(REPORT_ID)); + await waitForBatchedUpdatesWithAct(); + expect(result.current).toEqual({[REPORT_ID]: {'1': true, '2': true}}); + + // When one comment is deleted with a null tombstone merge, which is how report action deletion works + await act(async () => { + await Onyx.merge(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${REPORT_ID}`, {'1': null}); + }); + await waitForBatchedUpdatesWithAct(); + + // Then the deleted action is gone instead of left stale, because the report is rebuilt from its current actions + expect(result.current).toEqual({[REPORT_ID]: {'2': true}}); + }); + + it('should return undefined when the report has no actions', async () => { + // Given no report actions at all + + // When the hook is mounted for a report + const {result} = renderHook(() => useVisibleReportActions(REPORT_ID)); + await waitForBatchedUpdatesWithAct(); + + // Then it returns undefined, so isReportActionVisible falls back to the runtime check as it did without a derived entry + expect(result.current).toBeUndefined(); + }); +}); From 6efb93cfa3a401df65e2a18930e2b0f3d8169fd7 Mon Sep 17 00:00:00 2001 From: Hubert Sosinski Date: Thu, 8 Oct 2026 18:15:47 +0200 Subject: [PATCH 2/3] Add reassure test for visible report actions on report action writes --- .../VisibleReportActions.perf-test.tsx | 289 ++++++++++++++++++ 1 file changed, 289 insertions(+) create mode 100644 tests/perf-test/VisibleReportActions.perf-test.tsx diff --git a/tests/perf-test/VisibleReportActions.perf-test.tsx b/tests/perf-test/VisibleReportActions.perf-test.tsx new file mode 100644 index 000000000000..f621a15f4232 --- /dev/null +++ b/tests/perf-test/VisibleReportActions.perf-test.tsx @@ -0,0 +1,289 @@ +import {render, screen} from '@testing-library/react-native'; + +import ComposeProviders from '@components/ComposeProviders'; +import OptionRowLHNData from '@components/LHNOptionsList/OptionRowLHN/OptionRowLHNData'; +import {LocaleContextProvider} from '@components/LocaleContextProvider'; +import OnyxListItemProvider from '@components/OnyxListItemProvider'; +import SearchRouterOptionsWarmer from '@components/Search/SearchRouter/SearchRouterOptionsWarmer'; + +import {setHasRadio} from '@libs/NetworkState'; + +import CONST from '@src/CONST'; +import ONYXKEYS from '@src/ONYXKEYS'; +import type {Report, ReportAction, ReportActions} from '@src/types/onyx'; + +import React from 'react'; +import {View} from 'react-native'; +import Onyx from 'react-native-onyx'; +import {measureAsyncFunction, measureRenders} from 'reassure'; + +import * as LHNTestUtils from '../utils/LHNTestUtils'; +import {getFakeReportAction} from '../utils/ReportTestUtils'; +import * as TestHelper from '../utils/TestHelper'; +import waitForBatchedUpdates from '../utils/waitForBatchedUpdates'; +import wrapOnyxWithWaitForBatchedUpdates from '../utils/wrapOnyxWithWaitForBatchedUpdates'; + +jest.mock('@libs/Permissions'); +jest.mock('../../src/libs/Navigation/Navigation', () => ({ + navigate: jest.fn(), + isActiveRoute: jest.fn(), + getTopmostReportId: jest.fn(), + getActiveRoute: jest.fn(), + getTopmostReportActionId: jest.fn(), + isNavigationReady: jest.fn(() => Promise.resolve()), + isDisplayedInModal: jest.fn(() => false), + getActiveRouteWithoutParams: jest.fn(() => ''), +})); + +// The warmer builds the whole option list once its inputs hold still; never building keeps the measurement on its subscriptions +jest.mock('@libs/Scheduler', () => ({ + Scheduler: {scheduleWhenIdle: () => ({cancel: () => {}})}, +})); + +const ROW_COUNT = 50; +const ROWS_WITH_TRANSACTION_THREAD = 10; +const ACTIONS_PER_REPORT = 5; +const LARGE_EXTRA_REPORT_COUNT = 2000; +const WRITES_PER_SCENARIO = 10; +const FIRST_THREAD_REPORT_ID = 10000; +const FIRST_EXTRA_REPORT_ID = 20000; +const UNRELATED_REPORT_ID = '99999'; +const ROW_REPORT_ID = '1'; + +function buildReportActions(reportID: string): ReportActions { + const actions: ReportActions = {}; + for (let index = 0; index < ACTIONS_PER_REPORT; index++) { + const reportActionID = `${reportID}00${index}`; + actions[reportActionID] = getFakeReportAction(index, { + reportActionID, + reportID, + actionName: CONST.REPORT.ACTIONS.TYPE.ADD_COMMENT, + created: `2025-01-01 00:00:0${index}.000`, + }); + } + return actions; +} + +function buildComment(reportID: string, reportActionID: string): ReportAction { + return getFakeReportAction(1, {reportActionID, reportID, actionName: CONST.REPORT.ACTIONS.TYPE.ADD_COMMENT, created: '2025-06-01 00:00:00.000'}); +} + +const rowReports: Report[] = Array.from({length: ROW_COUNT}, (value, index) => ({...LHNTestUtils.getFakeReport([1, 2]), reportID: String(index + 1), lastMessageText: 'hey'})); +const threadReports: Report[] = Array.from({length: ROWS_WITH_TRANSACTION_THREAD}, (value, index) => ({ + ...LHNTestUtils.getFakeReport([1, 2]), + reportID: String(FIRST_THREAD_REPORT_ID + index), +})); + +const smallReportActions: Record = {}; +for (const report of [...rowReports, ...threadReports]) { + smallReportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${report.reportID}`] = buildReportActions(report.reportID); +} +smallReportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${UNRELATED_REPORT_ID}`] = buildReportActions(UNRELATED_REPORT_ID); + +const largeReportActions: Record = {...smallReportActions}; +for (let index = 0; index < LARGE_EXTRA_REPORT_COUNT; index++) { + const reportID = String(FIRST_EXTRA_REPORT_ID + index); + largeReportActions[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`] = buildReportActions(reportID); +} + +/** Passed as the reassure wrapper so the providers sit outside the profiler and render counts are the rows' own */ +function Providers({children}: {children: React.ReactNode}) { + return {children}; +} + +/** LHN rows with fixed props, so the report attributes that every report action write recomputes can't re-render them through the list */ +function LHNRows() { + return ( + + {rowReports.map((report, index) => ( + + ))} + + ); +} + +/** The Search router's warmer reads the visibility of every report, as the other Search surfaces do */ +function SearchConsumer() { + return ( + + {}} /> + + ); +} + +async function seed(reportActions: Record) { + await Onyx.multiSet({ + [ONYXKEYS.PERSONAL_DETAILS_LIST]: LHNTestUtils.fakePersonalDetails, + [ONYXKEYS.IS_LOADING_REPORT_DATA]: false, + ...Object.fromEntries([...rowReports, ...threadReports].map((report) => [`${ONYXKEYS.COLLECTION.REPORT}${report.reportID}`, report])), + ...reportActions, + }); + await waitForBatchedUpdates(); +} + +async function addComments(reportID: string, label: string) { + for (let index = 0; index < WRITES_PER_SCENARIO; index++) { + const reportActionID = `${label}-${index}`; + await Onyx.merge(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`, {[reportActionID]: buildComment(reportID, reportActionID)}); + await waitForBatchedUpdates(); + } +} + +describe('Visible report actions consumers on report action writes', () => { + beforeAll(() => { + Onyx.init({ + keys: ONYXKEYS, + evictableKeys: [ONYXKEYS.COLLECTION.REPORT_ACTIONS], + }); + // Required lazily so LHNTestUtils registers its @react-navigation/native mock before the engine's imports load it + // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access + require('@userActions/OnyxDerived').default(); + }); + + beforeEach(async () => { + global.fetch = TestHelper.getGlobalFetchMock(); + wrapOnyxWithWaitForBatchedUpdates(Onyx); + setHasRadio(true); + await TestHelper.signInWithTestUser(1, 'email1@test.com', undefined, undefined, 'One'); + await waitForBatchedUpdates(); + }); + + afterEach(async () => { + await Onyx.clear(); + await waitForBatchedUpdates(); + }); + + test('[VisibleReportActions] should not re-render 50 LHN rows when comments are added to a report without a row', async () => { + // Given 50 LHN rows, 10 of them with a transaction thread + await seed(smallReportActions); + + // Reassure runs the scenario several times against one seeded Onyx, so every run adds actions that don't exist yet + let run = 0; + const scenario = async () => { + await screen.findByTestId('lhn-rows'); + + // When comments are added to a report that has no row + await addComments(UNRELATED_REPORT_ID, `unrelated-${run}`); + run++; + }; + + // Then reassure measures what the writes cost rows that don't show that report + await measureRenders(, {scenario, wrapper: Providers}); + }); + + test('[VisibleReportActions] should re-render only the LHN row whose report gets comments', async () => { + // Given 50 LHN rows + await seed(smallReportActions); + + let run = 0; + const scenario = async () => { + await screen.findByTestId('lhn-rows'); + + // When comments are added to the first row's report, which changes its last visible action + await addComments(ROW_REPORT_ID, `row-${run}`); + run++; + }; + + // Then reassure measures the cost of a real change, which both versions have to pay for that one row + await measureRenders(, {scenario, wrapper: Providers}); + }); + + test('[VisibleReportActions] should not re-render 50 LHN rows when comments are added to a report without a row in a large collection', async () => { + // Given the same rows, with 2000 more reports holding actions + await seed(largeReportActions); + + let run = 0; + const scenario = async () => { + await screen.findByTestId('lhn-rows'); + + // When comments are added to a report that has no row + await addComments(UNRELATED_REPORT_ID, `large-${run}`); + run++; + }; + + // Then reassure measures the render cost, which grows if a row's selector walks the whole visibility map + await measureRenders(, {scenario, wrapper: Providers}); + }); + + test('[VisibleReportActions] should re-render the Search consumer when comments are added in a large collection', async () => { + // Given the Search router's warmer mounted over 2050 reports with actions + await seed(largeReportActions); + + let run = 0; + const scenario = async () => { + await screen.findByTestId('search-consumer'); + + // When comments are added to one report + await addComments(UNRELATED_REPORT_ID, `search-${run}`); + run++; + }; + + // Then reassure measures what a consumer of every report's visibility pays per write + await measureRenders(, {scenario, wrapper: Providers}); + }); + + test('[VisibleReportActions] should process comment writes with only LHN rows mounted in a large collection', async () => { + // Given the LHN rows mounted over 2050 reports with actions, and no consumer of every report's visibility + await seed(largeReportActions); + render( + + + , + ); + await screen.findByTestId('lhn-rows'); + + // When comments are added to a report without a row repeatedly + let run = 0; + const writeComments = async () => { + await addComments(UNRELATED_REPORT_ID, `timed-lhn-${run}`); + run++; + }; + + // Then reassure times the whole write loop, including the derived compute and its write to Onyx and storage, which happen outside renders + await measureAsyncFunction(writeComments); + }); + + test('[VisibleReportActions] should process comment writes with the Search consumer mounted in a large collection', async () => { + // Given the Search router's warmer mounted over 2050 reports with actions + await seed(largeReportActions); + render( + + + , + ); + await screen.findByTestId('search-consumer'); + + // When comments are added to one report repeatedly + let run = 0; + const writeComments = async () => { + await addComments(UNRELATED_REPORT_ID, `timed-search-${run}`); + run++; + }; + + // Then reassure times the whole write loop, where every write rebuilds the map of every report's visibility + await measureAsyncFunction(writeComments); + }); + + test('[VisibleReportActions] should process comment writes with no consumer mounted in a large collection', async () => { + // Given 2050 reports with actions and nothing mounted that reads their visibility + await seed(largeReportActions); + + // When comments are added to one report repeatedly + let run = 0; + const writeComments = async () => { + await addComments(UNRELATED_REPORT_ID, `timed-idle-${run}`); + run++; + }; + + // Then reassure times the write loop alone, so any work done for the visibility without a reader shows up + await measureAsyncFunction(writeComments); + }); +}); From 9ef3c3a699283cfcdfa3c3b4af17467a851c6298 Mon Sep 17 00:00:00 2001 From: truph01 Date: Thu, 15 Oct 2026 02:24:34 +0700 Subject: [PATCH 3/3] Show empty state instead of No results when default view hides all rows --- src/components/Table/TableBody.tsx | 7 +++- .../TableEmptyStates/TableNoResultsState.tsx | 5 ++- tests/ui/TableTest.tsx | 38 +++++++++++++++++++ 3 files changed, 46 insertions(+), 4 deletions(-) diff --git a/src/components/Table/TableBody.tsx b/src/components/Table/TableBody.tsx index 9a4db2f7aead..faa96b4da20f 100644 --- a/src/components/Table/TableBody.tsx +++ b/src/components/Table/TableBody.tsx @@ -164,6 +164,7 @@ function TableBodyList({contentContainerStyle, emptyMessage, onLayout, style, .. noResultsStateElement, tableListMetadata, isEmptyResult, + isDefaultViewEmpty, scrollWidth, tableWidth, } = useTableContext(); @@ -337,8 +338,10 @@ function TableBodyList({contentContainerStyle, emptyMessage, onLayout, style, .. ); - const emptyStateContent = - tableListMetadata.hasPageHeader && isEmptyResult ? (noResultsStateElement ?? EmptyResultComponent) : (emptyStateElement ?? renderListComponent(ListEmptyComponent)); + // When the default view hides every row (e.g. all workspaces are archived), no search or filter is active, + // so show the empty state rather than "No results". + const shouldShowNoResultsState = tableListMetadata.hasPageHeader && isEmptyResult && !isDefaultViewEmpty; + const emptyStateContent = shouldShowNoResultsState ? (noResultsStateElement ?? EmptyResultComponent) : (emptyStateElement ?? renderListComponent(ListEmptyComponent)); const footerElement = renderListComponent(ListFooterComponent); // Consumer footer flex growth is useful below normal rows, but inside the combined empty-state // footer it can expand over the page header. Preserve the remaining style while disabling growth. diff --git a/src/components/Table/TableEmptyStates/TableNoResultsState.tsx b/src/components/Table/TableEmptyStates/TableNoResultsState.tsx index 60a93ca4a2c6..30c49a66fe35 100644 --- a/src/components/Table/TableEmptyStates/TableNoResultsState.tsx +++ b/src/components/Table/TableEmptyStates/TableNoResultsState.tsx @@ -21,10 +21,11 @@ type TableNoResultsStateProps = Omit { expect(screen.queryByTestId('row-2')).toBeNull(); expect(screen.getByTestId('generic-empty-state')).toBeTruthy(); }); + + it('renders the empty state instead of "No results" when a page-header table hides every row by default', () => { + // Given a page-header table (like the Workspaces list) whose default filter hides every row, with both + // a no-results state and an empty state declared + const props = createDefaultProps(); + const data: TestItem[] = [ + {keyForList: '1', id: '1', name: 'Archived A', category: 'archived', value: 1}, + {keyForList: '2', id: '2', name: 'Archived B', category: 'archived', value: 2}, + ]; + + // When the table renders with no search or filter selected + render( + + data={data} + columns={props.columns} + renderItem={props.renderItem} + keyExtractor={props.keyExtractor} + filters={statusFilterConfig} + isItemInFilter={isItemInStatusFilter} + > + + Page header + + + + + + , + ); + + // Then the empty state shows inside the list with the page header still visible, because the user did + // not search or filter, so "No results found" would be misleading + expect(screen.getByTestId('flash-list')).toBeTruthy(); + expect(screen.getByTestId('table-header-component')).toBeTruthy(); + expect(screen.getAllByTestId('generic-empty-state')).toHaveLength(1); + expect(screen.getByText('No workspaces')).toBeTruthy(); + expect(screen.queryByText('common.noResultsFound')).toBeNull(); + }); }); describe('immediate filter', () => {