til/react/set-the-type-for-a-usestate-hook.md

Set The Type For A useState Hook

TypeScript can often infer the type of a useState hook. For instance, in the following example, TypeScript infers a type of boolean:

const [open, setOpen] = React.useState(false);

If we have a useState hook that can be null or a string:

const [error, setError] = React.useState(null);

setError('There was an error');
// Argument of type 'string' is not assignable
// to parameter of type 'SetStateAction<null>'

then we'll get a TypeScript warning when we violate the inferred type of SetStateAction<null>.

The useState can be appropriate typed for this situation like so:

const [error, setError] =
  React.useState<null | string>(null);

source