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

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = CustomDataViewsList;
exports.useCustomDataViews = useCustomDataViews;
var _data = require("@wordpress/data");
var _coreData = require("@wordpress/core-data");
var _components = require("@wordpress/components");
var _element = require("@wordpress/element");
var _icons = require("@wordpress/icons");
var _i18n = require("@wordpress/i18n");
var _router = require("@wordpress/router");
var _dataviewItem = _interopRequireDefault(require("./dataview-item"));
var _addNewView = _interopRequireDefault(require("./add-new-view"));
var _lockUnlock = require("../../lock-unlock");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

const {
  useHistory,
  useLocation
} = (0, _lockUnlock.unlock)(_router.privateApis);
const EMPTY_ARRAY = [];
function RenameItemModalContent({
  dataviewId,
  currentTitle,
  setIsRenaming
}) {
  const {
    editEntityRecord
  } = (0, _data.useDispatch)(_coreData.store);
  const [title, setTitle] = (0, _element.useState)(currentTitle);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)("form", {
    onSubmit: async event => {
      event.preventDefault();
      await editEntityRecord('postType', 'wp_dataviews', dataviewId, {
        title
      });
      setIsRenaming(false);
    },
    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalVStack, {
      spacing: "5",
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.TextControl, {
        __next40pxDefaultSize: true,
        __nextHasNoMarginBottom: true,
        label: (0, _i18n.__)('Name'),
        value: title,
        onChange: setTitle,
        placeholder: (0, _i18n.__)('My view'),
        className: "patterns-create-modal__name-input"
      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
        justify: "right",
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
          variant: "tertiary",
          __next40pxDefaultSize: true,
          onClick: () => {
            setIsRenaming(false);
          },
          children: (0, _i18n.__)('Cancel')
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Button, {
          variant: "primary",
          type: "submit",
          "aria-disabled": !title,
          __next40pxDefaultSize: true,
          children: (0, _i18n.__)('Save')
        })]
      })]
    })
  });
}
function CustomDataViewItem({
  dataviewId,
  isActive
}) {
  const history = useHistory();
  const location = useLocation();
  const {
    dataview
  } = (0, _data.useSelect)(select => {
    const {
      getEditedEntityRecord
    } = select(_coreData.store);
    return {
      dataview: getEditedEntityRecord('postType', 'wp_dataviews', dataviewId)
    };
  }, [dataviewId]);
  const {
    deleteEntityRecord
  } = (0, _data.useDispatch)(_coreData.store);
  const type = (0, _element.useMemo)(() => {
    const viewContent = JSON.parse(dataview.content);
    return viewContent.type;
  }, [dataview.content]);
  const [isRenaming, setIsRenaming] = (0, _element.useState)(false);
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewItem.default, {
      title: dataview.title,
      type: type,
      isActive: isActive,
      isCustom: true,
      customViewId: dataviewId,
      suffix: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.DropdownMenu, {
        icon: _icons.moreVertical,
        label: (0, _i18n.__)('Actions'),
        className: "edit-site-sidebar-dataviews-dataview-item__dropdown-menu",
        toggleProps: {
          style: {
            color: 'inherit'
          },
          size: 'small'
        },
        children: ({
          onClose
        }) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.MenuGroup, {
          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.MenuItem, {
            onClick: () => {
              setIsRenaming(true);
              onClose();
            },
            children: (0, _i18n.__)('Rename')
          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.MenuItem, {
            onClick: async () => {
              await deleteEntityRecord('postType', 'wp_dataviews', dataview.id, {
                force: true
              });
              if (isActive) {
                history.replace({
                  postType: location.query.postType
                });
              }
              onClose();
            },
            isDestructive: true,
            children: (0, _i18n.__)('Delete')
          })]
        })
      })
    }), isRenaming && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Modal, {
      title: (0, _i18n.__)('Rename'),
      onRequestClose: () => {
        setIsRenaming(false);
      },
      focusOnMount: "firstContentElement",
      size: "small",
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(RenameItemModalContent, {
        dataviewId: dataviewId,
        setIsRenaming: setIsRenaming,
        currentTitle: dataview.title
      })
    })]
  });
}
function useCustomDataViews(type) {
  const customDataViews = (0, _data.useSelect)(select => {
    const {
      getEntityRecords
    } = select(_coreData.store);
    const dataViewTypeRecords = getEntityRecords('taxonomy', 'wp_dataviews_type', {
      slug: type
    });
    if (!dataViewTypeRecords || dataViewTypeRecords.length === 0) {
      return EMPTY_ARRAY;
    }
    const dataViews = getEntityRecords('postType', 'wp_dataviews', {
      wp_dataviews_type: dataViewTypeRecords[0].id,
      orderby: 'date',
      order: 'asc'
    });
    if (!dataViews) {
      return EMPTY_ARRAY;
    }
    return dataViews;
  });
  return customDataViews;
}
function CustomDataViewsList({
  type,
  activeView,
  isCustom
}) {
  const customDataViews = useCustomDataViews(type);
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      className: "edit-site-sidebar-navigation-screen-dataviews__group-header",
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalHeading, {
        level: 2,
        children: (0, _i18n.__)('Custom Views')
      })
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalItemGroup, {
      className: "edit-site-sidebar-navigation-screen-dataviews__custom-items",
      children: [customDataViews.map(customViewRecord => {
        return /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomDataViewItem, {
          dataviewId: customViewRecord.id,
          isActive: isCustom && Number(activeView) === customViewRecord.id
        }, customViewRecord.id);
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_addNewView.default, {
        type: type
      })]
    })]
  });
}
//# sourceMappingURL=custom-dataviews-list.js.map