Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Patterns: update the title of Pattern block in the block inspector card #52010

Merged
merged 9 commits into from
Jul 12, 2023
Merged

Patterns: update the title of Pattern block in the block inspector card #52010

Show file tree
Hide file tree
Changes from 7 commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
dbcd8cb
Update the title of Pattern block in the block inspector card to indi…
glendaviesnz Jun 28, 2023
c314e29
Update comment
glendaviesnz Jun 28, 2023
f66e163
Show the pattern title in inspector block card
glendaviesnz Jul 10, 2023
06535a7
Allow for title being undefined while block is still saving
glendaviesnz Jul 10, 2023
0dbc127
Fix ternary
glendaviesnz Jul 10, 2023
918427b
rebase
glendaviesnz Jul 11, 2023
9ff50d8
Update block description
glendaviesnz Jul 11, 2023
f800546
Tidy up title assignment
glendaviesnz Jul 11, 2023
3e92024
Remove duplicate use of isReusable block
glendaviesnz Jul 11, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion docs/reference-guides/core-blocks.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ Add a user’s avatar. ([Source](https://github.com/WordPress/gutenberg/tree/tru

## Pattern

Create and save content to reuse across your site. Update the block, and the changes apply everywhere it’s used. ([Source](https://github.com/WordPress/gutenberg/tree/trunk/packages/block-library/src/block))
Create and save content to reuse across your site. Update the pattern, and the changes apply everywhere it’s used. ([Source](https://github.com/WordPress/gutenberg/tree/trunk/packages/block-library/src/block))

- **Name:** core/block
- **Category:** reusable
Expand Down
19 changes: 14 additions & 5 deletions packages/block-editor/src/components/use-block-display-information/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -67,21 +67,30 @@ export default function useBlockDisplayInformation( clientId ) {
return useSelect(
( select ) => {
if ( ! clientId ) return null;
const { getBlockName, getBlockAttributes } =
select( blockEditorStore );
const {
getBlockName,
getBlockAttributes,
__experimentalGetReusableBlockTitle,
} = select( blockEditorStore );
const { getBlockType, getActiveBlockVariation } =
select( blocksStore );
const blockName = getBlockName( clientId );
const blockType = getBlockType( blockName );
if ( ! blockType ) return null;
let title = blockType.title;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will the title property always be present on the object?

const attributes = getBlockAttributes( clientId );
const match = getActiveBlockVariation( blockName, attributes );
const isSynced =
isReusableBlock( blockType ) || isTemplatePart( blockType );
const isReusable = isReusableBlock( blockType );
if ( isReusable ) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Totally optional, but maybe this condition could be rejigged a bit.

blockType.title is already assigned to the title var.

What about

const resusableTitle = isReusableBlock( blockType ) ? __experimentalGetReusableBlockTitle( attributes.ref ) : '';
const title = resusableTitle || blockType?.title;

Copy link
Contributor Author

@glendaviesnz glendaviesnz Jul 11, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Seemed like the ternary needed to be set to undefined not '' if not reusable, but maybe I am missing something, eg.

const resusableTitle = isReusable ? __experimentalGetReusableBlockTitle( attributes.ref ) : undefined;
const title = resusableTitle || blockType.title;

also on line 79 the function returns early if blockType is not defined, so the optional chaining is not needed for blockType.title - but have otherwise made that change as it is a bit tidier if you want to double check it @ramonjd

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Seemed like the ternary needed to be set to undefined not '' if not reusable, but maybe I am missing something

Sounds good. My example was "unrehearsed".

I retested and it works as advertised. Thanks @glendaviesnz !

title =
__experimentalGetReusableBlockTitle( attributes.ref ) ||
blockType.title;
}
const isSynced = isReusable || isTemplatePart( blockType );
const positionLabel = getPositionTypeLabel( attributes );
const blockTypeInfo = {
isSynced,
title: blockType.title,
title,
icon: blockType.icon,
description: blockType.description,
anchor: attributes?.anchor,
Expand Down
2 changes: 1 addition & 1 deletion packages/block-library/src/block/block.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
"name": "core/block",
"title": "Pattern",
"category": "reusable",
"description": "Create and save content to reuse across your site. Update the block, and the changes apply everywhere it’s used.",
"description": "Create and save content to reuse across your site. Update the pattern, and the changes apply everywhere it’s used.",
"textdomain": "default",
"attributes": {
"ref": {
Expand Down
2 changes: 1 addition & 1 deletion packages/e2e-tests/specs/editor/various/reusable-blocks.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -352,7 +352,7 @@ describe( 'Reusable blocks', () => {
expect( reusableBlockWithParagraph ).toBeTruthy();

// Convert back to regular blocks.
await clickBlockToolbarButton( 'Select Pattern' );
await clickBlockToolbarButton( 'Select Edited block' );
await clickBlockToolbarButton( 'Detach pattern' );
await page.waitForXPath( selector, {
hidden: true,
Expand Down
Loading