From f9ed8226bfa282c1eed7e8b1662b5fef2117a342 Mon Sep 17 00:00:00 2001 From: karthick-murugan Date: Fri, 20 Dec 2024 12:48:53 +0530 Subject: [PATCH] Update Snackbar messages for copy event --- .../src/components/block-actions/index.js | 3 - .../block-settings-dropdown.js | 18 +++- .../block-editor/src/utils/use-notify-copy.js | 94 ++++++++++--------- 3 files changed, 67 insertions(+), 48 deletions(-) diff --git a/packages/block-editor/src/components/block-actions/index.js b/packages/block-editor/src/components/block-actions/index.js index f06c8addedad50..30038522df0edb 100644 --- a/packages/block-editor/src/components/block-actions/index.js +++ b/packages/block-editor/src/components/block-actions/index.js @@ -11,7 +11,6 @@ import { /** * Internal dependencies */ -import { useNotifyCopy } from '../../utils/use-notify-copy'; import usePasteStyles from '../use-paste-styles'; import { store as blockEditorStore } from '../../store'; @@ -76,7 +75,6 @@ export default function BlockActions( { flashBlock, } = useDispatch( blockEditorStore ); - const notifyCopy = useNotifyCopy(); const pasteStyles = usePasteStyles(); return children( { @@ -130,7 +128,6 @@ export default function BlockActions( { if ( clientIds.length === 1 ) { flashBlock( clientIds[ 0 ] ); } - notifyCopy( 'copy', clientIds ); }, async onPasteStyles() { await pasteStyles( getBlocksByClientId( clientIds ) ); diff --git a/packages/block-editor/src/components/block-settings-menu/block-settings-dropdown.js b/packages/block-editor/src/components/block-settings-menu/block-settings-dropdown.js index ade9ddd5ec1657..43922c28a668e2 100644 --- a/packages/block-editor/src/components/block-settings-menu/block-settings-dropdown.js +++ b/packages/block-editor/src/components/block-settings-menu/block-settings-dropdown.js @@ -26,17 +26,30 @@ import BlockSettingsMenuControls from '../block-settings-menu-controls'; import BlockParentSelectorMenuItem from './block-parent-selector-menu-item'; import { store as blockEditorStore } from '../../store'; import { unlock } from '../../lock-unlock'; +import { useNotifyCopy } from '../../utils/use-notify-copy'; const POPOVER_PROPS = { className: 'block-editor-block-settings-menu__popover', placement: 'bottom-start', }; -function CopyMenuItem( { clientIds, onCopy, label, shortcut } ) { +function CopyMenuItem( { + clientIds, + onCopy, + label, + shortcut, + eventType = 'copy', +} ) { const { getBlocksByClientId } = useSelect( blockEditorStore ); + const notifyCopy = useNotifyCopy(); const ref = useCopyToClipboard( () => serialize( getBlocksByClientId( clientIds ) ), - onCopy + () => { + if ( onCopy && eventType === 'copy' ) { + onCopy(); + } + notifyCopy( eventType, clientIds ); + } ); const copyMenuItemLabel = label ? label : __( 'Copy' ); return ( @@ -305,6 +318,7 @@ export function BlockSettingsDropdown( { clientIds={ clientIds } onCopy={ onCopy } label={ __( 'Copy styles' ) } + eventType="copyStyles" /> { __( 'Paste styles' ) } diff --git a/packages/block-editor/src/utils/use-notify-copy.js b/packages/block-editor/src/utils/use-notify-copy.js index 0f98577f11bf65..51742f476a5fd2 100644 --- a/packages/block-editor/src/utils/use-notify-copy.js +++ b/packages/block-editor/src/utils/use-notify-copy.js @@ -17,47 +17,55 @@ export function useNotifyCopy() { const { getBlockType } = useSelect( blocksStore ); const { createSuccessNotice } = useDispatch( noticesStore ); - return useCallback( ( eventType, selectedBlockClientIds ) => { - let notice = ''; - if ( selectedBlockClientIds.length === 1 ) { - const clientId = selectedBlockClientIds[ 0 ]; - const title = getBlockType( getBlockName( clientId ) )?.title; - notice = - eventType === 'copy' - ? sprintf( - // Translators: Name of the block being copied, e.g. "Paragraph". - __( 'Copied "%s" to clipboard.' ), - title - ) - : sprintf( - // Translators: Name of the block being cut, e.g. "Paragraph". - __( 'Moved "%s" to clipboard.' ), - title - ); - } else { - notice = - eventType === 'copy' - ? sprintf( - // Translators: %d: Number of blocks being copied. - _n( - 'Copied %d block to clipboard.', - 'Copied %d blocks to clipboard.', - selectedBlockClientIds.length - ), - selectedBlockClientIds.length - ) - : sprintf( - // Translators: %d: Number of blocks being cut. - _n( - 'Moved %d block to clipboard.', - 'Moved %d blocks to clipboard.', - selectedBlockClientIds.length - ), - selectedBlockClientIds.length - ); - } - createSuccessNotice( notice, { - type: 'snackbar', - } ); - }, [] ); + return useCallback( + ( eventType, selectedBlockClientIds ) => { + let notice = ''; + + if ( eventType === 'copyStyles' ) { + notice = __( 'Styles copied to clipboard.' ); + } else if ( selectedBlockClientIds.length === 1 ) { + const clientId = selectedBlockClientIds[ 0 ]; + const title = getBlockType( getBlockName( clientId ) )?.title; + + if ( eventType === 'copy' ) { + notice = sprintf( + // Translators: Name of the block being copied, e.g. "Paragraph". + __( 'Copied "%s" to clipboard.' ), + title + ); + } else { + notice = sprintf( + // Translators: Name of the block being cut, e.g. "Paragraph". + __( 'Moved "%s" to clipboard.' ), + title + ); + } + } else if ( eventType === 'copy' ) { + notice = sprintf( + // Translators: %d: Number of blocks being copied. + _n( + 'Copied %d block to clipboard.', + 'Copied %d blocks to clipboard.', + selectedBlockClientIds.length + ), + selectedBlockClientIds.length + ); + } else { + notice = sprintf( + // Translators: %d: Number of blocks being moved. + _n( + 'Moved %d block to clipboard.', + 'Moved %d blocks to clipboard.', + selectedBlockClientIds.length + ), + selectedBlockClientIds.length + ); + } + + createSuccessNotice( notice, { + type: 'snackbar', + } ); + }, + [ createSuccessNotice, getBlockName, getBlockType ] + ); }