Should the useState hook verify that the lazy initial state function must be synchronous

#react

By now, you can pass asynchronous function to the ReactJS useState hook to lazy initialize the state. But this seems not correct, the state will be a JavaScript promise.

const [state] = useState(async () => 'a');
console.log(state); // "state" is a promise.

So I think ReactJS useState hook should validate this function to make sure it is synchronous.

Something like this:

const syncCallback = () => 'a';
const asyncCallback = async () => 'b';

const AsyncFunction = (async () => { }).constructor;

function isAsync(fn: Function) {
  return fn instanceof AsyncFunction;
}

function useState<S>(initialState: S | (() => S)) {
  if (typeof initialState === 'function' && isAsync(initialState)) throw new Error('initial state function must be synchronous.')
  if (initialState instanceof Function) {
    return initialState();
  }
  return initialState
}

const state1 = useState(syncCallback); // correct usage
console.log('state1: ', state1); 
const state2 = useState(asyncCallback); // Only allow synchronous function, so it will throw error to developer.