Merge pull request Expensify#45185 from waterim/fix-Report_fields_del…

…eteAll_list FIx: initial value with empty values for list, subtitle in edit flow
tienifr · Jul 19, 2024 · 16baf94 · 16baf94
2 parents ffea2ab + ac0e3f0
commit 16baf94
Show file tree

Hide file tree

Showing 7 changed files with 58 additions and 14 deletions.
diff --git a/src/libs/API/parameters/OpenPolicyReportFieldsPageParams.ts b/src/libs/API/parameters/OpenPolicyReportFieldsPageParams.ts
@@ -0,0 +1,5 @@
+type OpenPolicyReportFieldsPageParams = {
+    policyID: string;
+};
+
+export default OpenPolicyReportFieldsPageParams;
diff --git a/src/libs/API/parameters/index.ts b/src/libs/API/parameters/index.ts
@@ -196,6 +196,7 @@ export type {default as CreatePolicyTaxParams} from './CreatePolicyTaxParams';
 export type {default as OpenPolicyWorkflowsPageParams} from './OpenPolicyWorkflowsPageParams';
 export type {default as OpenPolicyDistanceRatesPageParams} from './OpenPolicyDistanceRatesPageParams';
 export type {default as OpenPolicyTaxesPageParams} from './OpenPolicyTaxesPageParams';
+export type {default as OpenPolicyReportFieldsPageParams} from './OpenPolicyReportFieldsPageParams';
 export type {default as EnablePolicyTaxesParams} from './EnablePolicyTaxesParams';
 export type {default as OpenPolicyMoreFeaturesPageParams} from './OpenPolicyMoreFeaturesPageParams';
 export type {default as CreatePolicyDistanceRateParams} from './CreatePolicyDistanceRateParams';

