@wordpress/block-library
Version:
Block library for the WordPress editor.
137 lines (113 loc) • 5.06 kB
JavaScript
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.CLASSIC_MENU_CONVERSION_SUCCESS = exports.CLASSIC_MENU_CONVERSION_PENDING = exports.CLASSIC_MENU_CONVERSION_IDLE = exports.CLASSIC_MENU_CONVERSION_ERROR = void 0;
var _data = require("@wordpress/data");
var _coreData = require("@wordpress/core-data");
var _element = require("@wordpress/element");
var _i18n = require("@wordpress/i18n");
var _useCreateNavigationMenu = _interopRequireDefault(require("./use-create-navigation-menu"));
var _menuItemsToBlocks = _interopRequireDefault(require("../menu-items-to-blocks"));
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const CLASSIC_MENU_CONVERSION_SUCCESS = 'success';
exports.CLASSIC_MENU_CONVERSION_SUCCESS = CLASSIC_MENU_CONVERSION_SUCCESS;
const CLASSIC_MENU_CONVERSION_ERROR = 'error';
exports.CLASSIC_MENU_CONVERSION_ERROR = CLASSIC_MENU_CONVERSION_ERROR;
const CLASSIC_MENU_CONVERSION_PENDING = 'pending';
exports.CLASSIC_MENU_CONVERSION_PENDING = CLASSIC_MENU_CONVERSION_PENDING;
const CLASSIC_MENU_CONVERSION_IDLE = 'idle';
exports.CLASSIC_MENU_CONVERSION_IDLE = CLASSIC_MENU_CONVERSION_IDLE;
function useConvertClassicToBlockMenu(clientId) {
/*
* The wp_navigation post is created as a draft so the changes on the frontend and
* the site editor are not permanent without a save interaction done by the user.
*/
const {
create: createNavigationMenu
} = (0, _useCreateNavigationMenu.default)(clientId, 'draft');
const registry = (0, _data.useRegistry)();
const {
editEntityRecord
} = (0, _data.useDispatch)(_coreData.store);
const [status, setStatus] = (0, _element.useState)(CLASSIC_MENU_CONVERSION_IDLE);
const [error, setError] = (0, _element.useState)(null);
async function convertClassicMenuToBlockMenu(menuId, menuName) {
let navigationMenu;
let classicMenuItems; // 1. Fetch the classic Menu items.
try {
classicMenuItems = await registry.resolveSelect(_coreData.store).getMenuItems({
menus: menuId,
per_page: -1,
context: 'view'
});
} catch (err) {
throw new Error((0, _i18n.sprintf)( // translators: %s: the name of a menu (e.g. Header navigation).
(0, _i18n.__)(`Unable to fetch classic menu "%s" from API.`), menuName), {
cause: err
});
} // Handle offline response which resolves to `null`.
if (classicMenuItems === null) {
throw new Error((0, _i18n.sprintf)( // translators: %s: the name of a menu (e.g. Header navigation).
(0, _i18n.__)(`Unable to fetch classic menu "%s" from API.`), menuName));
} // 2. Convert the classic items into blocks.
const {
innerBlocks
} = (0, _menuItemsToBlocks.default)(classicMenuItems); // 3. Create the `wp_navigation` Post with the blocks.
try {
navigationMenu = await createNavigationMenu(menuName, innerBlocks);
/**
* Immediately trigger editEntityRecord to change the wp_navigation post status to 'publish'.
* This status change causes the menu to be displayed on the front of the site and sets the post state to be "dirty".
* The problem being solved is if saveEditedEntityRecord was used here, the menu would be updated on the frontend and the editor _automatically_,
* without user interaction.
* If the user abandons the site editor without saving, there would still be a wp_navigation post created as draft.
*/
await editEntityRecord('postType', 'wp_navigation', navigationMenu.id, {
status: 'publish'
}, {
throwOnError: true
});
} catch (err) {
throw new Error((0, _i18n.sprintf)( // translators: %s: the name of a menu (e.g. Header navigation).
(0, _i18n.__)(`Unable to create Navigation Menu "%s".`), menuName), {
cause: err
});
}
return navigationMenu;
}
const convert = (0, _element.useCallback)(async (menuId, menuName) => {
if (!menuId || !menuName) {
setError('Unable to convert menu. Missing menu details.');
setStatus(CLASSIC_MENU_CONVERSION_ERROR);
return;
}
setStatus(CLASSIC_MENU_CONVERSION_PENDING);
setError(null);
return await convertClassicMenuToBlockMenu(menuId, menuName).then(navigationMenu => {
setStatus(CLASSIC_MENU_CONVERSION_SUCCESS);
return navigationMenu;
}).catch(err => {
setError(err === null || err === void 0 ? void 0 : err.message);
setStatus(CLASSIC_MENU_CONVERSION_ERROR); // Rethrow error for debugging.
throw new Error((0, _i18n.sprintf)( // translators: %s: the name of a menu (e.g. Header navigation).
(0, _i18n.__)(`Unable to create Navigation Menu "%s".`), menuName), {
cause: err
});
});
}, []);
return {
convert,
status,
error
};
}
var _default = useConvertClassicToBlockMenu;
exports.default = _default;
//# sourceMappingURL=use-convert-classic-menu-to-block-menu.js.map
;