"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.LinkPlugin = void 0;
exports.ScopeComponentCard = ScopeComponentCard;
exports.ScopeOverview = ScopeOverview;
exports.useCardPlugins = useCardPlugins;
function _react() {
  const data = _interopRequireWildcard(require("react"));
  _react = function () {
    return data;
  };
  return data;
}
function _explorerUiGallery() {
  const data = require("@teambit/explorer.ui.gallery.component-grid");
  _explorerUiGallery = function () {
    return data;
  };
  return data;
}
function _scopeUi() {
  const data = require("@teambit/scope.ui.scope-details");
  _scopeUi = function () {
    return data;
  };
  return data;
}
function _previewUi() {
  const data = require("@teambit/preview.ui.preview-placeholder");
  _previewUi = function () {
    return data;
  };
  return data;
}
function _scopeUi2() {
  const data = require("@teambit/scope.ui.empty-scope");
  _scopeUi2 = function () {
    return data;
  };
  return data;
}
function _designUi() {
  const data = require("@teambit/design.ui.tooltip");
  _designUi = function () {
    return data;
  };
  return data;
}
function _componentId() {
  const data = require("@teambit/component-id");
  _componentId = function () {
    return data;
  };
  return data;
}
function _explorerUi() {
  const data = require("@teambit/explorer.ui.component-card");
  _explorerUi = function () {
    return data;
  };
  return data;
}
function _scopeUiHooks() {
  const data = require("@teambit/scope.ui.hooks.scope-context");
  _scopeUiHooks = function () {
    return data;
  };
  return data;
}
function _scopeOverviewModule() {
  const data = _interopRequireDefault(require("./scope-overview.module.scss"));
  _scopeOverviewModule = function () {
    return data;
  };
  return data;
}
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
class LinkPlugin {
  link(id) {
    return id.fullName;
  }
}
exports.LinkPlugin = LinkPlugin;
function ScopeOverview({
  badgeSlot,
  overviewSlot,
  TargetOverview
}) {
  const scope = (0, _react().useContext)(_scopeUiHooks().ScopeContext);
  const {
    components,
    componentDescriptors
  } = scope;
  if (TargetOverview) return /*#__PURE__*/_react().default.createElement(TargetOverview, null);
  if (!components || components.length === 0) return /*#__PURE__*/_react().default.createElement(_scopeUi2().EmptyScope, {
    name: scope.name
  });
  const compDescriptorById = new Map(componentDescriptors.map(comp => [comp.id.toString(), comp]));
  const compModelsById = new Map(components.map(comp => [comp.id.toString(), comp]));
  const plugins = useCardPlugins({
    compModelsById
  });
  return /*#__PURE__*/_react().default.createElement("div", {
    className: _scopeOverviewModule().default.container
  }, /*#__PURE__*/_react().default.createElement(_scopeUi().ScopeDetails, {
    scopeName: scope.name,
    icon: scope.icon,
    backgroundIconColor: scope.backgroundIconColor,
    badgeSlot: badgeSlot,
    overviewSlot: overviewSlot,
    description: scope.description,
    componentCount: scope.components.length
  }), /*#__PURE__*/_react().default.createElement(_explorerUiGallery().ComponentGrid, {
    className: _scopeOverviewModule().default.cardGrid
  }, components.map(component => {
    if (component.deprecation?.isDeprecate) return null;
    return /*#__PURE__*/_react().default.createElement("div", {
      key: component.id.toString()
    }, /*#__PURE__*/_react().default.createElement(ScopeComponentCard, {
      component: component,
      plugins: plugins,
      componentDescriptor: compDescriptorById.get(component.id.toString())
    }));
  })));
}
function ScopeComponentCard({
  componentDescriptor,
  plugins
}) {
  if (!componentDescriptor) return null;
  return /*#__PURE__*/_react().default.createElement(_explorerUi().ComponentCard, {
    plugins: plugins,
    component: componentDescriptor
  });
}
function useCardPlugins({
  compModelsById
}) {
  const plugins = _react().default.useMemo(() => [{
    preview: function Preview({
      component
    }) {
      const compModel = compModelsById.get(component.id.toString());
      if (!compModel) return null;
      return /*#__PURE__*/_react().default.createElement(_previewUi().PreviewPlaceholder, {
        componentDescriptor: component,
        component: compModel,
        shouldShowPreview: compModel.compositions.length > 0
      });
    }
  }, {
    previewBottomRight: function PreviewBottomRight({
      component
    }) {
      const env = component.get('teambit.envs/envs');
      const envComponentId = env?.id ? _componentId().ComponentID.fromString(env?.id) : undefined;
      return /*#__PURE__*/_react().default.createElement("div", {
        className: _scopeOverviewModule().default.rightPreviewPlugins
      }, /*#__PURE__*/_react().default.createElement("div", {
        className: _scopeOverviewModule().default.badge
      }, /*#__PURE__*/_react().default.createElement(_designUi().Tooltip, {
        delay: 300,
        content: envComponentId?.name
      }, /*#__PURE__*/_react().default.createElement("img", {
        src: env?.icon,
        className: _scopeOverviewModule().default.envIcon
      }))));
    }
  }, new LinkPlugin()], [compModelsById.size]);
  return plugins;
}

//# sourceMappingURL=scope-overview.js.map