diff --git a/src/components/Search/index.tsx b/src/components/Search/index.tsx index 3c8d6260698c..7cd555ea9e4e 100644 --- a/src/components/Search/index.tsx +++ b/src/components/Search/index.tsx @@ -91,8 +91,8 @@ function Search({queryJSON, onSearchListScroll, contentContainerStyle}: SearchPr const {isSmallScreenWidth, isLargeScreenWidth} = useResponsiveLayout(); const navigation = useNavigation>(); const lastSearchResultsRef = useRef>(); - const {selectionMode} = useMobileSelectionMode(false); const {setCurrentSearchHash, setSelectedTransactions, selectedTransactions, clearSelectedTransactions, setShouldShowStatusBarLoading} = useSearchContext(); + const {selectionMode} = useMobileSelectionMode(); const [offset, setOffset] = useState(0); const {type, status, sortBy, sortOrder, hash} = queryJSON; @@ -379,11 +379,6 @@ function Search({queryJSON, onSearchListScroll, contentContainerStyle}: SearchPr onTurnOnSelectionMode={(item) => item && toggleTransaction(item)} onCheckboxPress={toggleTransaction} onSelectAll={toggleAllTransactions} - isSelected={(item) => - status !== CONST.SEARCH.STATUS.EXPENSE.ALL && SearchUtils.isReportListItemType(item) - ? item.transactions.some((transaction) => selectedTransactions[transaction.keyForList]?.isSelected) - : !!item.isSelected - } customListHeader={ !isLargeScreenWidth ? null : ( ) } - shouldAutoTurnOff={false} onScroll={onSearchListScroll} canSelectMultiple={type !== CONST.SEARCH.DATA_TYPES.CHAT && canSelectMultiple} customListHeaderHeight={searchHeaderHeight} diff --git a/src/components/SelectionListWithModal/index.tsx b/src/components/SelectionListWithModal/index.tsx index 068e70099318..2d218bc815fe 100644 --- a/src/components/SelectionListWithModal/index.tsx +++ b/src/components/SelectionListWithModal/index.tsx @@ -1,5 +1,5 @@ import type {ForwardedRef} from 'react'; -import React, {forwardRef, useEffect, useRef, useState} from 'react'; +import React, {forwardRef, useEffect, useState} from 'react'; import * as Expensicons from '@components/Icon/Expensicons'; import MenuItem from '@components/MenuItem'; import Modal from '@components/Modal'; @@ -14,12 +14,10 @@ import CONST from '@src/CONST'; type SelectionListWithModalProps = BaseSelectionListProps & { turnOnSelectionModeOnLongPress?: boolean; onTurnOnSelectionMode?: (item: TItem | null) => void; - shouldAutoTurnOff?: boolean; - isSelected?: (item: TItem) => boolean; }; function SelectionListWithModal( - {turnOnSelectionModeOnLongPress, onTurnOnSelectionMode, onLongPressRow, sections, shouldAutoTurnOff, isSelected, ...rest}: SelectionListWithModalProps, + {turnOnSelectionModeOnLongPress, onTurnOnSelectionMode, onLongPressRow, sections, ...rest}: SelectionListWithModalProps, ref: ForwardedRef, ) { const [isModalVisible, setIsModalVisible] = useState(false); @@ -28,47 +26,21 @@ function SelectionListWithModal( // We need to use isSmallScreenWidth instead of shouldUseNarrowLayout here because there is a race condition that causes shouldUseNarrowLayout to change indefinitely in this component // See https://github.com/Expensify/App/issues/48675 for more details const {isSmallScreenWidth} = useResponsiveLayout(); - const {selectionMode} = useMobileSelectionMode(shouldAutoTurnOff); - // Check if selection should be on when the modal is opened - const wasSelectionOnRef = useRef(false); - // Keep track of the number of selected items to determine if we should turn off selection mode - const selectionRef = useRef(0); + const {selectionMode} = useMobileSelectionMode(true); useEffect(() => { // We can access 0 index safely as we are not displaying multiple sections in table view - const selectedItems = sections[0].data.filter((item) => { - if (isSelected) { - return isSelected(item); - } - return !!item.isSelected; - }); - selectionRef.current = selectedItems.length; - + const selectedItems = sections[0].data.filter((item) => item.isSelected); if (!isSmallScreenWidth) { if (selectedItems.length === 0) { turnOffMobileSelectionMode(); } return; } - if (!wasSelectionOnRef.current && selectedItems.length > 0) { - wasSelectionOnRef.current = true; - } if (selectedItems.length > 0 && !selectionMode?.isEnabled) { turnOnMobileSelectionMode(); - } else if (selectedItems.length === 0 && selectionMode?.isEnabled && !wasSelectionOnRef.current) { - turnOffMobileSelectionMode(); } - }, [sections, selectionMode, isSmallScreenWidth, isSelected]); - - useEffect( - () => () => { - if (selectionRef.current !== 0) { - return; - } - turnOffMobileSelectionMode(); - }, - [], - ); + }, [sections, selectionMode, isSmallScreenWidth]); const handleLongPressRow = (item: TItem) => { // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing