"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = ScreenNavigationMoreMenu;
var _components = require("@wordpress/components");
var _icons = require("@wordpress/icons");
var _i18n = require("@wordpress/i18n");
var _element = require("@wordpress/element");
var _router = require("@wordpress/router");
var _renameModal = _interopRequireDefault(require("./rename-modal"));
var _deleteConfirmDialog = _interopRequireDefault(require("./delete-confirm-dialog"));
var _lockUnlock = require("../../lock-unlock");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

const {
  useHistory
} = (0, _lockUnlock.unlock)(_router.privateApis);
const POPOVER_PROPS = {
  position: 'bottom right'
};
function ScreenNavigationMoreMenu(props) {
  const {
    onDelete,
    onSave,
    onDuplicate,
    menuTitle,
    menuId
  } = props;
  const [renameModalOpen, setRenameModalOpen] = (0, _element.useState)(false);
  const [deleteConfirmDialogOpen, setDeleteConfirmDialogOpen] = (0, _element.useState)(false);
  const history = useHistory();
  const closeModals = () => {
    setRenameModalOpen(false);
    setDeleteConfirmDialogOpen(false);
  };
  const openRenameModal = () => setRenameModalOpen(true);
  const openDeleteConfirmDialog = () => setDeleteConfirmDialogOpen(true);
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.DropdownMenu, {
      className: "sidebar-navigation__more-menu",
      label: (0, _i18n.__)('Actions'),
      icon: _icons.moreVertical,
      popoverProps: POPOVER_PROPS,
      children: ({
        onClose
      }) => /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.MenuGroup, {
          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.MenuItem, {
            onClick: () => {
              openRenameModal();
              // Close the dropdown after opening the modal.
              onClose();
            },
            children: (0, _i18n.__)('Rename')
          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.MenuItem, {
            onClick: () => {
              history.navigate(`/wp_navigation/${menuId}?canvas=edit`);
            },
            children: (0, _i18n.__)('Edit')
          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.MenuItem, {
            onClick: () => {
              onDuplicate();
              onClose();
            },
            children: (0, _i18n.__)('Duplicate')
          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.MenuItem, {
            isDestructive: true,
            onClick: () => {
              openDeleteConfirmDialog();

              // Close the dropdown after opening the modal.
              onClose();
            },
            children: (0, _i18n.__)('Delete')
          })]
        })
      })
    }), deleteConfirmDialogOpen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_deleteConfirmDialog.default, {
      onClose: closeModals,
      onConfirm: onDelete
    }), renameModalOpen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_renameModal.default, {
      onClose: closeModals,
      menuTitle: menuTitle,
      onSave: onSave
    })]
  });
}
//# sourceMappingURL=more-menu.js.map