"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.useIsSiteEditorLoading = useIsSiteEditorLoading;
var _element = require("@wordpress/element");
var _data = require("@wordpress/data");
var _coreData = require("@wordpress/core-data");
/**
 * WordPress dependencies
 */

const MAX_LOADING_TIME = 10000; // 10 seconds

function useIsSiteEditorLoading() {
  const [loaded, setLoaded] = (0, _element.useState)(false);
  const inLoadingPause = (0, _data.useSelect)(select => {
    const hasResolvingSelectors = select(_coreData.store).hasResolvingSelectors();
    return !loaded && !hasResolvingSelectors;
  }, [loaded]);

  /*
   * If the maximum expected loading time has passed, we're marking the
   * editor as loaded, in order to prevent any failed requests from blocking
   * the editor canvas from appearing.
   */
  (0, _element.useEffect)(() => {
    let timeout;
    if (!loaded) {
      timeout = setTimeout(() => {
        setLoaded(true);
      }, MAX_LOADING_TIME);
    }
    return () => {
      clearTimeout(timeout);
    };
  }, [loaded]);
  (0, _element.useEffect)(() => {
    if (inLoadingPause) {
      /*
       * We're using an arbitrary 100ms timeout here to catch brief
       * moments without any resolving selectors that would result in
       * displaying brief flickers of loading state and loaded state.
       *
       * It's worth experimenting with different values, since this also
       * adds 100ms of artificial delay after loading has finished.
       */
      const ARTIFICIAL_DELAY = 100;
      const timeout = setTimeout(() => {
        setLoaded(true);
      }, ARTIFICIAL_DELAY);
      return () => {
        clearTimeout(timeout);
      };
    }
  }, [inLoadingPause]);
  return !loaded;
}
//# sourceMappingURL=hooks.js.map