Simply async act

simply-async-act.js

export const AsyncApp = () => {
  const [data, setData] = useState('unloaded value');
  const [clickCount, setCount] = useState(0);
  const simulatedFetch = async () => {
    const fetchedValue = await Promise.resolve('fetched value');
    await new Promise(res => {
      setData(fetchedValue);
      res();
    });
  };

  useEffect(() => {
    simulatedFetch();
  }, []);

  const onClick = async () => {
    await Promise.resolve();
    setData('clicked');
    setCount(clickCount + 1);
  }

  return (
    <div
      style={styles}
      data-testid="click"
      onClick={onClick}>
      <h2>{data}</h2>
      <h3>{clickCount} clicks</h3>
    </div>
  );
};