React/TypeScript - What does "Dispatch<SetStateAction<boolean>>" stand for?

Question

I am writing Frontend Tests for React Components in TypeScript. Since the Code is from a more experienced Programmer, some Datatypes seem a bit new for me. Now I've got a prop that is defined with "Dispatch<SetStateAction>" as datatype. I've noticed that using the set-property of a useState-Hook is working, but I'm not really sure if this is how the prop is supposed to be used. For reference: The prop is called "onFullScreenClick". I'd be very grateful for an explanation and an example for what's most likely to be put in

Answer 1

If you look at the source of the typings:

type SetStateAction<S> = S | (prevState: S) => S;

type Dispatch<A> = (action: A) => void;

Dispatch takes an action as a parameter and returns nothing meaningful (void). There are multiple types of actions, and one of them is SetStateAction.

Remember that useState can take a new state, or a function that takes the previous state and returns the new state.

So useState's type is actually:

type UseState<S> = (action: S | ((prevState: S) => S)) => void;