Skip to content

Commit 8783eb4

Browse files
roryabrahamroryabraham
authored
Merge pull request #36532 from software-mansion-labs/ts/improve-form-v2
[TS migration] Follow up on improving the form
2 parents 4c96add + ece3e6d commit 8783eb4

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

45 files changed

+413
-255
lines changed

‎src/ONYXKEYS.ts

Lines changed: 18 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -396,36 +396,35 @@ type AllOnyxKeys = DeepValueOf<typeof ONYXKEYS>;
396396
type OnyxFormValuesMapping = {
397397
[ONYXKEYS.FORMS.ADD_DEBIT_CARD_FORM]: FormTypes.AddDebitCardForm;
398398
[ONYXKEYS.FORMS.WORKSPACE_SETTINGS_FORM]: FormTypes.WorkspaceSettingsForm;
399-
[ONYXKEYS.FORMS.WORKSPACE_DESCRIPTION_FORM]: FormTypes.WorkspaceProfileDescriptionForm;
400399
[ONYXKEYS.FORMS.WORKSPACE_RATE_AND_UNIT_FORM]: FormTypes.WorkspaceRateAndUnitForm;
401400
[ONYXKEYS.FORMS.CLOSE_ACCOUNT_FORM]: FormTypes.CloseAccountForm;
402-
[ONYXKEYS.FORMS.PROFILE_SETTINGS_FORM]: FormTypes.Form;
401+
[ONYXKEYS.FORMS.PROFILE_SETTINGS_FORM]: FormTypes.ProfileSettingsForm;
403402
[ONYXKEYS.FORMS.DISPLAY_NAME_FORM]: FormTypes.DisplayNameForm;
404403
[ONYXKEYS.FORMS.ROOM_NAME_FORM]: FormTypes.RoomNameForm;
405-
[ONYXKEYS.FORMS.REPORT_DESCRIPTION_FORM]: FormTypes.Form;
406-
[ONYXKEYS.FORMS.LEGAL_NAME_FORM]: FormTypes.Form;
407-
[ONYXKEYS.FORMS.WORKSPACE_INVITE_MESSAGE_FORM]: FormTypes.Form;
404+
[ONYXKEYS.FORMS.REPORT_DESCRIPTION_FORM]: FormTypes.ReportDescriptionForm;
405+
[ONYXKEYS.FORMS.LEGAL_NAME_FORM]: FormTypes.LegalNameForm;
406+
[ONYXKEYS.FORMS.WORKSPACE_INVITE_MESSAGE_FORM]: FormTypes.WorkspaceInviteMessageForm;
408407
[ONYXKEYS.FORMS.DATE_OF_BIRTH_FORM]: FormTypes.DateOfBirthForm;
409-
[ONYXKEYS.FORMS.HOME_ADDRESS_FORM]: FormTypes.Form;
408+
[ONYXKEYS.FORMS.HOME_ADDRESS_FORM]: FormTypes.HomeAddressForm;
410409
[ONYXKEYS.FORMS.NEW_ROOM_FORM]: FormTypes.NewRoomForm;
411-
[ONYXKEYS.FORMS.ROOM_SETTINGS_FORM]: FormTypes.Form;
412-
[ONYXKEYS.FORMS.NEW_TASK_FORM]: FormTypes.Form;
413-
[ONYXKEYS.FORMS.EDIT_TASK_FORM]: FormTypes.Form;
414-
[ONYXKEYS.FORMS.MONEY_REQUEST_DESCRIPTION_FORM]: FormTypes.Form;
415-
[ONYXKEYS.FORMS.MONEY_REQUEST_MERCHANT_FORM]: FormTypes.Form;
416-
[ONYXKEYS.FORMS.MONEY_REQUEST_AMOUNT_FORM]: FormTypes.Form;
417-
[ONYXKEYS.FORMS.MONEY_REQUEST_DATE_FORM]: FormTypes.Form;
410+
[ONYXKEYS.FORMS.ROOM_SETTINGS_FORM]: FormTypes.RoomSettingsForm;
411+
[ONYXKEYS.FORMS.NEW_TASK_FORM]: FormTypes.NewTaskForm;
412+
[ONYXKEYS.FORMS.EDIT_TASK_FORM]: FormTypes.EditTaskForm;
413+
[ONYXKEYS.FORMS.MONEY_REQUEST_DESCRIPTION_FORM]: FormTypes.MoneyRequestDescriptionForm;
414+
[ONYXKEYS.FORMS.MONEY_REQUEST_MERCHANT_FORM]: FormTypes.MoneyRequestMerchantForm;
415+
[ONYXKEYS.FORMS.MONEY_REQUEST_AMOUNT_FORM]: FormTypes.MoneyRequestAmountForm;
416+
[ONYXKEYS.FORMS.MONEY_REQUEST_DATE_FORM]: FormTypes.MoneyRequestDateForm;
418417
[ONYXKEYS.FORMS.MONEY_REQUEST_HOLD_FORM]: FormTypes.MoneyRequestHoldReasonForm;
419418
[ONYXKEYS.FORMS.NEW_CONTACT_METHOD_FORM]: FormTypes.NewContactMethodForm;
420-
[ONYXKEYS.FORMS.WAYPOINT_FORM]: FormTypes.Form;
421-
[ONYXKEYS.FORMS.SETTINGS_STATUS_SET_FORM]: FormTypes.Form;
422-
[ONYXKEYS.FORMS.SETTINGS_STATUS_CLEAR_DATE_FORM]: FormTypes.Form;
423-
[ONYXKEYS.FORMS.SETTINGS_STATUS_SET_CLEAR_AFTER_FORM]: FormTypes.Form;
419+
[ONYXKEYS.FORMS.WAYPOINT_FORM]: FormTypes.WaypointForm;
420+
[ONYXKEYS.FORMS.SETTINGS_STATUS_SET_FORM]: FormTypes.SettingsStatusSetForm;
421+
[ONYXKEYS.FORMS.SETTINGS_STATUS_CLEAR_DATE_FORM]: FormTypes.SettingsStatusClearDateForm;
422+
[ONYXKEYS.FORMS.SETTINGS_STATUS_SET_CLEAR_AFTER_FORM]: FormTypes.SettingsStatusSetClearAfterForm;
424423
[ONYXKEYS.FORMS.PRIVATE_NOTES_FORM]: FormTypes.PrivateNotesForm;
425424
[ONYXKEYS.FORMS.I_KNOW_A_TEACHER_FORM]: FormTypes.IKnowTeacherForm;
426425
[ONYXKEYS.FORMS.INTRO_SCHOOL_PRINCIPAL_FORM]: FormTypes.IntroSchoolPrincipalForm;
427-
[ONYXKEYS.FORMS.REPORT_VIRTUAL_CARD_FRAUD]: FormTypes.Form;
428-
[ONYXKEYS.FORMS.REPORT_PHYSICAL_CARD_FORM]: FormTypes.Form;
426+
[ONYXKEYS.FORMS.REPORT_VIRTUAL_CARD_FRAUD]: FormTypes.ReportVirtualCardFraudForm;
427+
[ONYXKEYS.FORMS.REPORT_PHYSICAL_CARD_FORM]: FormTypes.ReportPhysicalCardForm;
429428
[ONYXKEYS.FORMS.GET_PHYSICAL_CARD_FORM]: FormTypes.GetPhysicalCardForm;
430429
[ONYXKEYS.FORMS.REPORT_FIELD_EDIT_FORM]: FormTypes.ReportFieldEditForm;
431430
[ONYXKEYS.FORMS.REIMBURSEMENT_ACCOUNT_FORM]: FormTypes.ReimbursementAccountForm;

‎src/libs/API/parameters/UpdateBeneficialOwnersForBankAccountParams.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import type {BeneficialOwnersStepProps} from '@src/types/form/ReimbursementAccountForm';
1+
import type {ACHContractStepProps} from '@src/types/form/ReimbursementAccountForm';
22

3-
type UpdateBeneficialOwnersForBankAccountParams = BeneficialOwnersStepProps & {bankAccountID: number; policyID: string; canUseNewVbbaFlow?: boolean};
3+
type UpdateBeneficialOwnersForBankAccountParams = Partial<ACHContractStepProps> & {bankAccountID: number; policyID: string; canUseNewVbbaFlow?: boolean};
44

55
export default UpdateBeneficialOwnersForBankAccountParams;

‎src/libs/API/parameters/UpdateCompanyInformationForBankAccountParams.ts

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
1-
import type {CompanyStepProps} from '@src/types/form/ReimbursementAccountForm';
1+
import type {BankAccountStepProps, CompanyStepProps, ReimbursementAccountProps} from '@src/types/form/ReimbursementAccountForm';
22

3-
type UpdateCompanyInformationForBankAccountParams = CompanyStepProps & {bankAccountID: number; policyID: string; canUseNewVbbaFlow?: boolean};
3+
type BankAccountCompanyInformation = BankAccountStepProps & CompanyStepProps & ReimbursementAccountProps;
4+
5+
type UpdateCompanyInformationForBankAccountParams = Partial<BankAccountCompanyInformation> & {bankAccountID: number; policyID: string; canUseNewVbbaFlow?: boolean};
46

57
export default UpdateCompanyInformationForBankAccountParams;

‎src/libs/FormUtils.ts

Lines changed: 0 additions & 7 deletions
This file was deleted.

‎src/libs/GetPhysicalCardUtils.ts

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,11 @@ function setCurrentRoute(currentRoute: string, domain: string, privatePersonalDe
5454
* @param privatePersonalDetails
5555
* @returns
5656
*/
57-
function getUpdatedDraftValues(draftValues: OnyxEntry<GetPhysicalCardForm>, privatePersonalDetails: OnyxEntry<PrivatePersonalDetails>, loginList: OnyxEntry<LoginList>): GetPhysicalCardForm {
57+
function getUpdatedDraftValues(
58+
draftValues: OnyxEntry<GetPhysicalCardForm>,
59+
privatePersonalDetails: OnyxEntry<PrivatePersonalDetails>,
60+
loginList: OnyxEntry<LoginList>,
61+
): Partial<GetPhysicalCardForm> {
5862
const {address, legalFirstName, legalLastName, phoneNumber} = privatePersonalDetails ?? {};
5963

6064
return {

‎src/libs/ValidationUtils.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import isDate from 'lodash/isDate';
55
import isEmpty from 'lodash/isEmpty';
66
import isObject from 'lodash/isObject';
77
import type {OnyxCollection} from 'react-native-onyx';
8-
import type {FormInputErrors, FormOnyxKeys, FormOnyxValues} from '@components/Form/types';
8+
import type {FormInputErrors, FormOnyxKeys, FormOnyxValues, FormValue} from '@components/Form/types';
99
import CONST from '@src/CONST';
1010
import type {OnyxFormKey} from '@src/ONYXKEYS';
1111
import type {Report} from '@src/types/onyx';
@@ -77,7 +77,7 @@ function isValidPastDate(date: string | Date): boolean {
7777
* Used to validate a value that is "required".
7878
* @param value - field value
7979
*/
80-
function isRequiredFulfilled(value?: string | boolean | Date): boolean {
80+
function isRequiredFulfilled(value?: FormValue): boolean {
8181
if (!value) {
8282
return false;
8383
}
@@ -103,7 +103,7 @@ function getFieldRequiredErrors<TFormID extends OnyxFormKey>(values: FormOnyxVal
103103
const errors: FormInputErrors<TFormID> = {};
104104

105105
requiredFields.forEach((fieldKey) => {
106-
if (isRequiredFulfilled(values[fieldKey] as keyof FormOnyxValues)) {
106+
if (isRequiredFulfilled(values[fieldKey] as FormValue)) {
107107
return;
108108
}
109109

‎src/libs/actions/BankAccounts.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -366,7 +366,7 @@ function openReimbursementAccountPage(stepToOpen: ReimbursementAccountStep, subS
366366
* Updates the bank account in the database with the company step data
367367
* @param params - Business step form data
368368
*/
369-
function updateCompanyInformationForBankAccount(bankAccountID: number, params: CompanyStepProps, policyID: string) {
369+
function updateCompanyInformationForBankAccount(bankAccountID: number, params: Partial<CompanyStepProps>, policyID: string) {
370370
API.write(
371371
WRITE_COMMANDS.UPDATE_COMPANY_INFORMATION_FOR_BANK_ACCOUNT,
372372
{
@@ -383,7 +383,7 @@ function updateCompanyInformationForBankAccount(bankAccountID: number, params: C
383383
* Add beneficial owners for the bank account and verify the accuracy of the information provided
384384
* @param params - Beneficial Owners step form params
385385
*/
386-
function updateBeneficialOwnersForBankAccount(bankAccountID: number, params: BeneficialOwnersStepProps, policyID: string) {
386+
function updateBeneficialOwnersForBankAccount(bankAccountID: number, params: Partial<BeneficialOwnersStepProps>, policyID: string) {
387387
API.write(
388388
WRITE_COMMANDS.UPDATE_BENEFICIAL_OWNERS_FOR_BANK_ACCOUNT,
389389
{

‎src/libs/actions/FormActions.ts

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import Onyx from 'react-native-onyx';
22
import type {NullishDeep} from 'react-native-onyx';
3-
import FormUtils from '@libs/FormUtils';
43
import type {OnyxFormDraftKey, OnyxFormKey, OnyxValue} from '@src/ONYXKEYS';
54
import type * as OnyxCommon from '@src/types/onyx/OnyxCommon';
65

@@ -25,11 +24,11 @@ function clearErrorFields(formID: OnyxFormKey) {
2524
}
2625

2726
function setDraftValues(formID: OnyxFormKey, draftValues: NullishDeep<OnyxValue<OnyxFormDraftKey>>) {
28-
Onyx.merge(FormUtils.getDraftKey(formID), draftValues);
27+
Onyx.merge(`${formID}Draft`, draftValues);
2928
}
3029

3130
function clearDraftValues(formID: OnyxFormKey) {
32-
Onyx.set(FormUtils.getDraftKey(formID), null);
31+
Onyx.set(`${formID}Draft`, null);
3332
}
3433

3534
export {setDraftValues, setErrorFields, setErrors, clearErrors, clearErrorFields, setIsLoading, clearDraftValues};

‎src/libs/actions/PaymentMethods.ts

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ import CONST from '@src/CONST';
1212
import ONYXKEYS from '@src/ONYXKEYS';
1313
import ROUTES from '@src/ROUTES';
1414
import type {Route} from '@src/ROUTES';
15+
import INPUT_IDS from '@src/types/form/AddDebitCardForm';
1516
import type {BankAccountList, FundList} from '@src/types/onyx';
1617
import type {PaymentMethodType} from '@src/types/onyx/OriginalMessage';
1718
import type PaymentMethod from '@src/types/onyx/PaymentMethod';
@@ -205,7 +206,15 @@ function clearDebitCardFormErrorAndSubmit() {
205206
Onyx.set(ONYXKEYS.FORMS.ADD_DEBIT_CARD_FORM, {
206207
isLoading: false,
207208
errors: undefined,
208-
setupComplete: false,
209+
[INPUT_IDS.SETUP_COMPLETE]: false,
210+
[INPUT_IDS.NAME_ON_CARD]: '',
211+
[INPUT_IDS.CARD_NUMBER]: '',
212+
[INPUT_IDS.EXPIRATION_DATE]: '',
213+
[INPUT_IDS.SECURITY_CODE]: '',
214+
[INPUT_IDS.ADDRESS_STREET]: '',
215+
[INPUT_IDS.ADDRESS_ZIP_CODE]: '',
216+
[INPUT_IDS.ADDRESS_STATE]: '',
217+
[INPUT_IDS.ACCEPT_TERMS]: '',
209218
});
210219
}
211220

‎src/libs/actions/Report.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,7 @@ import CONST from '@src/CONST';
6767
import ONYXKEYS from '@src/ONYXKEYS';
6868
import type {Route} from '@src/ROUTES';
6969
import ROUTES from '@src/ROUTES';
70+
import INPUT_IDS from '@src/types/form/NewRoomForm';
7071
import type {PersonalDetails, PersonalDetailsList, PolicyReportField, RecentlyUsedReportFields, ReportActionReactions, ReportMetadata, ReportUserIsTyping} from '@src/types/onyx';
7172
import type {Decision, OriginalMessageIOU} from '@src/types/onyx/OriginalMessage';
7273
import type {NotificationPreference, RoomVisibility, WriteCapability} from '@src/types/onyx/Report';
@@ -2841,6 +2842,11 @@ function clearNewRoomFormError() {
28412842
isLoading: false,
28422843
errorFields: null,
28432844
errors: null,
2845+
[INPUT_IDS.ROOM_NAME]: '',
2846+
[INPUT_IDS.REPORT_DESCRIPTION]: '',
2847+
[INPUT_IDS.POLICY_ID]: '',
2848+
[INPUT_IDS.WRITE_CAPABILITY]: '',
2849+
[INPUT_IDS.VISIBILITY]: '',
28442850
});
28452851
}
28462852

‎src/pages/iou/request/step/IOURequestStepDate.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ import * as IOU from '@userActions/IOU';
1919
import CONST from '@src/CONST';
2020
import ONYXKEYS from '@src/ONYXKEYS';
2121
import {policyPropTypes} from '@src/pages/workspace/withPolicy';
22-
import INPUT_IDS from '@src/types/form/MoneyRequestCreatedForm';
22+
import INPUT_IDS from '@src/types/form/MoneyRequestDateForm';
2323
import IOURequestStepRoutePropTypes from './IOURequestStepRoutePropTypes';
2424
import StepScreenWrapper from './StepScreenWrapper';
2525
import withFullTransactionOrNotFound from './withFullTransactionOrNotFound';

‎src/pages/settings/Wallet/ExpensifyCardPage.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,6 @@ import useThemeStyles from '@hooks/useThemeStyles';
1717
import * as FormActions from '@libs/actions/FormActions';
1818
import * as CardUtils from '@libs/CardUtils';
1919
import * as CurrencyUtils from '@libs/CurrencyUtils';
20-
import FormUtils from '@libs/FormUtils';
2120
import * as GetPhysicalCardUtils from '@libs/GetPhysicalCardUtils';
2221
import {translatableTextPropTypes} from '@libs/Localize';
2322
import Navigation from '@libs/Navigation/Navigation';
@@ -310,6 +309,6 @@ export default withOnyx({
310309
key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS,
311310
},
312311
draftValues: {
313-
key: FormUtils.getDraftKey(ONYXKEYS.FORMS.GET_PHYSICAL_CARD_FORM),
312+
key: ONYXKEYS.FORMS.GET_PHYSICAL_CARD_FORM_DRAFT,
314313
},
315314
})(ExpensifyCardPage);

‎src/types/form/AddDebitCardForm.ts

Lines changed: 17 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import type {ValueOf} from 'type-fest';
12
import type Form from './Form';
23

34
const INPUT_IDS = {
@@ -12,19 +13,23 @@ const INPUT_IDS = {
1213
ACCEPT_TERMS: 'acceptTerms',
1314
} as const;
1415

15-
type AddDebitCardForm = Form<{
16-
/** Whether the form has been submitted */
17-
[INPUT_IDS.SETUP_COMPLETE]: boolean;
16+
type InputID = ValueOf<typeof INPUT_IDS>;
1817

19-
[INPUT_IDS.NAME_ON_CARD]?: string;
20-
[INPUT_IDS.CARD_NUMBER]?: string;
21-
[INPUT_IDS.EXPIRATION_DATE]?: string;
22-
[INPUT_IDS.SECURITY_CODE]?: string;
23-
[INPUT_IDS.ADDRESS_STREET]?: string;
24-
[INPUT_IDS.ADDRESS_ZIP_CODE]?: string;
25-
[INPUT_IDS.ADDRESS_STATE]?: string;
26-
[INPUT_IDS.ACCEPT_TERMS]?: string;
27-
}>;
18+
type AddDebitCardForm = Form<
19+
InputID,
20+
{
21+
/** Whether the form has been submitted */
22+
[INPUT_IDS.SETUP_COMPLETE]: boolean;
23+
[INPUT_IDS.NAME_ON_CARD]: string;
24+
[INPUT_IDS.CARD_NUMBER]: string;
25+
[INPUT_IDS.EXPIRATION_DATE]: string;
26+
[INPUT_IDS.SECURITY_CODE]: string;
27+
[INPUT_IDS.ADDRESS_STREET]: string;
28+
[INPUT_IDS.ADDRESS_ZIP_CODE]: string;
29+
[INPUT_IDS.ADDRESS_STATE]: string;
30+
[INPUT_IDS.ACCEPT_TERMS]: string;
31+
}
32+
>;
2833

2934
export type {AddDebitCardForm};
3035
export default INPUT_IDS;

‎src/types/form/CloseAccountForm.ts

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import type {ValueOf} from 'type-fest';
12
import type Form from './Form';
23

34
const INPUT_IDS = {
@@ -6,11 +7,16 @@ const INPUT_IDS = {
67
SUCCESS: 'success',
78
} as const;
89

9-
type CloseAccountForm = Form<{
10-
[INPUT_IDS.REASON_FOR_LEAVING]: string;
11-
[INPUT_IDS.PHONE_OR_EMAIL]: string;
12-
[INPUT_IDS.SUCCESS]: string;
13-
}>;
10+
type InputID = ValueOf<typeof INPUT_IDS>;
11+
12+
type CloseAccountForm = Form<
13+
InputID,
14+
{
15+
[INPUT_IDS.REASON_FOR_LEAVING]: string;
16+
[INPUT_IDS.PHONE_OR_EMAIL]: string;
17+
[INPUT_IDS.SUCCESS]: string;
18+
}
19+
>;
1420

1521
export type {CloseAccountForm};
1622
export default INPUT_IDS;

‎src/types/form/DateOfBirthForm.ts

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,19 @@
1+
import type {ValueOf} from 'type-fest';
12
import type Form from './Form';
23

34
const INPUT_IDS = {
45
DOB: 'dob',
56
} as const;
67

7-
type DateOfBirthForm = Form<{
8-
/** Date of birth */
9-
[INPUT_IDS.DOB]: string;
10-
}>;
8+
type InputID = ValueOf<typeof INPUT_IDS>;
9+
10+
type DateOfBirthForm = Form<
11+
InputID,
12+
{
13+
/** Date of birth */
14+
[INPUT_IDS.DOB]: string;
15+
}
16+
>;
1117

1218
export type {DateOfBirthForm};
1319
export default INPUT_IDS;

‎src/types/form/DisplayNameForm.ts

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,20 @@
1+
import type {ValueOf} from 'type-fest';
12
import type Form from './Form';
23

34
const INPUT_IDS = {
45
FIRST_NAME: 'firstName',
56
LAST_NAME: 'lastName',
67
} as const;
78

8-
type DisplayNameForm = Form<{
9-
[INPUT_IDS.FIRST_NAME]: string;
10-
[INPUT_IDS.LAST_NAME]: string;
11-
}>;
9+
type InputID = ValueOf<typeof INPUT_IDS>;
10+
11+
type DisplayNameForm = Form<
12+
InputID,
13+
{
14+
[INPUT_IDS.FIRST_NAME]: string;
15+
[INPUT_IDS.LAST_NAME]: string;
16+
}
17+
>;
1218

1319
export type {DisplayNameForm};
1420
export default INPUT_IDS;

‎src/types/form/EditTaskForm.ts

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,20 @@
1+
import type {ValueOf} from 'type-fest';
12
import type Form from './Form';
23

34
const INPUT_IDS = {
45
TITLE: 'title',
56
DESCRIPTION: 'description',
67
} as const;
78

8-
type EditTaskForm = Form<{
9-
[INPUT_IDS.TITLE]: string;
10-
[INPUT_IDS.DESCRIPTION]: string;
11-
}>;
9+
type InputID = ValueOf<typeof INPUT_IDS>;
10+
11+
type EditTaskForm = Form<
12+
InputID,
13+
{
14+
[INPUT_IDS.TITLE]: string;
15+
[INPUT_IDS.DESCRIPTION]: string;
16+
}
17+
>;
1218

1319
export type {EditTaskForm};
1420
export default INPUT_IDS;

‎src/types/form/Form.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,8 @@ type BaseForm = {
1212
errorFields?: OnyxCommon.ErrorFields | null;
1313
};
1414

15-
type FormValues = Record<string, FormValue>;
16-
type Form<TFormValues extends FormValues = FormValues> = TFormValues & BaseForm;
15+
type FormValues<TInputs extends string> = Record<TInputs, FormValue>;
16+
type Form<TInputs extends string = string, TFormValues extends FormValues<TInputs> = FormValues<TInputs>> = TFormValues & BaseForm;
1717

1818
export default Form;
1919
export type {BaseForm};

0 commit comments

Comments
 (0)