import React, { useCallback, useMemo } from 'react';
import { runInAction } from 'mobx';
import { Permission } from '@choerodon/boot';
import { observer } from 'mobx-react-lite';
import { C7NTabs } from '@choerodon/components';
import { useResourceStore } from "../../../stores";
import "./index.less";

var SidebarHeader = function SidebarHeader() {
  var _useResourceStore = useResourceStore(),
      _useResourceStore$vie = _useResourceStore.viewTypeMappings,
      IST_VIEW_TYPE = _useResourceStore$vie.IST_VIEW_TYPE,
      RES_VIEW_TYPE = _useResourceStore$vie.RES_VIEW_TYPE,
      intlPrefix = _useResourceStore.intlPrefix,
      prefixCls = _useResourceStore.prefixCls,
      formatMessage = _useResourceStore.intl.formatMessage,
      resourceStore = _useResourceStore.resourceStore,
      treeDs = _useResourceStore.treeDs;

  var buttonProps = useMemo(function () {
    return {
      disabled: treeDs.status === 'loading',
      color: 'primary',
      funcType: 'flat'
    };
  }, [treeDs.status]);

  function handleChoose(choose) {
    runInAction(function () {
      resourceStore.changeViewType(choose);
      resourceStore.setSelectedMenu({});
      resourceStore.setExpandedKeys([]);
      resourceStore.setSearchValue('');
    });
  }

  function chooseInstance() {
    resourceStore.getViewType !== IST_VIEW_TYPE && handleChoose(IST_VIEW_TYPE);
  }

  function chooseResource() {
    resourceStore.getViewType !== RES_VIEW_TYPE && handleChoose(RES_VIEW_TYPE);
  }

  var handleChangeTabs = function handleChangeTabs(key) {
    if (key === IST_VIEW_TYPE) {
      chooseInstance();
    } else {
      chooseResource();
    }
  };

  return /*#__PURE__*/React.createElement("div", {
    className: "".concat(prefixCls, "-sidebar-head")
  }, /*#__PURE__*/React.createElement("div", {
    style: {
      position: 'relative',
      bottom: 11
    }
  }, /*#__PURE__*/React.createElement(C7NTabs, {
    driveRouteKey: true,
    onChange: handleChangeTabs,
    tabs: [{
      tab: formatMessage({
        id: "".concat(intlPrefix, ".viewer.").concat(IST_VIEW_TYPE)
      }),
      key: IST_VIEW_TYPE
    }, {
      tab: formatMessage({
        id: "".concat(intlPrefix, ".viewer.").concat(RES_VIEW_TYPE)
      }),
      key: RES_VIEW_TYPE
    }]
  })));
};

export default SidebarHeader;