diff --git a/packages/block-library/src/page-list/index.js b/packages/block-library/src/page-list/index.js index 4a128e7da58a8..9ee01cd14d1b7 100644 --- a/packages/block-library/src/page-list/index.js +++ b/packages/block-library/src/page-list/index.js @@ -8,6 +8,7 @@ import { pages } from '@wordpress/icons'; */ import initBlock from '../utils/init-block'; import metadata from './block.json'; +import transforms from './transforms.js'; import edit from './edit.js'; const { name } = metadata; @@ -18,6 +19,7 @@ export const settings = { icon: pages, example: {}, edit, + transforms, }; export const init = () => initBlock( { name, metadata, settings } ); diff --git a/packages/block-library/src/page-list/transforms.js b/packages/block-library/src/page-list/transforms.js new file mode 100644 index 0000000000000..2bef13c674830 --- /dev/null +++ b/packages/block-library/src/page-list/transforms.js @@ -0,0 +1,71 @@ +/** + * WordPress dependencies + */ +import { createBlock } from '@wordpress/blocks'; +import { store as coreStore } from '@wordpress/core-data'; +import { select } from '@wordpress/data'; +const transforms = { + to: [ + { + type: 'block', + blocks: [ 'core/list' ], + transform: ( attributes ) => { + const { style, fontFamily } = attributes; + const pages = select( coreStore ).getEntityRecords( + 'postType', + 'page', + { + per_page: 100, + status: 'publish', + orderBy: 'menu_order', + order: 'asc', + _fields: [ + 'id', + 'link', + 'parent', + 'title', + 'menu_order', + ], + } + ); + + if ( ! pages || pages.length === 0 ) { + return createBlock( 'core/list', {} ); + } + + const createListItems = ( parentId = 0 ) => { + return pages + .filter( ( page ) => page.parent === parentId ) + .map( ( page ) => { + const childItems = createListItems( page.id ); + const listItem = createBlock( 'core/list-item', { + content: `${ page.title.rendered }`, + } ); + if ( childItems.length > 0 ) { + const subList = createBlock( + 'core/list', + {}, + childItems + ); + listItem.innerBlocks = [ subList ]; + } + return listItem; + } ); + }; + + const innerBlocks = createListItems(); + + return createBlock( + 'core/list', + { + style, + fontFamily, + }, + innerBlocks + ); + }, + }, + ], +}; + +export default transforms;