types: Align FormikHelpers and FieldHelper types to useFormik ones #3843

bonimba · 2023-07-04T16:56:54Z

This is yet another PR around TypeScript.

The inferred types for the helpers in useFormik are the correct ones and should be used everywhere.
See

export declare function useFormik<Values extends FormikValues = FormikValues>({ validateOnChange, validateOnBlur, validateOnMount, isInitialValid, enableReinitialize, onSubmit, ...rest }: FormikConfig<Values>): {
   
   [...redacted for readability...]
   
    setFieldTouched: (field: string, touched?: boolean, shouldValidate?: boolean) => Promise<FormikErrors<Values>> | Promise<void>;
    setFieldValue: (field: string, value: any, shouldValidate?: boolean) => Promise<FormikErrors<Values>> | Promise<void>;
    setFieldError: (field: string, value: string | undefined) => void;
    setStatus: (status: any) => void;
    setSubmitting: (isSubmitting: boolean) => void;
    setTouched: (touched: FormikTouched<Values>, shouldValidate?: boolean) => Promise<FormikErrors<Values>> | Promise<void>;
    setValues: (values: React.SetStateAction<Values>, shouldValidate?: boolean) => Promise<FormikErrors<Values>> | Promise<void>;
    submitForm: () => Promise<any>;
    validateForm: (values?: Values) => Promise<FormikErrors<Values>>;
    validateField: (name: string) => Promise<void> | Promise<string | undefined>;
    
    [...redacted for readability...]
};

Having the correct types, and the awaiting these helpers helps with otherwise possible race conditions when used in an imperative way, like so

const handleChange = ({ target }) => {
  await setFieldTouched('fieldName', true, false) 
  await setFieldValue('fieldName', target.value, false)
  await validateField('fieldName')
}

changeset-bot · 2023-07-04T16:56:57Z

🦋 Changeset detected

Latest commit: 4adda22

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 2 packages

Name	Type
formik	Patch
formik-native	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

vercel · 2023-07-04T16:56:59Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

1 Ignored Deployment

Name	Status	Preview	Comments	Updated (UTC)
formik-docs	⬜️ Ignored (Inspect)	Visit Preview		Jul 12, 2023 8:13am

codesandbox-ci · 2023-07-04T16:57:35Z

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 4adda22:

Sandbox	Source
Formik TypeScript Playground (forked)	Configuration

bonimba · 2023-07-04T16:58:13Z

packages/formik/src/types.tsx

  /** Manually set values object  */
  setValues: (
    values: React.SetStateAction<Values>,
    shouldValidate?: boolean
-  ) => void;
+  ) => Promise<void | FormikErrors<Values>>;


bonimba · 2023-07-04T16:58:37Z

packages/formik/src/types.tsx

@@ -86,12 +86,12 @@ export interface FormikHelpers<Values> {
  setTouched: (
    touched: FormikTouched<Values>,
    shouldValidate?: boolean
-  ) => void;
+  ) => Promise<void | FormikErrors<Values>>;


bonimba · 2023-07-04T16:59:12Z

packages/formik/src/types.tsx

@@ -105,11 +105,11 @@ export interface FormikHelpers<Values> {
    field: string,
    isTouched?: boolean,
    shouldValidate?: boolean
-  ) => void;
+  ) =>  Promise<void | FormikErrors<Values>>;


bonimba · 2023-07-04T16:59:36Z

packages/formik/src/types.tsx

  /** Validate form values */
  validateForm: (values?: any) => Promise<FormikErrors<Values>>;
  /** Validate field value */
-  validateField: (field: string) => void;
+  validateField: (field: string) => Promise<void> | Promise<string | undefined>;


bonimba · 2023-07-18T12:35:02Z

@probablyup is there something more I need to do to make this PR reviewable?

quantizor · 2023-07-18T13:14:58Z

Just haven't had time to look at it yet

quantizor

Looks fantastic, thank you!

@bonimba

This PR was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated. # Releases ## formik@2.4.3 ### Patch Changes - [`9e0a661`](9e0a661) [#3843](#3843) Thanks [@bonimba](https://github.com/bonimba)! - Fix FormikHelper and FieldHelperProps types ## formik-native@2.1.26 ### Patch Changes - Updated dependencies \[[`9e0a661`](9e0a661)]: - formik@2.4.3

@bonimba

