const { useState, Suspense, lazy } = React;

// Simulate a lazy-loaded component with a network delay
function createLazyComponent(delay) {
  return lazy(() =>
    new Promise(resolve =>
      setTimeout(() => resolve({
        default: function UserProfile() {
          return (
            <div>
              <span>DV</span>
              <strong>Diego Vallejo</strong>
              <p>Full-Stack Developer</p>
            </div>
          );
        }
      }), delay)
    )
  );
}

function App() {
  const [LazyProfile, setLazyProfile] = useState(null);
  const [key, setKey] = useState(0);

  const load = () => {
    setLazyProfile(() => createLazyComponent(2000));
    setKey(k => k + 1);
  };

  return (
    <Suspense fallback={<Spinner />} key={key}>
      {LazyProfile ? <LazyProfile /> : "Press button"}
    </Suspense>
  );
}