Fix conditional type in FormikTouched typings

[hpohlmeyer]

I was running into an issue where FormikTouched did not produce the expected typings. Here is an example:

type Lesson = {
  name: string;
  instructors?: Array<{ id: string }> | null;
}

type Result = FormikTouched<Lesson>;

I would have expected that Result is typed like this:

type Result = {
    name?: boolean;
    instructors?: Array<{ id: boolean } | boolean;
}

but the actual Result looks like this:

type Result = {
    name?: boolean;
    instructors?: boolean;
}

The problem is, that conditional types fail to distribute in properties of mapped types. This can be fixed in two ways:

1. Introduce an auxiliary type
2. Infer the value before using it

For this PR I have decided to go with the second solution to avoid adding an auxiliary type.

[vercel]

This pull request is being automatically deployed with ZEIT Now (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://zeit.co/jared/formik-docs/remlmb253
✅ Preview: https://formik-docs-git-fork-hpohlmeyer-fix-conditional-in-fo-19f9d8.jared.now.sh

[hpohlmeyer]

While creating the PR, I’ve also noticed, that FormikTouched changed from

type FormikTouched<Values> = {
    [K in keyof Values]?: Values[K] extends object ? FormikTouched<Values[K]> : boolean;
};

to

export type FormikTouched<Values> = {
  [K in keyof Values]?: Values[K] extends any[]
    ? Values[K][number] extends object // [number] is the special sauce to get the type of array's element. More here https://github.com/Microsoft/TypeScript/pull/21316
      ? FormikTouched<Values[K][number]>[]
      : boolean
    : Values[K] extends object
    ? FormikTouched<Values[K]>
    : boolean;
};

The first one allowed undefined as an array value, the second does not. Is allowing undefined not the intended way to go here? If you only touch the second entry of an array the first value has to be undefined, right? That would not be possible with the second definition.

Should I change this PR to work with the old definition istead?

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 6834009:

Sandbox	Source
Formik TypeScript Playground	Configuration

[hpohlmeyer]

Oh and when I was commiting the changes I’ve got this error:

husky > pre-commit (node v12.13.0)
No input files specified, defaulting to src test

/Users/blackwoodb/dev/react/formik/packages/formik-native/src/index.ts
  1:1  error  Definition for rule '@typescript-eslint/consistent-type-assertions' was not found  @typescript-eslint/consistent-type-assertions
  1:1  error  Definition for rule '@typescript-eslint/no-unused-expressions' was not found       @typescript-eslint/no-unused-expressions

/Users/blackwoodb/dev/react/formik/packages/formik-native/test/blah.test.ts
  1:1  error  Definition for rule '@typescript-eslint/consistent-type-assertions' was not found  @typescript-eslint/consistent-type-assertions
  1:1  error  Definition for rule '@typescript-eslint/no-unused-expressions' was not found       @typescript-eslint/no-unused-expressions

✖ 4 problems (4 errors, 0 warnings)

husky > pre-commit hook failed (add --no-verify to bypass)

I could not find out how to fix it, so I’ve commited with --no-verify. If you have any hints how to fix it, I can do that. It looks like I am not the only one having that problem.