More fixes and backports for WP 5.8 beta 4

lib/init.php

@@ -187,6 +187,33 @@ function register_site_icon_url( $response ) {
 
 add_filter( 'rest_index', 'register_site_icon_url' );
 
+/**
+ * Exposes the site logo to the Gutenberg editor through the WordPress REST
+ * API. This is used for fetching this information when user has no rights
+ * to update settings.
+ *
+ * @since 10.9
+ *
+ * @param WP_REST_Response $response Response data served by the WordPress REST index endpoint.
+ * @return WP_REST_Response
+ */
+function register_site_logo_to_rest_index( $response ) {
+	$site_logo_id                = get_theme_mod( 'custom_logo' );
+	$response->data['site_logo'] = $site_logo_id;
+	if ( $site_logo_id ) {
+		$response->add_link(
+			'https://api.w.org/featuredmedia',
+			rest_url( 'wp/v2/media/' . $site_logo_id ),
+			array(
+				'embeddable' => true,
+			)
+		);
+	}
+	return $response;
+}
+
+add_filter( 'rest_index', 'register_site_logo_to_rest_index' );
+
 add_theme_support( 'widgets-block-editor' );
 
 /**

packages/block-editor/src/components/inserter/hooks/use-insertion-point.js

@@ -59,7 +59,7 @@ function useInsertionPoint( {
 			let _destinationRootClientId = rootClientId;
 			let _destinationIndex;
 
-			if ( insertionIndex ) {
+			if ( insertionIndex !== undefined ) {
 				// Insert into a specific index.
 				_destinationIndex = insertionIndex;
 			} else if ( clientId ) {

packages/block-editor/src/components/use-block-drop-zone/index.js

@@ -43,11 +43,6 @@ export function getNearestBlockIndex( elements, position, orientation ) {
 	let candidateDistance;
 
 	elements.forEach( ( element, index ) => {
-		// Ensure the element is a block. It should have the `wp-block` class.
-		if ( ! element.classList.contains( 'wp-block' ) ) {
-			return;
-		}
-
 		const rect = element.getBoundingClientRect();
 		const [ distance, edge ] = getDistanceToNearestEdge(
 			position,
@@ -105,7 +100,10 @@ export default function useBlockDropZone( {
 	const onBlockDrop = useOnBlockDrop( targetRootClientId, targetBlockIndex );
 	const throttled = useThrottle(
 		useCallback( ( event, currentTarget ) => {
-			const blockElements = Array.from( currentTarget.children );
+			const blockElements = Array.from( currentTarget.children ).filter(
+				// Ensure the element is a block. It should have the `wp-block` class.
+				( element ) => element.classList.contains( 'wp-block' )
+			);
 			const targetIndex = getNearestBlockIndex(
 				blockElements,
 				{ x: event.clientX, y: event.clientY },

packages/block-editor/src/components/use-block-drop-zone/test/index.js

@@ -83,22 +83,6 @@ describe( 'getNearestBlockIndex', () => {
 		expect( result ).toBeUndefined();
 	} );
 
-	it( 'returns `undefined` if the elements do not have the `wp-block` class', () => {
-		const nonBlockElements = [
-			{ classList: createMockClassList( 'some-other-class' ) },
-		];
-		const position = { x: 0, y: 0 };
-		const orientation = 'horizontal';
-
-		const result = getNearestBlockIndex(
-			nonBlockElements,
-			position,
-			orientation
-		);
-
-		expect( result ).toBeUndefined();
-	} );
-
 	describe( 'Vertical block lists', () => {
 		const orientation = 'vertical';
 

packages/block-library/src/categories/edit.js

@@ -28,7 +28,7 @@ export default function CategoriesEdit( {
 	const { categories, isRequesting } = useSelect( ( select ) => {
 		const { getEntityRecords } = select( coreStore );
 		const { isResolving } = select( 'core/data' );
-		const query = { per_page: -1, hide_empty: true };
+		const query = { per_page: -1, hide_empty: true, context: 'view' };
 		return {
 			categories: getEntityRecords( 'taxonomy', 'category', query ),
 			isRequesting: isResolving( 'core', 'getEntityRecords', [
@@ -151,15 +151,15 @@ export default function CategoriesEdit( {
 					<Spinner />
 				</Placeholder>
 			) }
-			{ ! isRequesting && categories.length === 0 && (
+			{ ! isRequesting && categories?.length === 0 && (
 				<p>
 					{ __(
 						'Your site does not have any posts, so there is nothing to display here at the moment.'
 					) }
 				</p>
 			) }
 			{ ! isRequesting &&
-				categories.length > 0 &&
+				categories?.length > 0 &&
 				( displayAsDropdown
 					? renderCategoryDropdown()
 					: renderCategoryList() ) }

packages/block-library/src/post-terms/edit.js

@@ -2,7 +2,6 @@
  * External dependencies
  */
 import classnames from 'classnames';
-import { find } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -21,7 +20,7 @@ import { store as coreStore } from '@wordpress/core-data';
 /**
  * Internal dependencies
  */
-import useTermLinks from './use-term-links';
+import usePostTerms from './use-post-terms';
 
 export default function PostTermsEdit( {
 	attributes,
@@ -34,28 +33,18 @@ export default function PostTermsEdit( {
 	const selectedTerm = useSelect(
 		( select ) => {
 			if ( ! term ) return {};
-			const taxonomies = select( coreStore ).getTaxonomies( {
-				per_page: -1,
-			} );
-			return (
-				find(
-					taxonomies,
-					( taxonomy ) =>
-						taxonomy.slug === term && taxonomy.visibility.show_ui
-				) || {}
-			);
+			const { getTaxonomy } = select( coreStore );
+			const taxonomy = getTaxonomy( term );
+			return taxonomy?.visibility?.show_ui ? taxonomy : {};
 		},
 		[ term ]
 	);
-
-	const { termLinks, isLoadingTermLinks } = useTermLinks( {
+	const { postTerms, hasPostTerms, isLoading } = usePostTerms( {
 		postId,
 		postType,
 		term: selectedTerm,
 	} );
-
 	const hasPost = postId && postType;
-	const hasTermLinks = termLinks && termLinks.length > 0;
 	const blockProps = useBlockProps( {
 		className: classnames( {
 			[ `has-text-align-${ textAlign }` ]: textAlign,
@@ -89,19 +78,22 @@ export default function PostTermsEdit( {
 				/>
 			</BlockControls>
 			<div { ...blockProps }>
-				{ isLoadingTermLinks && <Spinner /> }
-
-				{ hasTermLinks &&
-					! isLoadingTermLinks &&
-					termLinks.reduce( ( prev, curr ) => [
-						prev,
-						' | ',
-						curr,
-					] ) }
-
-				{ ! isLoadingTermLinks &&
-					! hasTermLinks &&
-					// eslint-disable-next-line camelcase
+				{ isLoading && <Spinner /> }
+				{ ! isLoading &&
+					hasPostTerms &&
+					postTerms
+						.map( ( postTerm ) => (
+							<a
+								key={ postTerm.id }
+								href={ postTerm.link }
+								onClick={ ( event ) => event.preventDefault() }
+							>
+								{ postTerm.name }
+							</a>
+						) )
+						.reduce( ( prev, curr ) => [ prev, ' | ', curr ] ) }
+				{ ! isLoading &&
+					! hasPostTerms &&
 					( selectedTerm?.labels?.no_terms ||
 						__( 'Term items not found.' ) ) }
 			</div>

packages/block-library/src/post-terms/use-post-terms.js

@@ -0,0 +1,38 @@
+/**
+ * WordPress dependencies
+ */
+import { useEntityProp, store as coreStore } from '@wordpress/core-data';
+import { useSelect } from '@wordpress/data';
+
+export default function usePostTerms( { postId, postType, term } ) {
+	const { rest_base: restBase, slug } = term;
+	const [ termIds ] = useEntityProp( 'postType', postType, restBase, postId );
+	return useSelect(
+		( select ) => {
+			if ( ! termIds ) {
+				// Waiting for post terms to be fetched.
+				return { isLoading: true };
+			}
+			if ( ! termIds.length ) {
+				return { isLoading: false };
+			}
+			const { getEntityRecords, isResolving } = select( coreStore );
+			const taxonomyArgs = [
+				'taxonomy',
+				slug,
+				{
+					include: termIds,
+					context: 'view',
+				},
+			];
+			const terms = getEntityRecords( ...taxonomyArgs );
+			const _isLoading = isResolving( 'getEntityRecords', taxonomyArgs );
+			return {
+				postTerms: terms,
+				isLoading: _isLoading,
+				hasPostTerms: !! terms?.length,
+			};
+		},
+		[ termIds ]
+	);
+}