diff --git a/src/components/SelectionList/Search/CardListItem.tsx b/src/components/SelectionList/Search/CardListItem.tsx index a11da62979cd..03a4245a90c4 100644 --- a/src/components/SelectionList/Search/CardListItem.tsx +++ b/src/components/SelectionList/Search/CardListItem.tsx @@ -2,10 +2,9 @@ import {Str} from 'expensify-common'; import React, {useCallback} from 'react'; import {View} from 'react-native'; import Avatar from '@components/Avatar'; +import Checkbox from '@components/Checkbox'; import Icon from '@components/Icon'; import {FallbackAvatar} from '@components/Icon/Expensicons'; -import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; -import SelectCircle from '@components/SelectCircle'; import BaseListItem from '@components/SelectionList/BaseListItem'; import type {BaseListItemProps, ListItem} from '@components/SelectionList/types'; import TextWithTooltip from '@components/TextWithTooltip'; @@ -50,7 +49,7 @@ function CardListItem({ const ownersAvatar = { source: item.cardOwnerPersonalDetails?.avatar ?? FallbackAvatar, - id: item.cardOwnerPersonalDetails?.accountID ?? -1, + id: item.cardOwnerPersonalDetails?.accountID ?? CONST.DEFAULT_NUMBER_ID, type: CONST.ICON_TYPE_AVATAR, name: item.cardOwnerPersonalDetails?.displayName ?? '', fallbackIcon: item.cardOwnerPersonalDetails?.fallbackIcon, @@ -85,7 +84,7 @@ function CardListItem({ ({ {!!canSelectMultiple && !item.isDisabled && ( - - - + onPress={handleCheckboxPress} + disabled={!!isDisabled} + style={styles.ml3} + /> )} diff --git a/src/pages/Search/SearchAdvancedFiltersPage/SearchFiltersCardPage.tsx b/src/pages/Search/SearchAdvancedFiltersPage/SearchFiltersCardPage.tsx index 3debb2cdb39e..2b158db30457 100644 --- a/src/pages/Search/SearchAdvancedFiltersPage/SearchFiltersCardPage.tsx +++ b/src/pages/Search/SearchAdvancedFiltersPage/SearchFiltersCardPage.tsx @@ -1,10 +1,10 @@ import React, {useCallback, useEffect, useMemo, useState} from 'react'; import {View} from 'react-native'; import {useOnyx} from 'react-native-onyx'; -import Button from '@components/Button'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import {usePersonalDetails} from '@components/OnyxProvider'; import ScreenWrapper from '@components/ScreenWrapper'; +import SearchFilterPageFooterButtons from '@components/Search/SearchFilterPageFooterButtons'; import SelectionList from '@components/SelectionList'; import CardListItem from '@components/SelectionList/Search/CardListItem'; import useDebouncedState from '@hooks/useDebouncedState'; @@ -25,10 +25,10 @@ function SearchFiltersCardPage() { const {translate} = useLocalize(); const illustrations = useThemeIllustrations(); - const [userCardList, userCardListMetadata] = useOnyx(ONYXKEYS.CARD_LIST); - const [workspaceCardFeeds, workspaceCardFeedsMetadata] = useOnyx(ONYXKEYS.COLLECTION.WORKSPACE_CARDS_LIST); + const [userCardList, userCardListMetadata] = useOnyx(ONYXKEYS.CARD_LIST, {canBeMissing: true}); + const [workspaceCardFeeds, workspaceCardFeedsMetadata] = useOnyx(ONYXKEYS.COLLECTION.WORKSPACE_CARDS_LIST, {canBeMissing: true}); const [searchTerm, debouncedSearchTerm, setSearchTerm] = useDebouncedState(''); - const [searchAdvancedFiltersForm, searchAdvancedFiltersFormMetadata] = useOnyx(ONYXKEYS.FORMS.SEARCH_ADVANCED_FILTERS_FORM); + const [searchAdvancedFiltersForm, searchAdvancedFiltersFormMetadata] = useOnyx(ONYXKEYS.FORMS.SEARCH_ADVANCED_FILTERS_FORM, {canBeMissing: true}); const personalDetails = usePersonalDetails(); const [selectedCards, setSelectedCards] = useState([]); @@ -147,17 +147,18 @@ function SearchFiltersCardPage() { const headerMessage = debouncedSearchTerm.trim() && sections.every((section) => !section.data.length) ? translate('common.noResultsFound') : ''; + const resetChanges = useCallback(() => { + setSelectedCards([]); + }, [setSelectedCards]); + const footerContent = useMemo( () => ( -