diff --git a/packages/reusable-blocks/package.json b/packages/reusable-blocks/package.json
index 053f169e56128d..03baead86fe130 100644
--- a/packages/reusable-blocks/package.json
+++ b/packages/reusable-blocks/package.json
@@ -35,6 +35,7 @@
"@wordpress/i18n": "file:../i18n",
"@wordpress/icons": "file:../icons",
"@wordpress/notices": "file:../notices",
+ "@wordpress/url": "^2.19.0",
"lodash": "^4.17.19"
},
"publishConfig": {
diff --git a/packages/reusable-blocks/src/components/reusable-blocks-menu-items/index.js b/packages/reusable-blocks/src/components/reusable-blocks-menu-items/index.js
index ed68dd7fec7717..ce5883402896de 100644
--- a/packages/reusable-blocks/src/components/reusable-blocks-menu-items/index.js
+++ b/packages/reusable-blocks/src/components/reusable-blocks-menu-items/index.js
@@ -7,7 +7,7 @@ import { withSelect } from '@wordpress/data';
* Internal dependencies
*/
import ReusableBlockConvertButton from './reusable-block-convert-button';
-import ReusableBlockDeleteButton from './reusable-block-delete-button';
+import ReusableBlocksManageButton from './reusable-blocks-manage-button';
function ReusableBlocksMenuItems( { clientIds, rootClientId } ) {
return (
@@ -17,7 +17,7 @@ function ReusableBlocksMenuItems( { clientIds, rootClientId } ) {
rootClientId={ rootClientId }
/>
{ clientIds.length === 1 && (
-
+
) }
>
);
diff --git a/packages/reusable-blocks/src/components/reusable-blocks-menu-items/reusable-block-delete-button.js b/packages/reusable-blocks/src/components/reusable-blocks-menu-items/reusable-block-delete-button.js
deleted file mode 100644
index ac3abd0bb471cb..00000000000000
--- a/packages/reusable-blocks/src/components/reusable-blocks-menu-items/reusable-block-delete-button.js
+++ /dev/null
@@ -1,98 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { MenuItem } from '@wordpress/components';
-import { __ } from '@wordpress/i18n';
-import { isReusableBlock } from '@wordpress/blocks';
-import { useSelect, useDispatch } from '@wordpress/data';
-import { useCallback } from '@wordpress/element';
-import { BlockSettingsMenuControls } from '@wordpress/block-editor';
-
-/**
- * Internal dependencies
- */
-import { store } from '../../store';
-
-function ReusableBlockDeleteButton( { clientId } ) {
- const { isVisible, isDisabled, block } = useSelect(
- ( select ) => {
- const { getBlock } = select( 'core/block-editor' );
- const { canUser } = select( 'core' );
- const blockObj = getBlock( clientId );
-
- const reusableBlock =
- blockObj && isReusableBlock( blockObj )
- ? select( 'core' ).getEntityRecord(
- 'postType',
- 'wp_block',
- blockObj.attributes.ref
- )
- : null;
-
- return {
- block: blockObj,
- isVisible:
- !! reusableBlock &&
- ( reusableBlock.isTemporary ||
- !! canUser( 'delete', 'blocks', reusableBlock.id ) ),
- isDisabled: reusableBlock && reusableBlock.isTemporary,
- };
- },
- [ clientId ]
- );
-
- const {
- __experimentalDeleteReusableBlock: deleteReusableBlock,
- } = useDispatch( store );
-
- const { createSuccessNotice, createErrorNotice } = useDispatch(
- 'core/notices'
- );
- const onDelete = useCallback(
- async function () {
- try {
- await deleteReusableBlock( block.attributes.ref );
- createSuccessNotice( __( 'Block deleted.' ), {
- type: 'snackbar',
- } );
- } catch ( error ) {
- createErrorNotice( error.message, {
- type: 'snackbar',
- } );
- }
- },
- [ block ]
- );
-
- if ( ! isVisible ) {
- return null;
- }
-
- return (
-
- { ( { onClose } ) => (
-
- ) }
-
- );
-}
-
-export default ReusableBlockDeleteButton;
diff --git a/packages/reusable-blocks/src/components/reusable-blocks-menu-items/reusable-blocks-manage-button.js b/packages/reusable-blocks/src/components/reusable-blocks-menu-items/reusable-blocks-manage-button.js
new file mode 100644
index 00000000000000..4357a43bc8dd98
--- /dev/null
+++ b/packages/reusable-blocks/src/components/reusable-blocks-menu-items/reusable-blocks-manage-button.js
@@ -0,0 +1,55 @@
+/**
+ * WordPress dependencies
+ */
+import { MenuItem } from '@wordpress/components';
+import { __ } from '@wordpress/i18n';
+import { isReusableBlock } from '@wordpress/blocks';
+import { useSelect } from '@wordpress/data';
+import { BlockSettingsMenuControls } from '@wordpress/block-editor';
+import { addQueryArgs } from '@wordpress/url';
+
+function ReusableBlocksManageButton( { clientId } ) {
+ const { isVisible } = useSelect(
+ ( select ) => {
+ const { getBlock } = select( 'core/block-editor' );
+ const { canUser } = select( 'core' );
+ const blockObj = getBlock( clientId );
+
+ const reusableBlock =
+ blockObj && isReusableBlock( blockObj )
+ ? select( 'core' ).getEntityRecord(
+ 'postType',
+ 'wp_block',
+ blockObj.attributes.ref
+ )
+ : null;
+
+ return {
+ isVisible:
+ !! reusableBlock &&
+ !! canUser( 'update', 'blocks', reusableBlock.id ),
+ };
+ },
+ [ clientId ]
+ );
+
+ if ( ! isVisible ) {
+ return null;
+ }
+
+ return (
+
+
+
+ );
+}
+
+export default ReusableBlocksManageButton;