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' );