diff --git a/src/languages/en.ts b/src/languages/en.ts index 6e75212a7347..09fa01ad5af1 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -2614,7 +2614,9 @@ export default { reportFields: { addField: 'Add field', delete: 'Delete field', - deleteConfirmation: 'Are you sure that you want to delete this field?', + deleteFields: 'Delete fields', + deleteConfirmation: 'Are you sure you want to delete this report field?', + deleteFieldsConfirmation: 'Are you sure you want to delete these report fields?', emptyReportFields: { title: "You haven't created any report fields", subtitle: 'Add a custom field (text, date, or dropdown) that appears on reports.', diff --git a/src/languages/es.ts b/src/languages/es.ts index 9d395077c1bf..6443d7832832 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -2658,8 +2658,10 @@ export default { }, reportFields: { addField: 'Añadir campo', - delete: 'Eliminar campos', - deleteConfirmation: '¿Estás seguro de que quieres eliminar esta campos?', + delete: 'Eliminar campo', + deleteFields: 'Eliminar campos', + deleteConfirmation: '¿Está seguro de que desea eliminar este campo del informe?', + deleteFieldsConfirmation: '¿Está seguro de que desea eliminar estos campos del informe?', emptyReportFields: { title: 'No has creado ningún campo de informe', subtitle: 'Añade un campo personalizado (texto, fecha o desplegable) que aparezca en los informes.', diff --git a/src/libs/API/types.ts b/src/libs/API/types.ts index e1647faf0d56..1fe8dc0e9b6e 100644 --- a/src/libs/API/types.ts +++ b/src/libs/API/types.ts @@ -131,7 +131,7 @@ const WRITE_COMMANDS = { RENAME_POLICY_TAG: 'RenamePolicyTag', SET_WORKSPACE_REQUIRES_CATEGORY: 'SetWorkspaceRequiresCategory', DELETE_WORKSPACE_CATEGORIES: 'DeleteWorkspaceCategories', - POLICY_REPORT_FIELDS_REPLACE: 'Policy_ReportFields_Replace', + DELETE_POLICY_REPORT_FIELD: 'DeletePolicyReportField', SET_POLICY_TAGS_REQUIRED: 'SetPolicyTagsRequired', SET_POLICY_REQUIRES_TAG: 'SetPolicyRequiresTag', RENAME_POLICY_TAG_LIST: 'RenamePolicyTaglist', @@ -410,7 +410,7 @@ type WriteCommandParameters = { [WRITE_COMMANDS.RENAME_WORKSPACE_CATEGORY]: Parameters.RenameWorkspaceCategoriesParams; [WRITE_COMMANDS.SET_WORKSPACE_REQUIRES_CATEGORY]: Parameters.SetWorkspaceRequiresCategoryParams; [WRITE_COMMANDS.DELETE_WORKSPACE_CATEGORIES]: Parameters.DeleteWorkspaceCategoriesParams; - [WRITE_COMMANDS.POLICY_REPORT_FIELDS_REPLACE]: Parameters.PolicyReportFieldsReplace; + [WRITE_COMMANDS.DELETE_POLICY_REPORT_FIELD]: Parameters.PolicyReportFieldsReplace; [WRITE_COMMANDS.SET_POLICY_REQUIRES_TAG]: Parameters.SetPolicyRequiresTag; [WRITE_COMMANDS.SET_POLICY_TAGS_REQUIRED]: Parameters.SetPolicyTagsRequired; [WRITE_COMMANDS.RENAME_POLICY_TAG_LIST]: Parameters.RenamePolicyTaglistParams; diff --git a/src/libs/actions/Policy/ReportField.ts b/src/libs/actions/Policy/ReportField.ts index 31af3ff53c4c..bccb08c47c18 100644 --- a/src/libs/actions/Policy/ReportField.ts +++ b/src/libs/actions/Policy/ReportField.ts @@ -265,7 +265,7 @@ function deleteReportFields(policyID: string, reportFieldsToUpdate: string[]) { reportFields: JSON.stringify(Object.values(updatedReportFields)), }; - API.write(WRITE_COMMANDS.POLICY_REPORT_FIELDS_REPLACE, parameters, onyxData); + API.write(WRITE_COMMANDS.DELETE_POLICY_REPORT_FIELD, parameters, onyxData); } /** diff --git a/src/pages/workspace/reportFields/WorkspaceReportFieldsPage.tsx b/src/pages/workspace/reportFields/WorkspaceReportFieldsPage.tsx index 4ab6e48811c5..7568d3e8583c 100644 --- a/src/pages/workspace/reportFields/WorkspaceReportFieldsPage.tsx +++ b/src/pages/workspace/reportFields/WorkspaceReportFieldsPage.tsx @@ -5,6 +5,9 @@ import React, {useEffect, useMemo, useState} from 'react'; import {ActivityIndicator, View} from 'react-native'; import {useOnyx} from 'react-native-onyx'; import Button from '@components/Button'; +import ButtonWithDropdownMenu from '@components/ButtonWithDropdownMenu'; +import type {DropdownOption} from '@components/ButtonWithDropdownMenu/types'; +import ConfirmModal from '@components/ConfirmModal'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import * as Expensicons from '@components/Icon/Expensicons'; import * as Illustrations from '@components/Icon/Illustrations'; @@ -16,6 +19,7 @@ import type {ListItem} from '@components/SelectionList/types'; import Text from '@components/Text'; import WorkspaceEmptyStateSection from '@components/WorkspaceEmptyStateSection'; import useLocalize from '@hooks/useLocalize'; +import useResponsiveLayout from '@hooks/useResponsiveLayout'; import useTheme from '@hooks/useTheme'; import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; @@ -24,11 +28,13 @@ import Navigation from '@libs/Navigation/Navigation'; import type {FullScreenNavigatorParamList} from '@libs/Navigation/types'; import * as ReportUtils from '@libs/ReportUtils'; import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper'; +import * as ReportField from '@userActions/Policy/ReportField'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import type SCREENS from '@src/SCREENS'; import type {PolicyReportField} from '@src/types/onyx/Policy'; +import type DeepValueOf from '@src/types/utils/DeepValueOf'; type ReportFieldForList = ListItem & { value: string; @@ -43,6 +49,7 @@ function WorkspaceReportFieldsPage({ params: {policyID}, }, }: WorkspaceReportFieldsPageProps) { + const {shouldUseNarrowLayout} = useResponsiveLayout(); const {isSmallScreenWidth} = useWindowDimensions(); const styles = useThemeStyles(); const theme = useTheme(); @@ -57,6 +64,7 @@ function WorkspaceReportFieldsPage({ return Object.fromEntries(Object.entries(policy.fieldList).filter(([_, value]) => value.fieldID !== 'text_title')); }, [policy]); const [selectedReportFields, setSelectedReportFields] = useState([]); + const [deleteReportFieldsConfirmModalVisible, setDeleteReportFieldsConfirmModalVisible] = useState(false); useEffect(() => { if (isFocused) { @@ -79,6 +87,7 @@ function WorkspaceReportFieldsPage({ orderWeight: reportField.orderWeight, pendingAction: reportField.pendingAction, isSelected: selectedReportFields.find((selectedReportField) => selectedReportField.name === reportField.name) !== undefined, + isDisabled: reportField.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE, text: reportField.name, rightElement: ( { + const availableReportFields = Object.values(filteredPolicyFieldList).filter((reportField) => reportField.pendingAction !== CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE); + const isAllSelected = availableReportFields.length === selectedReportFields.length; + setSelectedReportFields(isAllSelected ? [] : availableReportFields); + }; + const navigateToReportFieldSettings = (reportField: ReportFieldForList) => { Navigation.navigate(ROUTES.WORKSPACE_REPORT_FIELD_SETTINGS.getRoute(policyID, reportField.fieldID)); }; + const handleDeleteReportFields = () => { + const reportFieldKeys = selectedReportFields.map((selectedReportField) => ReportUtils.getReportFieldKey(selectedReportField.fieldID)); + setSelectedReportFields([]); + ReportField.deleteReportFields(policyID, reportFieldKeys); + setDeleteReportFieldsConfirmModalVisible(false); + }; + const isLoading = policy === undefined; - const shouldShowEmptyState = Object.values(filteredPolicyFieldList).length <= 0 && !isLoading; - - const getHeaderButtons = () => ( - -