@atlaskit/editor-plugin-extension/dist/es2019/ui/ConfigPanel/LoadingState.js

editor-plugin-extension plugin for @atlaskit/editor-core

/**
 * @jsxRuntime classic
 * @jsx jsx
 */

// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
import { css, jsx } from '@emotion/react';
import { injectIntl } from 'react-intl';
import { messages } from '@atlaskit/editor-common/extensions';
import SectionMessage from '@atlaskit/section-message';
import Spinner from '@atlaskit/spinner';
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
const spinnerWrapperStyles = css({
  display: 'flex',
  justifyContent: 'center',
  marginTop: "var(--ds-space-800, 64px)"
});
const errorWrapperStyles = css({
  marginTop: "var(--ds-space-400, 32px)" // Add some padding to the top to make sure we place this below the offline status banner
});
const LoadingStateWithErrorHandling = injectIntl(props => {
  if (props.error) {
    return jsx("div", {
      css: errorWrapperStyles,
      "data-testid": "ConfigPanelLoadingError"
    }, jsx(SectionMessage, {
      appearance: "error"
    }, props.intl.formatMessage(messages.panelLoadingError)));
  }
  return jsx("div", {
    css: spinnerWrapperStyles,
    "data-testid": "ConfigPanelLoading"
  }, jsx(Spinner, {
    size: "small",
    interactionName: "config-panel-spinner"
  }));
});
const LoadingStateWithoutErrorHandling = () => jsx("div", {
  css: spinnerWrapperStyles,
  "data-testid": "ConfigPanelLoading"
}, jsx(Spinner, {
  size: "small",
  interactionName: "config-panel-spinner"
}));
const LoadingState = props => editorExperiment('platform_editor_offline_editing_web', true) ? LoadingStateWithErrorHandling(props) : LoadingStateWithoutErrorHandling();
export default LoadingState;