This PR was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated. # Releases ## formik@2.4.3 ### Patch Changes - [`9e0a661`](jaredpalmer/formik@9e0a661) [#3843](jaredpalmer/formik#3843) Thanks [@bonimba](https://github.com/bonimba)! - Fix FormikHelper and FieldHelperProps types ## formik-native@2.1.26 ### Patch Changes - Updated dependencies \[[`9e0a661`](jaredpalmer/formik@9e0a661)]: - formik@2.4.3

bonimba added 2 commits July 4, 2023 17:38

Align FormikHelpers types to useFormik ones

da9f129

Align FieldHelperProps types to useFormik ones

194d13b

vercel bot deployed to Preview – formik-docs July 4, 2023 16:58 View deployment

bonimba commented Jul 4, 2023

View reviewed changes

bonimba changed the title ~~Align FormikHelpers and FieldHelper types to useFormik ones~~ types: Align FormikHelpers and FieldHelper types to useFormik ones Jul 4, 2023

bonimba added 2 commits July 4, 2023 18:15

update docs

16b599e

add changeset as patch

b770e8e

bonimba marked this pull request as ready for review July 4, 2023 17:37

bonimba requested review from jaredpalmer and quantizor as code owners July 4, 2023 17:37

Merge branch 'main' into cohesive-types

4adda22

quantizor approved these changes Aug 2, 2023

View reviewed changes

kodiakhq bot merged commit 9e0a661 into jaredpalmer:main Aug 2, 2023

github-actions bot mentioned this pull request Aug 2, 2023

Version Packages #3855

Merged

bonimba deleted the cohesive-types branch August 2, 2023 10:58

grahamlangford mentioned this pull request Aug 7, 2023

Update formik and resolve linting errors pixiebrix/pixiebrix-extension#6223

Closed

ViktoriiaZinec mentioned this pull request May 17, 2024

[Snyk] Upgrade formik from 2.4.2 to 2.4.6 ViktoriiaZinec/phonebook#33

Open

alvinrumbaoa mentioned this pull request May 24, 2024

[Snyk] Upgrade formik from 2.2.9 to 2.4.6 alvinrumbaoa/inventory-monitor#93

Open

ViktoriiaZinec mentioned this pull request May 24, 2024

[Snyk] Upgrade formik from 2.4.2 to 2.4.6 ViktoriiaZinec/phonebook#38

Open

ilshaad mentioned this pull request May 24, 2024

[Snyk] Upgrade formik from 2.2.9 to 2.4.6 ilshaad/portfolio-ik#91

Open

alvinrumbaoa mentioned this pull request Sep 10, 2024

[Snyk] Upgrade: , , , formik, next alvinrumbaoa/inventory-monitor#137

Open

udilbar mentioned this pull request Sep 10, 2024

[Snyk] Upgrade: , , prop-types, clsx, , , , formik, history, react-feather, react-router, react-router-dom, react-scripts, yup udilbar/react-authentication-with-context-api#152

Open

Manou-Codeur mentioned this pull request Sep 10, 2024

[Snyk] Upgrade: , , , , , , firebase, formik, node-sass, react-router-dom, react-scripts, typescript Manou-Codeur/Habit-Tracker#1

Open

alvinrumbaoa mentioned this pull request Sep 12, 2024

[Snyk] Upgrade: , , , formik, next alvinrumbaoa/inventory-monitor#139

Open

wainnyta mentioned this pull request Sep 12, 2024

[Snyk] Upgrade: , , , , , formik, framer-motion, next, react-icons, react-remove-scroll, styled-jsx wainnyta/softwarearchitek.com#67

Open

Manou-Codeur mentioned this pull request Sep 14, 2024

[Snyk] Upgrade: , , , , , , firebase, formik, node-sass, react-scripts, typescript Manou-Codeur/Habit-Tracker#3

Open

udilbar mentioned this pull request Sep 15, 2024

[Snyk] Upgrade: , , prop-types, clsx, , , , formik, history, react-feather, react-router, react-router-dom, react-scripts, yup udilbar/react-authentication-with-context-api#155

Open

Manou-Codeur mentioned this pull request Sep 15, 2024

[Snyk] Upgrade: , , , , , , firebase, formik, node-sass, react-scripts, typescript Manou-Codeur/Habit-Tracker#4

Open

alvinrumbaoa mentioned this pull request Sep 17, 2024

[Snyk] Upgrade: , , , formik, next alvinrumbaoa/inventory-monitor#140

Open

Manou-Codeur mentioned this pull request Sep 17, 2024

