Blocks: refactor deletion warnings dialog #58952
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,92 @@ | ||
| /** | ||
| * WordPress dependencies | ||
| */ | ||
|
|
||
| import { _n } from '@wordpress/i18n'; | ||
| import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor'; | ||
| import { useSelect } from '@wordpress/data'; | ||
| import { useMemo } from '@wordpress/element'; | ||
|
|
||
| /** | ||
| * Internal dependencies | ||
| */ | ||
| import { unlock } from '../../lock-unlock'; | ||
| import { store as editorStore } from '../../store'; | ||
|
|
||
| const { BlockRemovalWarningModal } = unlock( blockEditorPrivateApis ); | ||
|
|
||
| // Prevent accidental removal of certain blocks, asking the user for confirmation first. | ||
| const TEMPLATE_BLOCKS = [ | ||
| 'core/post-content', | ||
| 'core/post-template', | ||
| 'core/query', | ||
| ]; | ||
| const BLOCK_REMOVAL_RULES = [ | ||
| { | ||
| // Template blocks. | ||
| // The warning is only shown when a user manipulates templates or template parts. | ||
| postTypes: [ 'wp_template', 'wp_template_part' ], | ||
|
There was a problem hiding this comment. Not sure if this message needs to display when editing any other post types than the ones specified here? Or maybe it should be universal (happens for any post type). |
||
| callback( removedBlocks ) { | ||
| const removedTemplateBlocks = removedBlocks.filter( ( { name } ) => | ||
| TEMPLATE_BLOCKS.includes( name ) | ||
| ); | ||
| if ( removedTemplateBlocks.length ) { | ||
| return _n( | ||
| 'Deleting this block will stop your post or page content from displaying on this template. It is not recommended.', | ||
| 'Some of the deleted blocks will stop your post or page content from displaying on this template. It is not recommended.', | ||
|
There was a problem hiding this comment. I revised the copy that was in We could also go through all the permutations to make sure the messaging is completely correct, but I thought this would be sufficient. |
||
| removedBlocks.length | ||
| ); | ||
| } | ||
| }, | ||
| }, | ||
| { | ||
| // Pattern overrides. | ||
| // The warning is only shown when the user edits a pattern. | ||
| postTypes: [ 'wp_block' ], | ||
| callback( removedBlocks ) { | ||
| const removedBlocksWithOverrides = removedBlocks.filter( | ||
| ( { attributes } ) => | ||
| attributes?.metadata?.bindings && | ||
| Object.values( attributes.metadata.bindings ).some( | ||
| ( binding ) => | ||
| binding.source === 'core/pattern-overrides' | ||
| ) | ||
| ); | ||
| if ( removedBlocksWithOverrides.length ) { | ||
| return _n( | ||
| 'The deleted block allows instance overrides. Removing it may result in content not displaying where this pattern is used. Are you sure you want to proceed?', | ||
| 'Some of the deleted blocks allow instance overrides. Removing them may result in content not displaying where this pattern is used. Are you sure you want to proceed?', | ||
| removedBlocks.length | ||
| ); | ||
| } | ||
| }, | ||
| }, | ||
| ]; | ||
|
|
||
| export default function BlockRemovalWarnings() { | ||
| const currentPostType = useSelect( | ||
| ( select ) => select( editorStore ).getCurrentPostType(), | ||
| [] | ||
| ); | ||
|
|
||
| const removalRulesForPostType = useMemo( | ||
| () => | ||
| BLOCK_REMOVAL_RULES.filter( ( rule ) => | ||
| rule.postTypes.includes( currentPostType ) | ||
| ), | ||
| [ currentPostType ] | ||
| ); | ||
|
|
||
| // `BlockRemovalWarnings` is rendered in the editor provider, a shared component | ||
| // across react native and web. However, `BlockRemovalWarningModal` is web only. | ||
| // Check it exists before trying to render it. | ||
| if ( ! BlockRemovalWarningModal ) { | ||
| return null; | ||
| } | ||
|
|
||
| if ( ! removalRulesForPostType ) { | ||
| return null; | ||
| } | ||
|
|
||
| return <BlockRemovalWarningModal rules={ removalRulesForPostType } />; | ||
| } | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Do we still want to keep this component in "block-editor"?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ok with moving it, but then we still have the private actions, selectors and reducers for block removal warnings in the block editor package that are all the same family of APIs. I feel like it makes sense to keep those things together.
We could consider gradually moving it all across, but it'd mean changing how this feature integrates with the
removeBlocksaction pretty significantly. Will have a think about whether that's possible.There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ok, let's keep it then :)