diff --git a/src/CONST/index.ts b/src/CONST/index.ts index 0c56e8ff9459..9b71882c1b85 100644 --- a/src/CONST/index.ts +++ b/src/CONST/index.ts @@ -3731,6 +3731,9 @@ const CONST = { LOCALES, + // Shared Intl.Collator options for locale-aware sorting of display names. + COLLATOR_OPTIONS: {usage: 'sort', sensitivity: 'variant', numeric: true, caseFirst: 'upper'} as Intl.CollatorOptions, + PRONOUNS_LIST: [ 'coCos', 'eEyEmEir', diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts index ff79ebaa9adf..cdd6f9ec883f 100755 --- a/src/ONYXKEYS.ts +++ b/src/ONYXKEYS.ts @@ -1183,6 +1183,7 @@ const ONYXKEYS = { TODOS: 'todos', RAM_ONLY_SORTED_REPORT_ACTIONS: 'sortedReportActions', OPEN_AND_SUBMITTED_REPORTS_BY_POLICY_ID: 'openAndSubmittedReportsByPolicyID', + RAM_ONLY_SIDEBAR_ORDERED_REPORTS: 'sidebarOrderedReports', }, /** Stores HybridApp specific state required to interoperate with OldDot */ @@ -1666,6 +1667,7 @@ type OnyxDerivedValuesMapping = { [ONYXKEYS.DERIVED.TODOS]: OnyxTypes.TodosDerivedValue; [ONYXKEYS.DERIVED.RAM_ONLY_SORTED_REPORT_ACTIONS]: OnyxTypes.SortedReportActionsDerivedValue; [ONYXKEYS.DERIVED.OPEN_AND_SUBMITTED_REPORTS_BY_POLICY_ID]: OnyxTypes.OpenAndSubmittedReportsByPolicyIDDerivedValue; + [ONYXKEYS.DERIVED.RAM_ONLY_SIDEBAR_ORDERED_REPORTS]: OnyxTypes.SidebarOrderedReportsDerivedValue; }; type OnyxValues = OnyxValuesMapping & OnyxCollectionValuesMapping & OnyxFormValuesMapping & OnyxFormDraftValuesMapping & OnyxDerivedValuesMapping; diff --git a/src/components/LHNOptionsList/LHNOptionsList.tsx b/src/components/LHNOptionsList/LHNOptionsList.tsx index f97e0b457943..603f9dfd2d82 100644 --- a/src/components/LHNOptionsList/LHNOptionsList.tsx +++ b/src/components/LHNOptionsList/LHNOptionsList.tsx @@ -15,20 +15,19 @@ import getPlatform from '@libs/getPlatform'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; -import type {Report} from '@src/types/onyx'; import LHNTooltipContextProvider from './LHNTooltipContextProvider'; import OptionRowLHNData from './OptionRowLHN'; import OptionRowRendererComponent from './OptionRowRendererComponent'; import type {LHNOptionsListProps, RenderItemProps} from './types'; -const keyExtractor = (item: Report) => `report_${item.reportID}`; +const keyExtractor = (item: string) => `report_${item}`; const platform = getPlatform(); const isWeb = platform === CONST.PLATFORM.WEB; function LHNOptionsList({style, contentContainerStyles, data, onSelectRow, optionMode, shouldDisableFocusOptions = false, onFirstItemRendered = () => {}}: LHNOptionsListProps) { const {saveScrollOffset, getScrollOffset, saveScrollIndex, getScrollIndex} = useContext(ScrollOffsetContext); const {isOffline} = useNetwork(); - const flashListRef = useRef>(null); + const flashListRef = useRef>(null); const route = useRoute(); const [reports] = useOnyx(ONYXKEYS.COLLECTION.REPORT); const reportAttributes = useReportAttributes(); @@ -57,29 +56,29 @@ function LHNOptionsList({style, contentContainerStyles, data, onSelectRow, optio * Function which renders a row in the list */ const renderItem = useCallback( - ({item, index}: RenderItemProps): ReactElement | null => { - if (!item) { + ({item: reportID, index}: RenderItemProps): ReactElement | null => { + if (!reportID) { return null; } - const reportID = item.reportID; + const fullReport = reports?.[`${ONYXKEYS.COLLECTION.REPORT}${reportID}`]; const itemReportAttributes = reportAttributes?.[reportID]; - const itemParentReport = reports?.[`${ONYXKEYS.COLLECTION.REPORT}${item.parentReportID}`]; + const itemParentReport = reports?.[`${ONYXKEYS.COLLECTION.REPORT}${fullReport?.parentReportID}`]; const itemOneTransactionThreadReport = reports?.[`${ONYXKEYS.COLLECTION.REPORT}${itemReportAttributes?.oneTransactionThreadReportID}`]; let invoiceReceiverPolicyID = '-1'; - if (item.invoiceReceiver && 'policyID' in item.invoiceReceiver) { - invoiceReceiverPolicyID = item.invoiceReceiver.policyID; + if (fullReport?.invoiceReceiver && 'policyID' in fullReport.invoiceReceiver) { + invoiceReceiverPolicyID = fullReport.invoiceReceiver.policyID; } if (itemParentReport?.invoiceReceiver && 'policyID' in itemParentReport.invoiceReceiver) { invoiceReceiverPolicyID = itemParentReport.invoiceReceiver.policyID; } const itemInvoiceReceiverPolicy = policy?.[`${ONYXKEYS.COLLECTION.POLICY}${invoiceReceiverPolicyID}`]; - const itemPolicy = policy?.[`${ONYXKEYS.COLLECTION.POLICY}${item.policyID}`]; + const itemPolicy = policy?.[`${ONYXKEYS.COLLECTION.POLICY}${fullReport?.policyID}`]; return ( { - const attrs = reportAttributes?.[report.reportID]; + const firstReportIDWithGBRorRBR = data.find((reportID) => { + const attrs = reportAttributes?.[reportID]; if (!isEmptyObject(attrs?.reportErrors)) { return true; } return attrs?.requiresAttention; }); - const firstReportIDWithGBRorRBR = firstReport?.reportID; const isScreenFocused = useIsFocused(); const isReportsSplitNavigatorLast = useRootNavigationState((state) => state?.routes?.at(-1)?.name === NAVIGATORS.REPORTS_SPLIT_NAVIGATOR); diff --git a/src/components/LHNOptionsList/types.ts b/src/components/LHNOptionsList/types.ts index 829de863508a..814079b72f0d 100644 --- a/src/components/LHNOptionsList/types.ts +++ b/src/components/LHNOptionsList/types.ts @@ -16,8 +16,8 @@ type CustomLHNOptionsListProps = { /** Extra styles for the section list container */ contentContainerStyles?: StyleProp; - /** List of reports */ - data: Report[]; + /** List of report IDs to display, ordered for the LHN */ + data: string[]; /** Callback to fire when a row is selected */ onSelectRow?: (optionItem: OptionData, popoverAnchor: RefObject) => void; @@ -97,6 +97,6 @@ type OptionRowLHNProps = { testID: number; }; -type RenderItemProps = {item: Report; index: number}; +type RenderItemProps = {item: string; index: number}; export type {LHNOptionsListProps, OptionRowLHNDataProps, OptionRowLHNProps, RenderItemProps}; diff --git a/src/components/TestToolMenu.tsx b/src/components/TestToolMenu.tsx index ffebc26007ff..6eed5d6ec797 100644 --- a/src/components/TestToolMenu.tsx +++ b/src/components/TestToolMenu.tsx @@ -4,7 +4,6 @@ import useBiometricRegistrationStatus, {REGISTRATION_STATUS} from '@hooks/useBio import useIsAuthenticated from '@hooks/useIsAuthenticated'; import useLocalize from '@hooks/useLocalize'; import useOnyx from '@hooks/useOnyx'; -import {useSidebarOrderedReportsActions} from '@hooks/useSidebarOrderedReports'; import useSingleExecution from '@hooks/useSingleExecution'; import useThemeStyles from '@hooks/useThemeStyles'; import useWaitForNavigation from '@hooks/useWaitForNavigation'; @@ -32,7 +31,6 @@ function TestToolMenu() { const [shouldShowBranchNameInTitle = false] = useOnyx(ONYXKEYS.SHOULD_SHOW_BRANCH_NAME_IN_TITLE); const styles = useThemeStyles(); const {translate} = useLocalize(); - const {clearLHNCache} = useSidebarOrderedReportsActions(); const [isMFARevokeLoading, setIsMFARevokeLoading] = useState(false); const {localCredentialID, isCurrentDeviceRegistered, otherDeviceCount, registrationStatus} = useBiometricRegistrationStatus(); @@ -120,15 +118,6 @@ function TestToolMenu() { /> - {/* Clears the useSidebarOrderedReports cache to re-compute from latest onyx values */} - -