[Snyk] Upgrade: , , , , , , firebase, formik, node-sass, react-scripts, typescript Manou-Codeur/Habit-Tracker#5

Open

wainnyta mentioned this pull request Sep 17, 2024

[Snyk] Upgrade: , , , , , formik, framer-motion, next, react-icons, react-remove-scroll, styled-jsx wainnyta/softwarearchitek.com#68

Open

alvinrumbaoa mentioned this pull request Sep 18, 2024

[Snyk] Upgrade: , , , formik, next alvinrumbaoa/inventory-monitor#141

Open

udilbar mentioned this pull request Sep 18, 2024

[Snyk] Upgrade: , , prop-types, clsx, , , , formik, history, react-feather, react-router, react-router-dom, react-scripts, yup udilbar/react-authentication-with-context-api#156

Open

alvinrumbaoa mentioned this pull request Sep 20, 2024

[Snyk] Upgrade: , , , formik, next alvinrumbaoa/inventory-monitor#142

Open

wainnyta mentioned this pull request Sep 21, 2024

[Snyk] Upgrade: , , , , , formik, framer-motion, next, react-icons, react-remove-scroll, styled-jsx wainnyta/softwarearchitek.com#69

Open

This was referenced Sep 22, 2024

[Snyk] Upgrade: , react, react-dom, , , , formik, next, use-remote-data alvinrumbaoa/photography#133

Open

[Snyk] Upgrade: , , , formik, next alvinrumbaoa/inventory-monitor#143

Open

alvinrumbaoa mentioned this pull request Sep 24, 2024

[Snyk] Upgrade formik from 2.2.9 to 2.4.6 alvinrumbaoa/inventory-monitor#148

Open

ilshaad mentioned this pull request Sep 25, 2024

[Snyk] Upgrade formik from 2.2.9 to 2.4.6 ilshaad/portfolio-ik#96

Open

udilbar mentioned this pull request Oct 1, 2024

[Snyk] Upgrade formik from 2.2.1 to 2.4.6 udilbar/react-authentication-with-context-api#165

Open

This was referenced Oct 28, 2024

[Snyk] Upgrade formik from 2.2.9 to 2.4.6 alvinrumbaoa/photography#144

Open

[Snyk] Upgrade formik from 2.2.9 to 2.4.6 alvinrumbaoa/inventory-monitor#159

Open

This was referenced Nov 4, 2024

[Snyk] Upgrade formik from 2.2.9 to 2.4.6 alvinrumbaoa/photography#149

Open

[Snyk] Upgrade formik from 2.2.9 to 2.4.6 alvinrumbaoa/inventory-monitor#164

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

types: Align FormikHelpers and FieldHelper types to useFormik ones #3843

types: Align FormikHelpers and FieldHelper types to useFormik ones #3843

bonimba commented Jul 4, 2023 •

edited

Loading

changeset-bot bot commented Jul 4, 2023 •

edited

Loading

vercel bot commented Jul 4, 2023 •

edited

Loading

codesandbox-ci bot commented Jul 4, 2023 •

edited

Loading

bonimba Jul 4, 2023

bonimba Jul 4, 2023

bonimba Jul 4, 2023

bonimba Jul 4, 2023

bonimba commented Jul 18, 2023

quantizor commented Jul 18, 2023

quantizor left a comment

types: Align FormikHelpers and FieldHelper types to useFormik ones #3843

types: Align FormikHelpers and FieldHelper types to useFormik ones #3843

Conversation

bonimba commented Jul 4, 2023 • edited Loading

changeset-bot bot commented Jul 4, 2023 • edited Loading

🦋 Changeset detected

vercel bot commented Jul 4, 2023 • edited Loading

codesandbox-ci bot commented Jul 4, 2023 • edited Loading

bonimba Jul 4, 2023

Choose a reason for hiding this comment

bonimba Jul 4, 2023

Choose a reason for hiding this comment

bonimba Jul 4, 2023

Choose a reason for hiding this comment

bonimba Jul 4, 2023

Choose a reason for hiding this comment

bonimba commented Jul 18, 2023

quantizor commented Jul 18, 2023

quantizor left a comment

Choose a reason for hiding this comment

bonimba commented Jul 4, 2023 •

edited

Loading

changeset-bot bot commented Jul 4, 2023 •

edited

Loading

vercel bot commented Jul 4, 2023 •

edited

Loading

codesandbox-ci bot commented Jul 4, 2023 •

edited

Loading