diff --git a/packages/block-library/src/categories/edit.js b/packages/block-library/src/categories/edit.js index f6e70618a84cd4..db014bac0fd150 100644 --- a/packages/block-library/src/categories/edit.js +++ b/packages/block-library/src/categories/edit.js @@ -2,6 +2,7 @@ * External dependencies */ import { unescape } from 'lodash'; +import classnames from 'classnames'; /** * WordPress dependencies @@ -28,17 +29,20 @@ export default function CategoriesEdit( { showEmpty, }, setAttributes, + className, } ) { const selectId = useInstanceId( CategoriesEdit, 'blocks-category-select' ); const query = { per_page: -1, hide_empty: ! showEmpty, context: 'view' }; if ( showOnlyTopLevel ) { query.parent = 0; } + const { records: categories, isResolving } = useEntityRecords( 'taxonomy', 'category', query ); + const getCategoriesList = ( parentId ) => { if ( ! categories?.length ) { return []; @@ -48,48 +52,41 @@ export default function CategoriesEdit( { } return categories.filter( ( { parent } ) => parent === parentId ); }; - const getCategoryListClassName = ( level ) => { - return `wp-block-categories__list wp-block-categories__list-level-${ level }`; - }; + const toggleAttribute = ( attributeName ) => ( newValue ) => setAttributes( { [ attributeName ]: newValue } ); + const renderCategoryName = ( name ) => ! name ? __( '(Untitled)' ) : unescape( name ).trim(); const renderCategoryList = () => { const parentId = showHierarchy ? 0 : null; const categoriesList = getCategoriesList( parentId ); - return ( - + return categoriesList.map( ( category ) => + renderCategoryListItem( category, 0 ) ); }; - const renderCategoryListItem = ( category, level ) => { + + const renderCategoryListItem = ( category ) => { const childCategories = getCategoriesList( category.id ); const { id, link, count, name } = category; return ( -
  • +
  • { renderCategoryName( name ) } - { showPostCounts && ( - - { ` (${ count })` } - - ) } + { showPostCounts && ` (${ count })` } { showHierarchy && !! childCategories.length && ( -