refactor rulesCustomNameForm to align with the current implementation

Author: ChavdaSachin

src/ONYXKEYS.ts

@@ -823,8 +823,8 @@ const ONYXKEYS = {
         SEARCH_SAVED_SEARCH_RENAME_FORM_DRAFT: 'searchSavedSearchRenameFormDraft',
         TEXT_PICKER_MODAL_FORM: 'textPickerModalForm',
         TEXT_PICKER_MODAL_FORM_DRAFT: 'textPickerModalFormDraft',
-        RULES_CUSTOM_NAME_MODAL_FORM: 'rulesCustomNameModalForm',
-        RULES_CUSTOM_NAME_MODAL_FORM_DRAFT: 'rulesCustomNameModalFormDraft',
+        REPORTS_DEFAULT_TITLE_MODAL_FORM: 'ReportsDefaultTitleModalForm',
+        REPORTS_DEFAULT_TITLE_MODAL_FORM_DRAFT: 'ReportsDefaultTitleModalFormDraft',
         RULES_AUTO_APPROVE_REPORTS_UNDER_MODAL_FORM: 'rulesAutoApproveReportsUnderModalForm',
         RULES_AUTO_APPROVE_REPORTS_UNDER_MODAL_FORM_DRAFT: 'rulesAutoApproveReportsUnderModalFormDraft',
         RULES_RANDOM_REPORT_AUDIT_MODAL_FORM: 'rulesRandomReportAuditModalForm',
@@ -942,7 +942,7 @@ type OnyxFormValuesMapping = {
     [ONYXKEYS.FORMS.SAGE_INTACCT_DIMENSION_TYPE_FORM]: FormTypes.SageIntacctDimensionForm;
     [ONYXKEYS.FORMS.SEARCH_ADVANCED_FILTERS_FORM]: FormTypes.SearchAdvancedFiltersForm;
     [ONYXKEYS.FORMS.TEXT_PICKER_MODAL_FORM]: FormTypes.TextPickerModalForm;
-    [ONYXKEYS.FORMS.RULES_CUSTOM_NAME_MODAL_FORM]: FormTypes.RulesCustomNameModalForm;
+    [ONYXKEYS.FORMS.REPORTS_DEFAULT_TITLE_MODAL_FORM]: FormTypes.ReportsDefaultTitleModalForm;
     [ONYXKEYS.FORMS.RULES_AUTO_APPROVE_REPORTS_UNDER_MODAL_FORM]: FormTypes.RulesAutoApproveReportsUnderModalForm;
     [ONYXKEYS.FORMS.RULES_RANDOM_REPORT_AUDIT_MODAL_FORM]: FormTypes.RulesRandomReportAuditModalForm;
     [ONYXKEYS.FORMS.RULES_AUTO_PAY_REPORTS_UNDER_MODAL_FORM]: FormTypes.RulesAutoPayReportsUnderModalForm;

src/pages/workspace/reports/ReportsDefaultTitle.tsx

@@ -25,11 +25,11 @@ import {clearPolicyTitleFieldError, setPolicyDefaultReportTitle} from '@userActi
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import type SCREENS from '@src/SCREENS';
-import INPUT_IDS from '@src/types/form/RulesCustomNameModalForm';
+import INPUT_IDS from '@src/types/form/ReportsDefaultTitleModalForm';
 
 type RulesCustomNamePageProps = PlatformStackScreenProps<SettingsNavigatorParamList, typeof SCREENS.WORKSPACE.REPORTS_DEFAULT_TITLE>;
 
-function RulesCustomNamePage({route}: RulesCustomNamePageProps) {
+function ReportsDefaultTitlePage({route}: RulesCustomNamePageProps) {
     const policyID = route.params.policyID;
     const policy = usePolicy(policyID);
 
@@ -48,13 +48,13 @@ function RulesCustomNamePage({route}: RulesCustomNamePageProps) {
     const customNameDefaultValue = Str.htmlDecode(fieldListItem?.defaultValue ?? '');
 
     const validateCustomName = useCallback(
-        ({customName}: FormOnyxValues<typeof ONYXKEYS.FORMS.RULES_CUSTOM_NAME_MODAL_FORM>) => {
-            const errors: FormInputErrors<typeof ONYXKEYS.FORMS.RULES_CUSTOM_NAME_MODAL_FORM> = {};
-            if (!customName) {
-                errors[INPUT_IDS.CUSTOM_NAME] = translate('common.error.fieldRequired');
-            } else if (customName.length > CONST.WORKSPACE_NAME_CHARACTER_LIMIT) {
-                errors[INPUT_IDS.CUSTOM_NAME] = translate('common.error.characterLimitExceedCounter', {
-                    length: customName.length,
+        ({defaultTitle}: FormOnyxValues<typeof ONYXKEYS.FORMS.REPORTS_DEFAULT_TITLE_MODAL_FORM>) => {
+            const errors: FormInputErrors<typeof ONYXKEYS.FORMS.REPORTS_DEFAULT_TITLE_MODAL_FORM> = {};
+            if (!defaultTitle) {
+                errors[INPUT_IDS.DEFAULT_TITLE] = translate('common.error.fieldRequired');
+            } else if (defaultTitle.length > CONST.WORKSPACE_NAME_CHARACTER_LIMIT) {
+                errors[INPUT_IDS.DEFAULT_TITLE] = translate('common.error.characterLimitExceedCounter', {
+                    length: defaultTitle.length,
                     limit: CONST.WORKSPACE_NAME_CHARACTER_LIMIT,
                 });
             }
@@ -75,8 +75,8 @@ function RulesCustomNamePage({route}: RulesCustomNamePageProps) {
         clearTitleFieldError();
     });
 
-    const submitForm = (values: FormOnyxValues<typeof ONYXKEYS.FORMS.RULES_CUSTOM_NAME_MODAL_FORM>) => {
-        setPolicyDefaultReportTitle(policyID, values.customName);
+    const submitForm = (values: FormOnyxValues<typeof ONYXKEYS.FORMS.REPORTS_DEFAULT_TITLE_MODAL_FORM>) => {
+        setPolicyDefaultReportTitle(policyID, values.defaultTitle);
         Navigation.goBack();
     };
 
@@ -91,7 +91,7 @@ function RulesCustomNamePage({route}: RulesCustomNamePageProps) {
             <ScreenWrapper
                 enableEdgeToEdgeBottomSafeAreaPadding
                 shouldEnableMaxHeight
-                testID={RulesCustomNamePage.displayName}
+                testID={ReportsDefaultTitlePage.displayName}
             >
                 <HeaderWithBackButton
                     title={translate('workspace.rules.expenseReportRules.customNameTitle')}
@@ -111,7 +111,7 @@ function RulesCustomNamePage({route}: RulesCustomNamePageProps) {
                 </View>
                 <FormProvider
                     style={[styles.flexGrow1, styles.mh5]}
-                    formID={ONYXKEYS.FORMS.RULES_CUSTOM_NAME_MODAL_FORM}
+                    formID={ONYXKEYS.FORMS.REPORTS_DEFAULT_TITLE_MODAL_FORM}
                     validate={validateCustomName}
                     onSubmit={submitForm}
                     submitButtonText={translate('common.save')}
@@ -128,7 +128,7 @@ function RulesCustomNamePage({route}: RulesCustomNamePageProps) {
                     >
                         <InputWrapper
                             InputComponent={TextInput}
-                            inputID={INPUT_IDS.CUSTOM_NAME}
+                            inputID={INPUT_IDS.DEFAULT_TITLE}
                             defaultValue={customNameDefaultValue}
                             label={translate('workspace.rules.expenseReportRules.customNameInputLabel')}
                             aria-label={translate('workspace.rules.expenseReportRules.customNameInputLabel')}
@@ -145,6 +145,6 @@ function RulesCustomNamePage({route}: RulesCustomNamePageProps) {
     );
 }
 
-RulesCustomNamePage.displayName = 'RulesCustomNamePage';
+ReportsDefaultTitlePage.displayName = 'ReportsDefaultTitlePage';
 
-export default RulesCustomNamePage;
+export default ReportsDefaultTitlePage;

src/types/form/ReportsDefaultTitleModalForm.ts

@@ -2,17 +2,17 @@ import type {ValueOf} from 'type-fest';
 import type Form from './Form';
 
 const INPUT_IDS = {
-    CUSTOM_NAME: 'customName',
+    DEFAULT_TITLE: 'defaultTitle',
 } as const;
 
 type InputID = ValueOf<typeof INPUT_IDS>;
 
-type RulesCustomNameModalForm = Form<
+type ReportsDefaultTitleModalForm = Form<
     InputID,
     {
-        [INPUT_IDS.CUSTOM_NAME]: string;
+        [INPUT_IDS.DEFAULT_TITLE]: string;
     }
 >;
 
-export type {RulesCustomNameModalForm};
+export type {ReportsDefaultTitleModalForm};
 export default INPUT_IDS;

src/types/form/index.ts

@@ -74,7 +74,7 @@ export type {SearchAdvancedFiltersForm} from './SearchAdvancedFiltersForm';
 export type {EditExpensifyCardLimitForm} from './EditExpensifyCardLimitForm';
 export type {default as TextPickerModalForm} from './TextPickerModalForm';
 export type {default as Form} from './Form';
-export type {RulesCustomNameModalForm} from './RulesCustomNameModalForm';
+export type {ReportsDefaultTitleModalForm} from './ReportsDefaultTitleModalForm';
 export type {RulesAutoApproveReportsUnderModalForm} from './RulesAutoApproveReportsUnderModalForm';
 export type {RulesRandomReportAuditModalForm} from './RulesRandomReportAuditModalForm';
 export type {RulesAutoPayReportsUnderModalForm} from './RulesAutoPayReportsUnderModalForm';