/* wp:polyfill */
"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = DataViewItem;
var _clsx = _interopRequireDefault(require("clsx"));
var _router = require("@wordpress/router");
var _components = require("@wordpress/components");
var _dataviews = require("@wordpress/dataviews");
var _url = require("@wordpress/url");
var _sidebarNavigationItem = _interopRequireDefault(require("../sidebar-navigation-item"));
var _lockUnlock = require("../../lock-unlock");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

const {
  useLocation
} = (0, _lockUnlock.unlock)(_router.privateApis);
function DataViewItem({
  title,
  slug,
  customViewId,
  type,
  icon,
  isActive,
  isCustom,
  suffix
}) {
  const {
    path
  } = useLocation();
  const iconToUse = icon || _dataviews.VIEW_LAYOUTS.find(v => v.type === type).icon;
  let activeView = isCustom ? customViewId : slug;
  if (activeView === 'all') {
    activeView = undefined;
  }
  const query = {
    layout: type,
    activeView,
    isCustom: isCustom ? 'true' : undefined
  };
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
    justify: "flex-start",
    className: (0, _clsx.default)('edit-site-sidebar-dataviews-dataview-item', {
      'is-selected': isActive
    }),
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sidebarNavigationItem.default, {
      icon: iconToUse,
      to: (0, _url.addQueryArgs)(path, query),
      "aria-current": isActive ? 'true' : undefined,
      children: title
    }), suffix]
  });
}
//# sourceMappingURL=dataview-item.js.map