integrate add new report field

rezkiy37 · Jun 24, 2024 · 5b33862 · 5b33862
1 parent 75ab729
commit 5b33862
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 13 deletions.
diff --git a/src/components/Form/types.ts b/src/components/Form/types.ts
@@ -19,10 +19,11 @@ import type TextInput from '@components/TextInput';
 import type TextPicker from '@components/TextPicker';
 import type ValuePicker from '@components/ValuePicker';
 import type BusinessTypePicker from '@pages/ReimbursementAccount/BusinessInfo/substeps/TypeBusiness/BusinessTypePicker';
+import type ListValuesSelector from '@pages/workspace/reportFields/ListValuesSelector';
 import type {Country} from '@src/CONST';
 import type {OnyxFormKey, OnyxValues} from '@src/ONYXKEYS';
 import type {BaseForm} from '@src/types/form/Form';
-import type {ReportFieldListValue} from '@src/types/form/WorkspaceReportFieldsForm';
+import type {ReportFieldListValues} from '@src/types/form/WorkspaceReportFieldsForm';
 
 /**
  * This type specifies all the inputs that can be used with `InputWrapper` component. Make sure to update it
@@ -46,15 +47,16 @@ type ValidInputs =
     | typeof AmountPicker
     | typeof TextPicker
     | typeof AddPlaidBankAccount
-    | typeof EmojiPickerButtonDropdown;
+    | typeof EmojiPickerButtonDropdown
+    | typeof ListValuesSelector;
 
 type ValueTypeKey = 'string' | 'boolean' | 'date' | 'country';
 type ValueTypeMap = {
     string: string;
     boolean: boolean;
     date: Date;
     country: Country | '';
-    reportFields: Record<string, ReportFieldListValue>;
+    reportFields: ReportFieldListValues;
 };
 type FormValue = ValueOf<ValueTypeMap>;
 

diff --git a/src/pages/workspace/reportFields/CreatePolicyReportFieldPage.tsx b/src/pages/workspace/reportFields/CreatePolicyReportFieldPage.tsx
@@ -21,6 +21,7 @@ import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import type SCREENS from '@src/SCREENS';
 import INPUT_IDS from '@src/types/form/WorkspaceReportFieldsForm';
+import ListValuesSelector from './ListValuesSelector';
 import TypeSelector from './TypeSelector';
 
 type CreatePolicyReportFieldPageProps = WithPolicyAndFullscreenLoadingProps & StackScreenProps<SettingsNavigatorParamList, typeof SCREENS.WORKSPACE.REPORT_FIELDS_CREATE>;
@@ -40,6 +41,7 @@ function CreatePolicyReportFieldPage({
     const submitForm = useCallback(({name, type, initialValue}: FormOnyxValues<typeof ONYXKEYS.FORMS.WORKSPACE_REPORT_FIELDS_FORM>) => {
         // eslint-disable-next-line no-console
         console.log('submitForm', name, type, initialValue);
+
         Navigation.goBack();
     }, []);
 
@@ -132,14 +134,10 @@ function CreatePolicyReportFieldPage({
 
                             {inputValues[INPUT_IDS.TYPE] === CONST.REPORT_FIELD_TYPES.LIST && (
                                 <InputWrapper
-                                    InputComponent={TextPicker}
-                                    inputID={INPUT_IDS.INITIAL_VALUE}
-                                    label={translate('common.initialValue')}
-                                    description={translate('common.initialValue')}
-                                    accessibilityLabel={translate('workspace.editor.initialValueInputLabel')}
-                                    maxLength={CONST.WORKSPACE_REPORT_FIELD_POLICY_MAX_LENGTH}
-                                    multiline={false}
-                                    role={CONST.ROLE.PRESENTATION}
+                                    InputComponent={ListValuesSelector}
+                                    inputID={INPUT_IDS.LIST_VALUES}
+                                    subtitle={translate('workspace.reportFields.listInputSubtitle')}
+                                    label={translate('common.listValues')}
                                 />
                             )}
                         </View>

diff --git a/src/types/form/WorkspaceReportFieldsForm.ts b/src/types/form/WorkspaceReportFieldsForm.ts
@@ -11,16 +11,17 @@ const INPUT_IDS = {
 
 type InputID = ValueOf<typeof INPUT_IDS>;
 type ReportFieldListValue = {name: string; disabled: boolean};
+type ReportFieldListValues = Record<string, ReportFieldListValue>;
 
 type WorkspaceReportFieldsForm = Form<
     InputID,
     {
         [INPUT_IDS.NAME]: string;
         [INPUT_IDS.TYPE]: PolicyReportFieldType;
         [INPUT_IDS.INITIAL_VALUE]: string;
-        [INPUT_IDS.LIST_VALUES]: Record<string, ReportFieldListValue>;
+        [INPUT_IDS.LIST_VALUES]: ReportFieldListValues;
     }
 >;
 
-export type {WorkspaceReportFieldsForm, ReportFieldListValue};
+export type {WorkspaceReportFieldsForm, ReportFieldListValue, ReportFieldListValues};
 export default INPUT_IDS;