diff --git a/packages/block-editor/src/components/block-list/block.js b/packages/block-editor/src/components/block-list/block.js index ef1f48c8e559e8..5d143e4925fa2e 100644 --- a/packages/block-editor/src/components/block-list/block.js +++ b/packages/block-editor/src/components/block-list/block.js @@ -6,7 +6,12 @@ import classnames from 'classnames'; /** * WordPress dependencies */ -import { useState, createContext, useMemo } from '@wordpress/element'; +import { + useState, + createContext, + useMemo, + useCallback, +} from '@wordpress/element'; import { getBlockType, getSaveElement, @@ -105,7 +110,7 @@ function BlockListBlock( { [ clientId ] ); const { removeBlock } = useDispatch( 'core/block-editor' ); - const onRemove = () => removeBlock( clientId ); + const onRemove = useCallback( () => removeBlock( clientId ), [ clientId ] ); // Handling the error state const [ hasError, setErrorState ] = useState( false ); diff --git a/packages/edit-post/src/components/sidebar/post-link/index.js b/packages/edit-post/src/components/sidebar/post-link/index.js index 5bf5b6bba6997b..3a73af2e6da7dd 100644 --- a/packages/edit-post/src/components/sidebar/post-link/index.js +++ b/packages/edit-post/src/components/sidebar/post-link/index.js @@ -23,26 +23,30 @@ function PostLink( { onTogglePanel, isEditable, postLink, - permalinkParts, + permalinkPrefix, + permalinkSuffix, editPermalink, forceEmptyField, setState, postSlug, postTypeLabel, } ) { - const { prefix, suffix } = permalinkParts; let prefixElement, postNameElement, suffixElement; if ( isEditable ) { - prefixElement = prefix && ( - { prefix } + prefixElement = permalinkPrefix && ( + + { permalinkPrefix } + ); postNameElement = postSlug && ( { postSlug } ); - suffixElement = suffix && ( - { suffix } + suffixElement = permalinkSuffix && ( + + { permalinkSuffix } + ); } @@ -137,21 +141,24 @@ export default compose( [ const postTypeName = getEditedPostAttribute( 'type' ); const postType = getPostType( postTypeName ); + const permalinkParts = getPermalinkParts(); return { postLink: link, isEditable: isPermalinkEditable(), isPublished: isCurrentPostPublished(), isOpened: isEditorPanelOpened( PANEL_NAME ), - permalinkParts: getPermalinkParts(), isEnabled: isEditorPanelEnabled( PANEL_NAME ), isViewable: get( postType, [ 'viewable' ], false ), postSlug: safeDecodeURIComponent( getEditedPostSlug() ), postTypeLabel: get( postType, [ 'labels', 'view_item' ] ), + hasPermalinkParts: !! permalinkParts, + permalinkPrefix: permalinkParts?.prefix, + permalinkSuffix: permalinkParts?.suffix, }; } ), - ifCondition( ( { isEnabled, postLink, isViewable, permalinkParts } ) => { - return isEnabled && postLink && isViewable && permalinkParts; + ifCondition( ( { isEnabled, postLink, isViewable, hasPermalinkParts } ) => { + return isEnabled && postLink && isViewable && hasPermalinkParts; } ), withDispatch( ( dispatch ) => { const { toggleEditorPanelOpened } = dispatch( 'core/edit-post' );