diff --git a/src/CONST.ts b/src/CONST.ts index 9a47c63c1cb4..4673380127cf 100755 --- a/src/CONST.ts +++ b/src/CONST.ts @@ -6437,7 +6437,6 @@ const CONST = { DATA_TYPES: { EXPENSE: 'expense', INVOICE: 'invoice', - TASK: 'task', TRIP: 'trip', CHAT: 'chat', }, @@ -6506,11 +6505,6 @@ const CONST = { LINKS: 'links', PINNED: 'pinned', }, - TASK: { - ALL: 'all', - OUTSTANDING: 'outstanding', - COMPLETED: 'completed', - }, }, TABLE_COLUMNS: { RECEIPT: 'receipt', @@ -6525,10 +6519,6 @@ const CONST = { TYPE: 'type', ACTION: 'action', TAX_AMOUNT: 'taxAmount', - TITLE: 'title', - ASSIGNEE: 'assignee', - CREATED_BY: 'createdBy', - IN: 'in', }, SYNTAX_OPERATORS: { AND: 'and', @@ -6569,9 +6559,6 @@ const CONST = { PAID: 'paid', EXPORTED: 'exported', POSTED: 'posted', - TITLE: 'title', - ASSIGNEE: 'assignee', - CREATED_BY: 'createdBy', REIMBURSABLE: 'reimbursable', BILLABLE: 'billable', POLICY_ID: 'policyID', @@ -6610,9 +6597,6 @@ const CONST = { PAID: 'paid', EXPORTED: 'exported', POSTED: 'posted', - TITLE: 'title', - ASSIGNEE: 'assignee', - CREATED_BY: 'created-by', REIMBURSABLE: 'reimbursable', BILLABLE: 'billable', }, diff --git a/src/ROUTES.ts b/src/ROUTES.ts index bf32219485e6..a4c6e50a553b 100644 --- a/src/ROUTES.ts +++ b/src/ROUTES.ts @@ -68,9 +68,6 @@ const ROUTES = { SEARCH_ADVANCED_FILTERS_PAID: 'search/filters/paid', SEARCH_ADVANCED_FILTERS_EXPORTED: 'search/filters/exported', SEARCH_ADVANCED_FILTERS_POSTED: 'search/filters/posted', - SEARCH_ADVANCED_FILTERS_TITLE: 'search/filters/title', - SEARCH_ADVANCED_FILTERS_ASSIGNEE: 'search/filters/assignee', - SEARCH_ADVANCED_FILTERS_CREATED_BY: 'search/filters/createdBy', SEARCH_ADVANCED_FILTERS_REIMBURSABLE: 'search/filters/reimbursable', SEARCH_ADVANCED_FILTERS_BILLABLE: 'search/filters/billable', SEARCH_ADVANCED_FILTERS_WORKSPACE: 'search/filters/workspace', diff --git a/src/SCREENS.ts b/src/SCREENS.ts index cb60b91e4e2c..6e12ea0af4ae 100644 --- a/src/SCREENS.ts +++ b/src/SCREENS.ts @@ -61,9 +61,6 @@ const SCREENS = { ADVANCED_FILTERS_TAG_RHP: 'Search_Advanced_Filters_Tag_RHP', ADVANCED_FILTERS_FROM_RHP: 'Search_Advanced_Filters_From_RHP', ADVANCED_FILTERS_TO_RHP: 'Search_Advanced_Filters_To_RHP', - ADVANCED_FILTERS_TITLE_RHP: 'Search_Advanced_Filters_Title_RHP', - ADVANCED_FILTERS_ASSIGNEE_RHP: 'Search_Advanced_Filters_Assignee_RHP', - ADVANCED_FILTERS_CREATED_BY_RHP: 'Search_Advanced_Filters_Created_By_RHP', ADVANCED_FILTERS_REIMBURSABLE_RHP: 'Search_Advanced_Filters_Reimbursable_RHP', ADVANCED_FILTERS_BILLABLE_RHP: 'Search_Advanced_Filters_Billable_RHP', ADVANCED_FILTERS_WORKSPACE_RHP: 'Search_Advanced_Filters_Workspace_RHP', diff --git a/src/components/Search/SearchAutocompleteList.tsx b/src/components/Search/SearchAutocompleteList.tsx index 3cb63a9c5601..9065ed916ba5 100644 --- a/src/components/Search/SearchAutocompleteList.tsx +++ b/src/components/Search/SearchAutocompleteList.tsx @@ -165,13 +165,7 @@ function SearchAutocompleteList( const typeAutocompleteList = Object.values(CONST.SEARCH.DATA_TYPES); const groupByAutocompleteList = Object.values(CONST.SEARCH.GROUP_BY); - const statusAutocompleteList = Object.values({ - ...CONST.SEARCH.STATUS.EXPENSE, - ...CONST.SEARCH.STATUS.INVOICE, - ...CONST.SEARCH.STATUS.CHAT, - ...CONST.SEARCH.STATUS.TRIP, - ...CONST.SEARCH.STATUS.TASK, - }); + const statusAutocompleteList = Object.values({...CONST.SEARCH.STATUS.EXPENSE, ...CONST.SEARCH.STATUS.INVOICE, ...CONST.SEARCH.STATUS.CHAT, ...CONST.SEARCH.STATUS.TRIP}); const expenseTypes = Object.values(CONST.SEARCH.TRANSACTION_TYPE); const booleanTypes = Object.values(CONST.SEARCH.BOOLEAN); @@ -314,21 +308,28 @@ function SearchAutocompleteList( mapKey: CONST.SEARCH.SYNTAX_FILTER_KEYS.TAX_RATE, })); } - case CONST.SEARCH.SYNTAX_FILTER_KEYS.CREATED_BY: - case CONST.SEARCH.SYNTAX_FILTER_KEYS.ASSIGNEE: - case CONST.SEARCH.SYNTAX_FILTER_KEYS.TO: case CONST.SEARCH.SYNTAX_FILTER_KEYS.FROM: { - const filterKey = autocompleteKey === CONST.SEARCH.SYNTAX_FILTER_KEYS.CREATED_BY ? CONST.SEARCH.SEARCH_USER_FRIENDLY_KEYS.CREATED_BY : autocompleteKey; + const filteredParticipants = getParticipantsAutocompleteList() + .filter((participant) => participant.name.toLowerCase().includes(autocompleteValue.toLowerCase()) && !alreadyAutocompletedKeys.includes(participant.name.toLowerCase())) + .slice(0, 10); + return filteredParticipants.map((participant) => ({ + filterKey: CONST.SEARCH.SEARCH_USER_FRIENDLY_KEYS.FROM, + text: participant.name, + autocompleteID: participant.accountID, + mapKey: CONST.SEARCH.SYNTAX_FILTER_KEYS.FROM, + })); + } + case CONST.SEARCH.SYNTAX_FILTER_KEYS.TO: { const filteredParticipants = getParticipantsAutocompleteList() .filter((participant) => participant.name.toLowerCase().includes(autocompleteValue.toLowerCase()) && !alreadyAutocompletedKeys.includes(participant.name.toLowerCase())) .slice(0, 10); return filteredParticipants.map((participant) => ({ - filterKey, + filterKey: CONST.SEARCH.SEARCH_USER_FRIENDLY_KEYS.TO, text: participant.name, autocompleteID: participant.accountID, - mapKey: autocompleteKey, + mapKey: CONST.SEARCH.SYNTAX_FILTER_KEYS.TO, })); } case CONST.SEARCH.SYNTAX_FILTER_KEYS.IN: { diff --git a/src/components/Search/SearchContext.tsx b/src/components/Search/SearchContext.tsx index e593e8dc8d3f..db808e3b71f1 100644 --- a/src/components/Search/SearchContext.tsx +++ b/src/components/Search/SearchContext.tsx @@ -1,5 +1,5 @@ import React, {useCallback, useContext, useMemo, useState} from 'react'; -import type {ReportActionListItemType, ReportListItemType, TaskListItemType, TransactionListItemType} from '@components/SelectionList/types'; +import type {ReportActionListItemType, ReportListItemType, TransactionListItemType} from '@components/SelectionList/types'; import {isMoneyRequestReport} from '@libs/ReportUtils'; import {isReportListItemType, isTransactionListItemType} from '@libs/SearchUIUtils'; import CONST from '@src/CONST'; @@ -27,10 +27,7 @@ const defaultSearchContext: SearchContext = { const Context = React.createContext(defaultSearchContext); -function getReportsFromSelectedTransactions( - data: TransactionListItemType[] | ReportListItemType[] | ReportActionListItemType[] | TaskListItemType[], - selectedTransactions: SelectedTransactions, -) { +function getReportsFromSelectedTransactions(data: TransactionListItemType[] | ReportListItemType[] | ReportActionListItemType[], selectedTransactions: SelectedTransactions) { if (data.length === 0) { return []; } @@ -84,20 +81,17 @@ function SearchContextProvider({children}: ChildrenProps) { })); }, []); - const setSelectedTransactions = useCallback( - (selectedTransactions: SelectedTransactions, data: TransactionListItemType[] | ReportListItemType[] | ReportActionListItemType[] | TaskListItemType[]) => { - // When selecting transactions, we also need to manage the reports to which these transactions belong. This is done to ensure proper exporting to CSV. - const selectedReports = getReportsFromSelectedTransactions(data, selectedTransactions); + const setSelectedTransactions = useCallback((selectedTransactions: SelectedTransactions, data: TransactionListItemType[] | ReportListItemType[] | ReportActionListItemType[]) => { + // When selecting transactions, we also need to manage the reports to which these transactions belong. This is done to ensure proper exporting to CSV. + const selectedReports = getReportsFromSelectedTransactions(data, selectedTransactions); - setSearchContextData((prevState) => ({ - ...prevState, - selectedTransactions, - shouldTurnOffSelectionMode: false, - selectedReports, - })); - }, - [], - ); + setSearchContextData((prevState) => ({ + ...prevState, + selectedTransactions, + shouldTurnOffSelectionMode: false, + selectedReports, + })); + }, []); const clearSelectedTransactions = useCallback( (searchHash?: number, shouldTurnOffSelectionMode = false) => { diff --git a/src/components/Search/SearchList.tsx b/src/components/Search/SearchList.tsx index 7a6f2d900d46..8628f925d518 100644 --- a/src/components/Search/SearchList.tsx +++ b/src/components/Search/SearchList.tsx @@ -13,9 +13,8 @@ import Modal from '@components/Modal'; import {PressableWithFeedback} from '@components/Pressable'; import type ChatListItem from '@components/SelectionList/ChatListItem'; import type ReportListItem from '@components/SelectionList/Search/ReportListItem'; -import type TaskListItem from '@components/SelectionList/Search/TaskListItem'; import type TransactionListItem from '@components/SelectionList/Search/TransactionListItem'; -import type {ExtendedTargetedEvent, ReportListItemType, SearchListItem} from '@components/SelectionList/types'; +import type {ExtendedTargetedEvent, ReportActionListItemType, ReportListItemType, TransactionListItemType} from '@components/SelectionList/types'; import Text from '@components/Text'; import useArrowKeyFocusManager from '@hooks/useArrowKeyFocusManager'; import useKeyboardShortcut from '@hooks/useKeyboardShortcut'; @@ -32,7 +31,8 @@ import variables from '@styles/variables'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; -type SearchListItemComponentType = typeof TransactionListItem | typeof ChatListItem | typeof ReportListItem | typeof TaskListItem; +type SearchListItem = TransactionListItemType | ReportListItemType | ReportActionListItemType; +type SearchListItemComponentType = typeof TransactionListItem | typeof ChatListItem | typeof ReportListItem; type SearchListHandle = { scrollAndHighlightItem?: (items: string[]) => void; @@ -340,27 +340,19 @@ function SearchList( ], ); - const tableHeaderVisible = canSelectMultiple || !!SearchTableHeader; - const selectAllButtonVisible = canSelectMultiple && !SearchTableHeader; - return ( - {tableHeaderVisible && ( + {canSelectMultiple && ( - {canSelectMultiple && ( - 0 && selectedItemsLength !== flattenedTransactions.length} - onPress={() => { - onAllCheckboxPress(); - }} - /> - )} - - {SearchTableHeader} - - {selectAllButtonVisible && ( + 0 && selectedItemsLength !== flattenedTransactions.length} + onPress={() => { + onAllCheckboxPress(); + }} + /> + {SearchTableHeader ?? ( )} - = [ - { - type: CONST.SEARCH.DATA_TYPES.TASK, - status: CONST.SEARCH.STATUS.TASK.ALL, - icon: Expensicons.All, - text: 'common.all', - }, - { - type: CONST.SEARCH.DATA_TYPES.TASK, - status: CONST.SEARCH.STATUS.TASK.OUTSTANDING, - icon: Expensicons.Hourglass, - text: 'common.outstanding', - }, - { - type: CONST.SEARCH.DATA_TYPES.TASK, - status: CONST.SEARCH.STATUS.TASK.COMPLETED, - icon: Expensicons.Checkbox, - text: 'search.filters.completed', - }, -]; - function getOptions(type: SearchDataTypes, groupBy: SearchGroupBy | undefined) { switch (type) { case CONST.SEARCH.DATA_TYPES.INVOICE: @@ -227,8 +206,6 @@ function getOptions(type: SearchDataTypes, groupBy: SearchGroupBy | undefined) { return tripOptions; case CONST.SEARCH.DATA_TYPES.CHAT: return chatOptions; - case CONST.SEARCH.DATA_TYPES.TASK: - return taskOptions; case CONST.SEARCH.DATA_TYPES.EXPENSE: default: return groupBy === CONST.SEARCH.GROUP_BY.REPORTS ? expenseReportOptions : expenseOptions; diff --git a/src/components/Search/index.tsx b/src/components/Search/index.tsx index b3550cef8611..74dbfd2fcc97 100644 --- a/src/components/Search/index.tsx +++ b/src/components/Search/index.tsx @@ -6,7 +6,7 @@ import {useOnyx} from 'react-native-onyx'; import FullPageErrorView from '@components/BlockingViews/FullPageErrorView'; import FullPageOfflineBlockingView from '@components/BlockingViews/FullPageOfflineBlockingView'; import SearchTableHeader from '@components/SelectionList/SearchTableHeader'; -import type {ReportActionListItemType, ReportListItemType, SearchListItem, TransactionListItemType} from '@components/SelectionList/types'; +import type {ReportActionListItemType, ReportListItemType, TransactionListItemType} from '@components/SelectionList/types'; import SearchRowSkeleton from '@components/Skeletons/SearchRowSkeleton'; import useLocalize from '@hooks/useLocalize'; import useMobileSelectionMode from '@hooks/useMobileSelectionMode'; @@ -32,7 +32,6 @@ import { isReportListItemType, isSearchDataLoaded, isSearchResultsEmpty as isSearchResultsEmptyUtil, - isTaskListItemType, isTransactionListItemType, shouldShowEmptyState, shouldShowYear as shouldShowYearUtil, @@ -79,14 +78,12 @@ function mapToTransactionItemWithSelectionInfo(item: TransactionListItemType, se return {...item, shouldAnimateInHighlight, isSelected: selectedTransactions[item.keyForList]?.isSelected && canSelectMultiple}; } -function mapToItemWithSelectionInfo(item: SearchListItem, selectedTransactions: SelectedTransactions, canSelectMultiple: boolean, shouldAnimateInHighlight: boolean) { - if (isTaskListItemType(item)) { - return { - ...item, - shouldAnimateInHighlight, - }; - } - +function mapToItemWithSelectionInfo( + item: TransactionListItemType | ReportListItemType | ReportActionListItemType, + selectedTransactions: SelectedTransactions, + canSelectMultiple: boolean, + shouldAnimateInHighlight: boolean, +) { if (isReportActionListItemType(item)) { return { ...item, @@ -161,6 +158,7 @@ function Search({queryJSON, currentSearchResults, lastNonEmptySearchResults, onS const shouldGroupByReports = groupBy === CONST.SEARCH.GROUP_BY.REPORTS; const {canUseTableReportView} = usePermissions(); + const canSelectMultiple = isSmallScreenWidth ? !!selectionMode?.isEnabled : true; useEffect(() => { clearSelectedTransactions(hash); @@ -328,52 +326,41 @@ function Search({queryJSON, currentSearchResults, lastNonEmptySearchResults, onS } }, [isFocused, data, searchResults?.search?.hasMoreResults, selectedTransactions, setExportMode, setShouldShowExportModeOption, shouldGroupByReports]); - const toggleTransaction = useCallback( - (item: SearchListItem) => { - if (isReportActionListItemType(item)) { - return; - } - if (isTaskListItemType(item)) { + const toggleTransaction = (item: TransactionListItemType | ReportListItemType | ReportActionListItemType) => { + if (isReportActionListItemType(item)) { + return; + } + if (isTransactionListItemType(item)) { + if (!item.keyForList) { return; } - if (isTransactionListItemType(item)) { - if (!item.keyForList) { - return; - } - setSelectedTransactions(prepareTransactionsList(item, selectedTransactions), data); - return; - } + setSelectedTransactions(prepareTransactionsList(item, selectedTransactions), data); + return; + } - if (item.transactions.some((transaction) => selectedTransactions[transaction.keyForList]?.isSelected)) { - const reducedSelectedTransactions: SelectedTransactions = {...selectedTransactions}; + if (item.transactions.some((transaction) => selectedTransactions[transaction.keyForList]?.isSelected)) { + const reducedSelectedTransactions: SelectedTransactions = {...selectedTransactions}; - item.transactions.forEach((transaction) => { - delete reducedSelectedTransactions[transaction.keyForList]; - }); + item.transactions.forEach((transaction) => { + delete reducedSelectedTransactions[transaction.keyForList]; + }); - setSelectedTransactions(reducedSelectedTransactions, data); - return; - } + setSelectedTransactions(reducedSelectedTransactions, data); + return; + } - setSelectedTransactions( - { - ...selectedTransactions, - ...Object.fromEntries(item.transactions.map(mapTransactionItemToSelectedEntry)), - }, - data, - ); - }, - [data, selectedTransactions, setSelectedTransactions], - ); + setSelectedTransactions( + { + ...selectedTransactions, + ...Object.fromEntries(item.transactions.map(mapTransactionItemToSelectedEntry)), + }, + data, + ); + }; const openReport = useCallback( - (item: SearchListItem, isOpenedAsReport?: boolean) => { - if (selectionMode?.isEnabled) { - toggleTransaction(item); - return; - } - + (item: TransactionListItemType | ReportListItemType | ReportActionListItemType, isOpenedAsReport?: boolean) => { const isFromSelfDM = item.reportID === CONST.REPORT.UNREPORTED_REPORT_ID; const isTransactionItem = isTransactionListItemType(item); @@ -417,7 +404,7 @@ function Search({queryJSON, currentSearchResults, lastNonEmptySearchResults, onS Navigation.navigate(ROUTES.SEARCH_REPORT.getRoute({reportID, backTo})); }, - [canUseTableReportView, hash, selectionMode?.isEnabled, toggleTransaction], + [canUseTableReportView, hash], ); const onViewableItemsChanged = useCallback( @@ -453,11 +440,7 @@ function Search({queryJSON, currentSearchResults, lastNonEmptySearchResults, onS const ListItem = getListItem(type, status, shouldGroupByReports); const sortedData = getSortedSections(type, status, data, sortBy, sortOrder, shouldGroupByReports); - const isChat = type === CONST.SEARCH.DATA_TYPES.CHAT; - const isTask = type === CONST.SEARCH.DATA_TYPES.TASK; - const canSelectMultiple = !isChat && !isTask && (!isSmallScreenWidth || selectionMode?.isEnabled === true); - const sortedSelectedData = sortedData.map((item) => { const baseKey = isChat ? `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${(item as ReportActionListItemType).reportActionID}` @@ -535,7 +518,6 @@ function Search({queryJSON, currentSearchResults, lastNonEmptySearchResults, onS const shouldShowYear = shouldShowYearUtil(searchResults?.data); const shouldShowSorting = !Array.isArray(status) && !shouldGroupByReports; - const shouldShowTableHeader = isLargeScreenWidth && !isChat; return ( @@ -546,12 +528,11 @@ function Search({queryJSON, currentSearchResults, lastNonEmptySearchResults, onS onSelectRow={openReport} onCheckboxPress={toggleTransaction} onAllCheckboxPress={toggleAllTransactions} - canSelectMultiple={canSelectMultiple} - shouldPreventLongPressRow={isChat || isTask} + canSelectMultiple={type !== CONST.SEARCH.DATA_TYPES.CHAT && canSelectMultiple} + shouldPreventLongPressRow={isChat} SearchTableHeader={ - !shouldShowTableHeader ? undefined : ( + !isLargeScreenWidth ? undefined : ( ; type InvoiceSearchStatus = ValueOf; type TripSearchStatus = ValueOf; type ChatSearchStatus = ValueOf; -type TaskSearchStatus = ValueOf; -type SearchStatus = - | ExpenseSearchStatus - | InvoiceSearchStatus - | TripSearchStatus - | ChatSearchStatus - | TaskSearchStatus - | Array; +type SearchStatus = ExpenseSearchStatus | InvoiceSearchStatus | TripSearchStatus | ChatSearchStatus | Array; type SearchGroupBy = ValueOf; type TableColumnSize = ValueOf; @@ -73,7 +66,7 @@ type SearchContext = { selectedTransactions: SelectedTransactions; selectedReports: SelectedReports[]; setCurrentSearchHash: (hash: number) => void; - setSelectedTransactions: (selectedTransactions: SelectedTransactions, data: TransactionListItemType[] | ReportListItemType[] | ReportActionListItemType[] | TaskListItemType[]) => void; + setSelectedTransactions: (selectedTransactions: SelectedTransactions, data: TransactionListItemType[] | ReportListItemType[] | ReportActionListItemType[]) => void; clearSelectedTransactions: (hash?: number, shouldTurnOffSelectionMode?: boolean) => void; shouldTurnOffSelectionMode: boolean; shouldShowStatusBarLoading: boolean; @@ -174,7 +167,6 @@ export type { InvoiceSearchStatus, TripSearchStatus, ChatSearchStatus, - TaskSearchStatus, SearchAutocompleteResult, PaymentData, SearchAutocompleteQueryRange, diff --git a/src/components/SelectionList/Search/AvatarWithTextCell.tsx b/src/components/SelectionList/Search/AvatarWithTextCell.tsx deleted file mode 100644 index 74329ed32bdb..000000000000 --- a/src/components/SelectionList/Search/AvatarWithTextCell.tsx +++ /dev/null @@ -1,51 +0,0 @@ -import React from 'react'; -import {View} from 'react-native'; -import Avatar from '@components/Avatar'; -import Text from '@components/Text'; -import useResponsiveLayout from '@hooks/useResponsiveLayout'; -import useThemeStyles from '@hooks/useThemeStyles'; -import CONST from '@src/CONST'; -import type {Icon} from '@src/types/onyx/OnyxCommon'; - -type AvatarWithTextCellProps = { - reportName?: string; - icon?: Icon; -}; - -function AvatarWithTextCell({reportName, icon}: AvatarWithTextCellProps) { - const styles = useThemeStyles(); - const {isLargeScreenWidth} = useResponsiveLayout(); - - if (!reportName || !icon) { - return null; - } - - return ( - - {!!icon && ( - - )} - - {!!reportName && ( - - {reportName} - - )} - - ); -} - -AvatarWithTextCell.displayName = 'ReportInfoCell'; - -export default AvatarWithTextCell; diff --git a/src/components/SelectionList/Search/DateCell.tsx b/src/components/SelectionList/Search/DateCell.tsx deleted file mode 100644 index 98cf88b0a2de..000000000000 --- a/src/components/SelectionList/Search/DateCell.tsx +++ /dev/null @@ -1,28 +0,0 @@ -import React from 'react'; -import TextWithTooltip from '@components/TextWithTooltip'; -import useThemeStyles from '@hooks/useThemeStyles'; -import DateUtils from '@libs/DateUtils'; -import CONST from '@src/CONST'; - -type DateCellProps = { - created: string; - showTooltip: boolean; - isLargeScreenWidth: boolean; -}; - -function DateCell({created, showTooltip, isLargeScreenWidth}: DateCellProps) { - const styles = useThemeStyles(); - - const date = DateUtils.formatWithUTCTimeZone(created, DateUtils.doesDateBelongToAPastYear(created) ? CONST.DATE.MONTH_DAY_YEAR_ABBR_FORMAT : CONST.DATE.MONTH_DAY_ABBR_FORMAT); - - return ( - - ); -} - -DateCell.displayName = 'DateCell'; -export default DateCell; diff --git a/src/components/SelectionList/Search/TaskListItem.tsx b/src/components/SelectionList/Search/TaskListItem.tsx deleted file mode 100644 index 6546e27d6cf4..000000000000 --- a/src/components/SelectionList/Search/TaskListItem.tsx +++ /dev/null @@ -1,80 +0,0 @@ -import React from 'react'; -import BaseListItem from '@components/SelectionList/BaseListItem'; -import type {ListItem, TaskListItemProps, TaskListItemType} from '@components/SelectionList/types'; -import useAnimatedHighlightStyle from '@hooks/useAnimatedHighlightStyle'; -import useResponsiveLayout from '@hooks/useResponsiveLayout'; -import useTheme from '@hooks/useTheme'; -import useThemeStyles from '@hooks/useThemeStyles'; -import variables from '@styles/variables'; -import TaskListItemRow from './TaskListItemRow'; - -function TaskListItem({ - item, - isFocused, - showTooltip, - isDisabled, - canSelectMultiple, - onSelectRow, - onFocus, - onLongPressRow, - shouldSyncFocus, -}: TaskListItemProps) { - const taskItem = item as unknown as TaskListItemType; - const styles = useThemeStyles(); - const theme = useTheme(); - - const {isLargeScreenWidth} = useResponsiveLayout(); - - const listItemPressableStyle = [ - styles.selectionListPressableItemWrapper, - styles.pv3, - styles.ph3, - // Removing background style because they are added to the parent OpacityView via animatedHighlightStyle - styles.bgTransparent, - item.isSelected && styles.activeComponentBG, - styles.mh0, - ]; - - const listItemWrapperStyle = [ - styles.flex1, - styles.userSelectNone, - isLargeScreenWidth ? {...styles.flexRow, ...styles.justifyContentBetween, ...styles.alignItemsCenter} : {...styles.flexColumn, ...styles.alignItemsStretch}, - ]; - - const animatedHighlightStyle = useAnimatedHighlightStyle({ - borderRadius: variables.componentBorderRadius, - shouldHighlight: item?.shouldAnimateInHighlight ?? false, - highlightColor: theme.messageHighlightBG, - backgroundColor: theme.highlightBG, - }); - - return ( - - - - ); -} - -TaskListItem.displayName = 'TaskListItem'; - -export default TaskListItem; diff --git a/src/components/SelectionList/Search/TaskListItemRow.tsx b/src/components/SelectionList/Search/TaskListItemRow.tsx deleted file mode 100644 index 60e31d53c869..000000000000 --- a/src/components/SelectionList/Search/TaskListItemRow.tsx +++ /dev/null @@ -1,256 +0,0 @@ -import React from 'react'; -import type {StyleProp, ViewStyle} from 'react-native'; -import {View} from 'react-native'; -import Avatar from '@components/Avatar'; -import Badge from '@components/Badge'; -import Button from '@components/Button'; -import Icon from '@components/Icon'; -import * as Expensicons from '@components/Icon/Expensicons'; -import {useSession} from '@components/OnyxProvider'; -import type {TaskListItemType} from '@components/SelectionList/types'; -import TextWithTooltip from '@components/TextWithTooltip'; -import useLocalize from '@hooks/useLocalize'; -import useResponsiveLayout from '@hooks/useResponsiveLayout'; -import useStyleUtils from '@hooks/useStyleUtils'; -import useTheme from '@hooks/useTheme'; -import useThemeStyles from '@hooks/useThemeStyles'; -import {callFunctionIfActionIsAllowed} from '@libs/actions/Session'; -import {canActionTask, completeTask} from '@libs/actions/Task'; -import variables from '@styles/variables'; -import CONST from '@src/CONST'; -import AvatarWithTextCell from './AvatarWithTextCell'; -import DateCell from './DateCell'; -import UserInfoCell from './UserInfoCell'; - -type TaskListItemRowProps = { - item: TaskListItemType; - showTooltip: boolean; - containerStyle?: StyleProp; -}; - -type CellProps = { - // eslint-disable-next-line react/no-unused-prop-types - showTooltip: boolean; - isLargeScreenWidth: boolean; -}; - -type TaskCellProps = { - taskItem: TaskListItemType; -} & CellProps; - -function TitleCell({taskItem, showTooltip, isLargeScreenWidth}: TaskCellProps) { - const styles = useThemeStyles(); - - return ( - - ); -} - -function DescriptionCell({taskItem, showTooltip, isLargeScreenWidth}: TaskCellProps) { - const styles = useThemeStyles(); - - return ( - - ); -} - -function ActionCell({taskItem, isLargeScreenWidth}: TaskCellProps) { - const theme = useTheme(); - const styles = useThemeStyles(); - const StyleUtils = useStyleUtils(); - const session = useSession(); - const {translate} = useLocalize(); - - const taskAssigneeID = taskItem.assignee.accountID; - const taskCreatorID = taskItem.createdBy.accountID; - const isTaskCompleted = taskItem.statusNum === CONST.REPORT.STATUS_NUM.APPROVED && taskItem.stateNum === CONST.REPORT.STATE_NUM.APPROVED; - - if (isTaskCompleted) { - return ( - - - - ); - } - - return ( -