Simple generic function for setting values on change when using `useState` hook

Form.ts

// example usage

import React from 'react';

enum SelectVal {
  ONE,
  TWO,
  THREE
}

export default function Form() {
  const [name, setName] = React.useState('');
  const [val, setVal] = React.useState(SelectVal.ONE);

  return (
    <form>
      <input
        type="text"
        onChange={onInputChange(setName)}
      />
      <select
        onChange={onInputChange<SelectVal>(setVal)}
        value={val}
      >
        <option ...>
      </select>
    </form>
  );
}

onInputChange.ts

  function onInputChange<T>(setter: Dispatch<SetStateAction<T>>) {
    return ({
      target: { value },
    }: ChangeEvent<HTMLInputElement | HTMLSelectElement>) => {
      // In order to cast `value` to generic type T, cast it to `unknown` first
      setter((value as unknown) as T);
    };
  }

Applicable for inputs and selects