import "choerodon-ui/lib/spin/style";
import _Spin from "@hzero-front-ui/c7n-ui/lib/Spin";
import React, { Fragment, Suspense, useMemo } from 'react';
import { observer } from 'mobx-react-lite';
import { useClusterMainStore } from "../../../stores";
import { useClusterContentStore } from "../stores";
import EmptyPage from "../../../../../../components/empty-page";
import "./index.less";
export default observer(function (props) {
  var _useClusterMainStore = useClusterMainStore(),
      intlPrefix = _useClusterMainStore.intlPrefix,
      prefixCls = _useClusterMainStore.prefixCls;

  var _useClusterContentSto = useClusterContentStore(),
      _useClusterContentSto2 = _useClusterContentSto.contentStore,
      getGrafanaUrl = _useClusterContentSto2.getGrafanaUrl,
      setTabKey = _useClusterContentSto2.setTabKey,
      formatMessage = _useClusterContentSto.formatMessage,
      COMPONENT_TAB = _useClusterContentSto.tabs.COMPONENT_TAB,
      ClusterDetailDs = _useClusterContentSto.ClusterDetailDs;

  function refresh() {}

  function LinkToComponent() {
    setTabKey(COMPONENT_TAB);
  }

  function getContent() {
    if (getGrafanaUrl) {
      var code = ClusterDetailDs.current ? ClusterDetailDs.current.get('code') : '';
      return /*#__PURE__*/React.createElement("iframe", {
        height: 700,
        width: "100%",
        src: "".concat(getGrafanaUrl, "?kiosk=tv"),
        title: "grafana",
        frameBorder: 0,
        sandbox: true
      });
    } else {
      return /*#__PURE__*/React.createElement(EmptyPage, {
        title: formatMessage({
          id: "".concat(intlPrefix, ".monitor.install")
        }),
        describe: formatMessage({
          id: "".concat(intlPrefix, ".monitor.empty.des")
        }),
        btnText: formatMessage({
          id: "".concat(intlPrefix, ".monitor.link")
        }),
        onClick: LinkToComponent,
        access: true
      });
    }
  }

  return /*#__PURE__*/React.createElement("div", {
    className: "".concat(prefixCls, "-monitor-wrap")
  }, /*#__PURE__*/React.createElement(Suspense, {
    fallback: /*#__PURE__*/React.createElement(_Spin, null)
  }, getContent()));
});