diff --git a/src/libs/API/types.ts b/src/libs/API/types.ts
@@ -676,6 +676,7 @@ const READ_COMMANDS = {
     OPEN_POLICY_CATEGORIES_PAGE: 'OpenPolicyCategoriesPage',
     OPEN_POLICY_TAGS_PAGE: 'OpenPolicyTagsPage',
     OPEN_POLICY_TAXES_PAGE: 'OpenPolicyTaxesPage',
+    OPEN_POLICY_REPORT_FIELDS_PAGE: 'OpenPolicyReportFieldsPage',
     OPEN_POLICY_EXPENSIFY_CARDS_PAGE: 'OpenPolicyExpensifyCardsPage',
     OPEN_WORKSPACE_INVITE_PAGE: 'OpenWorkspaceInvitePage',
     OPEN_DRAFT_WORKSPACE_REQUEST: 'OpenDraftWorkspaceRequest',
@@ -730,6 +731,7 @@ type ReadCommandParameters = {
     [READ_COMMANDS.OPEN_POLICY_CATEGORIES_PAGE]: Parameters.OpenPolicyCategoriesPageParams;
     [READ_COMMANDS.OPEN_POLICY_TAGS_PAGE]: Parameters.OpenPolicyTagsPageParams;
     [READ_COMMANDS.OPEN_POLICY_TAXES_PAGE]: Parameters.OpenPolicyTaxesPageParams;
+    [READ_COMMANDS.OPEN_POLICY_REPORT_FIELDS_PAGE]: Parameters.OpenPolicyReportFieldsPageParams;
     [READ_COMMANDS.OPEN_WORKSPACE_INVITE_PAGE]: Parameters.OpenWorkspaceInvitePageParams;
     [READ_COMMANDS.OPEN_DRAFT_WORKSPACE_REQUEST]: Parameters.OpenDraftWorkspaceRequestParams;
     [READ_COMMANDS.OPEN_POLICY_WORKFLOWS_PAGE]: Parameters.OpenPolicyWorkflowsPageParams;

diff --git a/src/libs/actions/Policy/ReportField.ts b/src/libs/actions/Policy/ReportField.ts
@@ -7,11 +7,13 @@ import type {
     CreateWorkspaceReportFieldParams,
     DeletePolicyReportField,
     EnableWorkspaceReportFieldListValueParams,
+    OpenPolicyReportFieldsPageParams,
     RemoveWorkspaceReportFieldListValueParams,
     UpdateWorkspaceReportFieldInitialValueParams,
 } from '@libs/API/parameters';
-import {WRITE_COMMANDS} from '@libs/API/types';
+import {READ_COMMANDS, WRITE_COMMANDS} from '@libs/API/types';
 import * as ErrorUtils from '@libs/ErrorUtils';
+import Log from '@libs/Log';
 import * as ReportUtils from '@libs/ReportUtils';
 import * as WorkspaceReportFieldUtils from '@libs/WorkspaceReportFieldUtils';
 import CONST from '@src/CONST';
@@ -69,6 +71,19 @@ Onyx.connect({
     },
 });
 
+function openPolicyReportFieldsPage(policyID: string) {
+    if (!policyID) {
+        Log.warn('openPolicyReportFieldsPage invalid params', {policyID});
+        return;
+    }
+
+    const params: OpenPolicyReportFieldsPageParams = {
+        policyID,
+    };
+
+    API.read(READ_COMMANDS.OPEN_POLICY_REPORT_FIELDS_PAGE, params);
+}
+
 /**
  * Sets the initial form values for the workspace report fields form.
  */
@@ -540,6 +555,7 @@ export {
     deleteReportFields,
     updateReportFieldInitialValue,
     updateReportFieldListValueEnabled,
+    openPolicyReportFieldsPage,
     addReportFieldListValue,
     removeReportFieldListValue,
 };
diff --git a/src/pages/workspace/reportFields/ReportFieldsInitialValuePage.tsx b/src/pages/workspace/reportFields/ReportFieldsInitialValuePage.tsx
@@ -1,10 +1,12 @@
 import type {StackScreenProps} from '@react-navigation/stack';
 import React, {useCallback, useState} from 'react';
+import {View} from 'react-native';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
 import type {FormInputErrors, FormOnyxValues} from '@components/Form/types';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import ScreenWrapper from '@components/ScreenWrapper';
+import Text from '@components/Text';
 import TextInput from '@components/TextInput';
 import useAutoFocusInput from '@hooks/useAutoFocusInput';
 import useLocalize from '@hooks/useLocalize';
@@ -107,6 +109,12 @@ function ReportFieldsInitialValuePage({
                     title={reportField.name}
                     onBackButtonPress={Navigation.goBack}
                 />
+                {isListFieldType && (
+                    <View style={[styles.ph5, styles.pb4]}>
+                        <Text style={[styles.sidebarLinkText, styles.optionAlternateText]}>{translate('workspace.reportFields.listValuesInputSubtitle')}</Text>
+                    </View>
+                )}
+
                 {isTextFieldType && (
                     <FormProvider
                         formID={ONYXKEYS.FORMS.WORKSPACE_REPORT_FIELDS_FORM}

diff --git a/src/pages/workspace/reportFields/ReportFieldsSettingsPage.tsx b/src/pages/workspace/reportFields/ReportFieldsSettingsPage.tsx
@@ -46,6 +46,7 @@ function ReportFieldsSettingsPage({
 
     const isDateFieldType = reportField.type === CONST.REPORT_FIELD_TYPES.DATE;
     const isListFieldType = reportField.type === CONST.REPORT_FIELD_TYPES.LIST;
+    const isListFieldEmpty = isListFieldType && reportField.values.length <= 0;
 
     const deleteReportFieldAndHideModal = () => {
         ReportField.deleteReportFields(policyID, [reportFieldKey]);
@@ -82,15 +83,17 @@ function ReportFieldsSettingsPage({
                     description={translate('common.type')}
                     interactive={false}
                 />
-                <MenuItemWithTopDescription
-                    style={[styles.moneyRequestMenuItem]}
-                    titleStyle={styles.flex1}
-                    title={WorkspaceReportFieldUtils.getReportFieldInitialValue(reportField)}
-                    description={translate('common.initialValue')}
-                    shouldShowRightIcon={!isDateFieldType && !hasAccountingConnections}
-                    interactive={!isDateFieldType && !hasAccountingConnections}
-                    onPress={() => Navigation.navigate(ROUTES.WORKSPACE_EDIT_REPORT_FIELDS_INITIAL_VALUE.getRoute(policyID, reportFieldID))}
-                />
+                {!isListFieldEmpty && (
+                    <MenuItemWithTopDescription
+                        style={[styles.moneyRequestMenuItem]}
+                        titleStyle={styles.flex1}
+                        title={WorkspaceReportFieldUtils.getReportFieldInitialValue(reportField)}
+                        description={translate('common.initialValue')}
+                        shouldShowRightIcon={!isDateFieldType && !hasAccountingConnections}
+                        interactive={!isDateFieldType && !hasAccountingConnections}
+                        onPress={() => Navigation.navigate(ROUTES.WORKSPACE_EDIT_REPORT_FIELDS_INITIAL_VALUE.getRoute(policyID, reportFieldID))}
+                    />
+                )}
                 {isListFieldType && (
                     <MenuItemWithTopDescription
                         style={[styles.moneyRequestMenuItem]}

diff --git a/src/pages/workspace/reportFields/WorkspaceReportFieldsPage.tsx b/src/pages/workspace/reportFields/WorkspaceReportFieldsPage.tsx
@@ -1,7 +1,7 @@
-import {useIsFocused} from '@react-navigation/native';
+import {useFocusEffect, useIsFocused} from '@react-navigation/native';
 import type {StackScreenProps} from '@react-navigation/stack';
 import {Str} from 'expensify-common';
-import React, {useEffect, useMemo, useState} from 'react';
+import React, {useCallback, useEffect, useMemo, useState} from 'react';
 import {ActivityIndicator, View} from 'react-native';
 import {useOnyx} from 'react-native-onyx';
 import Button from '@components/Button';
@@ -21,6 +21,7 @@ import TextLink from '@components/TextLink';
 import WorkspaceEmptyStateSection from '@components/WorkspaceEmptyStateSection';
 import useEnvironment from '@hooks/useEnvironment';
 import useLocalize from '@hooks/useLocalize';
+import useNetwork from '@hooks/useNetwork';
 import useResponsiveLayout from '@hooks/useResponsiveLayout';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
@@ -71,6 +72,14 @@ function WorkspaceReportFieldsPage({
     const [selectedReportFields, setSelectedReportFields] = useState<PolicyReportField[]>([]);
     const [deleteReportFieldsConfirmModalVisible, setDeleteReportFieldsConfirmModalVisible] = useState(false);
 
+    const fetchReportFields = useCallback(() => {
+        ReportField.openPolicyReportFieldsPage(policyID);
+    }, [policyID]);
+
+    const {isOffline} = useNetwork({onReconnect: fetchReportFields});
+
+    useFocusEffect(fetchReportFields);
+
     useEffect(() => {
         if (isFocused) {
             return;
@@ -131,9 +140,9 @@ function WorkspaceReportFieldsPage({
         setDeleteReportFieldsConfirmModalVisible(false);
     };
 
-    const isLoading = policy === undefined;
+    const isLoading = !isOffline && policy === undefined;
     const shouldShowEmptyState =
-        Object.values(filteredPolicyFieldList).filter((reportField) => reportField.pendingAction !== CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE).length <= 0 && !isLoading;
+        !Object.values(filteredPolicyFieldList).some((reportField) => reportField.pendingAction !== CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE || isOffline) && !isLoading;
     const hasAccountingConnections = PolicyUtils.hasAccountingConnections(policy);
     const isConnectedToAccounting = Object.keys(policy?.connections ?? {}).length > 0;
     const currentConnectionName = PolicyUtils.getCurrentConnectionName(policy);