diff --git a/packages/block-library/src/template-part/edit/placeholder/index.js b/packages/block-library/src/template-part/edit/placeholder/index.js index 8de0d6e731fa6..b19fe0f74ea32 100644 --- a/packages/block-library/src/template-part/edit/placeholder/index.js +++ b/packages/block-library/src/template-part/edit/placeholder/index.js @@ -1,13 +1,18 @@ +/** + * External dependencies + */ +import { find } from 'lodash'; + /** * WordPress dependencies */ -import { __ } from '@wordpress/i18n'; +import { __, sprintf } from '@wordpress/i18n'; import { useCallback, useState } from '@wordpress/element'; -import { useDispatch } from '@wordpress/data'; +import { useDispatch, useSelect } from '@wordpress/data'; import { Placeholder, Dropdown, Button } from '@wordpress/components'; -import { blockDefault } from '@wordpress/icons'; import { serialize } from '@wordpress/blocks'; import { store as coreStore } from '@wordpress/core-data'; +import { store as editorStore } from '@wordpress/editor'; /** * Internal dependencies @@ -28,6 +33,23 @@ export default function TemplatePartPlaceholder( { const { saveEntityRecord } = useDispatch( coreStore ); const [ step, setStep ] = useState( PLACEHOLDER_STEPS.initial ); + const { areaIcon, areaLabel } = useSelect( + ( select ) => { + const definedAreas = select( + editorStore + ).__experimentalGetDefaultTemplatePartAreas(); + + const selectedArea = find( definedAreas, { area } ); + const defaultArea = find( definedAreas, { area: 'uncategorized' } ); + + return { + areaIcon: selectedArea?.icon || defaultArea?.icon, + areaLabel: selectedArea?.label || __( 'Template Part' ), + }; + }, + [ area ] + ); + const onCreate = useCallback( async ( startingBlocks = [] ) => { const title = __( 'Untitled Template Part' ); @@ -61,10 +83,12 @@ export default function TemplatePartPlaceholder( { <> { step === PLACEHOLDER_STEPS.initial && ( - { __( 'New template part' ) } + { sprintf( + // Translators: %s as template part area title ("Header", "Footer", etc.). + 'New %s', + areaLabel.toLowerCase() + ) } ) }