https://np.reddit.com/r/reactjs/comments/ndkdx2/reduce_redundancy_in_handling_change/gyb5biq/

[u/backtickbot]

You can modify handleChange to take the setState function as its parameter that will then return another function to call the setState:

const handleChange = (setState) => {

  return ({ target: { value }) => {
    setState((oldState) => ({ ...oldState, value })
  }  
};

You then use the above function like:

<TextInput
    invalid={username.invalid}
    invalidText={username.invalidText}
    name="userName"
    onChange={handleChange(setUsername)}
    onBlur={handleInput}
    value={username.value}
/>

Hope that helps !