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.

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

[Block Editor]: Stabilize __experimentalGetPatternsByBlockTypes #47183

Merged
merged 1 commit into from
Jan 16, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
18 changes: 18 additions & 0 deletions docs/reference-guides/data/data-core-block-editor.md
Original file line number Diff line number Diff line change
Expand Up @@ -673,6 +673,24 @@ _Returns_

- `?string`: Adjacent block's client ID, or null if none exists.

### getPatternsByBlockTypes

Returns the list of patterns based on their declared `blockTypes`
and a block's name.
Patterns can use `blockTypes` to integrate in work flows like
suggesting appropriate patterns in a Placeholder state(during insertion)
or blocks transformations.

_Parameters_

- _state_ `Object`: Editor state.
- _blockNames_ `string|string[]`: Block's name or array of block names to find matching pattens.
- _rootClientId_ `?string`: Optional target root client ID.

_Returns_

- `Array`: The list of matched block patterns based on declared `blockTypes` and block name.

### getPreviousBlockClientId

Returns the previous block's client ID from the given reference start ID.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ function usePatternsSetup( clientId, blockName, filterPatternsFn ) {
( select ) => {
const {
getBlockRootClientId,
__experimentalGetPatternsByBlockTypes,
getPatternsByBlockTypes,
__experimentalGetAllowedPatterns,
} = select( blockEditorStore );
const rootClientId = getBlockRootClientId( clientId );
Expand All @@ -22,10 +22,7 @@ function usePatternsSetup( clientId, blockName, filterPatternsFn ) {
filterPatternsFn
);
}
return __experimentalGetPatternsByBlockTypes(
blockName,
rootClientId
);
return getPatternsByBlockTypes( blockName, rootClientId );
},
[ clientId, blockName, filterPatternsFn ]
);
Expand Down
30 changes: 24 additions & 6 deletions packages/block-editor/src/store/selectors.js
Original file line number Diff line number Diff line change
Expand Up @@ -2313,7 +2313,7 @@ export const __experimentalGetAllowedPatterns = createSelector(
*
* @return {Array} The list of matched block patterns based on declared `blockTypes` and block name.
*/
export const __experimentalGetPatternsByBlockTypes = createSelector(
export const getPatternsByBlockTypes = createSelector(
( state, blockNames, rootClientId = null ) => {
if ( ! blockNames ) return EMPTY_ARRAY;
const patterns = __experimentalGetAllowedPatterns(
Expand All @@ -2337,6 +2337,27 @@ export const __experimentalGetPatternsByBlockTypes = createSelector(
]
);

export const __experimentalGetPatternsByBlockTypes = createSelector(
( state, blockNames, rootClientId = null ) => {
deprecated(
'wp.data.select( "core/block-editor" ).__experimentalGetPatternsByBlockTypes',
{
alternative:
'wp.data.select( "core/block-editor" ).getPatternsByBlockTypes',
since: '6.2',
version: '6.4',
}
);
return getPatternsByBlockTypes( state, blockNames, rootClientId );
},
( state, blockNames, rootClientId ) => [
...__experimentalGetAllowedPatterns.getDependants(
state,
rootClientId
),
]
);

/**
* Determines the items that appear in the available pattern transforms list.
*
Expand Down Expand Up @@ -2384,17 +2405,14 @@ export const __experimentalGetPatternTransformItems = createSelector(
* block pattern's blocks and try to find matches from the selected blocks.
* Now this happens in the consumer to avoid heavy operations in the selector.
*/
return __experimentalGetPatternsByBlockTypes(
return getPatternsByBlockTypes(
state,
selectedBlockNames,
rootClientId
);
},
( state, blocks, rootClientId ) => [
...__experimentalGetPatternsByBlockTypes.getDependants(
state,
rootClientId
),
...getPatternsByBlockTypes.getDependants( state, rootClientId ),
]
);

Expand Down
17 changes: 6 additions & 11 deletions packages/block-editor/src/store/test/selectors.js
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ const {
__experimentalGetActiveBlockIdByBlockNames: getActiveBlockIdByBlockNames,
__experimentalGetAllowedPatterns,
__experimentalGetParsedPattern,
__experimentalGetPatternsByBlockTypes,
getPatternsByBlockTypes,
__unstableGetClientIdWithClientIdsTree,
__unstableGetClientIdsTree,
__experimentalGetPatternTransformItems,
Expand Down Expand Up @@ -4223,7 +4223,7 @@ describe( 'selectors', () => {
);
} );
} );
describe( '__experimentalGetPatternsByBlockTypes', () => {
describe( 'getPatternsByBlockTypes', () => {
const state = {
blocks: {
byClientId: new Map(
Expand Down Expand Up @@ -4263,22 +4263,17 @@ describe( 'selectors', () => {
},
};
it( 'should return empty array if no block name is provided', () => {
expect( __experimentalGetPatternsByBlockTypes( state ) ).toEqual(
[]
);
expect( getPatternsByBlockTypes( state ) ).toEqual( [] );
} );
it( 'shoud return empty array if no match is found', () => {
const patterns = __experimentalGetPatternsByBlockTypes(
const patterns = getPatternsByBlockTypes(
state,
'test/block-not-exists'
);
expect( patterns ).toEqual( [] );
} );
it( 'should return proper results when there are matched block patterns', () => {
const patterns = __experimentalGetPatternsByBlockTypes(
state,
'test/block-a'
);
const patterns = getPatternsByBlockTypes( state, 'test/block-a' );
expect( patterns ).toHaveLength( 2 );
expect( patterns ).toEqual(
expect.arrayContaining( [
Expand All @@ -4288,7 +4283,7 @@ describe( 'selectors', () => {
);
} );
it( 'should return proper result with matched patterns and allowed blocks from rootClientId', () => {
const patterns = __experimentalGetPatternsByBlockTypes(
const patterns = getPatternsByBlockTypes(
state,
'test/block-a',
'block1'
Expand Down
12 changes: 4 additions & 8 deletions packages/block-library/src/query/edit/query-placeholder.js
Original file line number Diff line number Diff line change
Expand Up @@ -34,19 +34,15 @@ export default function QueryPlaceholder( {
const { blockType, allVariations, hasPatterns } = useSelect(
( select ) => {
const { getBlockVariations, getBlockType } = select( blocksStore );
const {
getBlockRootClientId,
__experimentalGetPatternsByBlockTypes,
} = select( blockEditorStore );
const { getBlockRootClientId, getPatternsByBlockTypes } =
select( blockEditorStore );
const rootClientId = getBlockRootClientId( clientId );

return {
blockType: getBlockType( name ),
allVariations: getBlockVariations( name ),
hasPatterns: !! __experimentalGetPatternsByBlockTypes(
name,
rootClientId
).length,
hasPatterns: !! getPatternsByBlockTypes( name, rootClientId )
.length,
};
},
[ name, clientId ]
Expand Down
11 changes: 3 additions & 8 deletions packages/block-library/src/query/edit/query-toolbar.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,15 +24,10 @@ export default function QueryToolbar( {
} ) {
const hasPatterns = useSelect(
( select ) => {
const {
getBlockRootClientId,
__experimentalGetPatternsByBlockTypes,
} = select( blockEditorStore );
const { getBlockRootClientId, getPatternsByBlockTypes } =
select( blockEditorStore );
const rootClientId = getBlockRootClientId( clientId );
return !! __experimentalGetPatternsByBlockTypes(
name,
rootClientId
).length;
return !! getPatternsByBlockTypes( name, rootClientId ).length;
},
[ name, clientId ]
);
Expand Down
11 changes: 3 additions & 8 deletions packages/block-library/src/query/utils.js
Original file line number Diff line number Diff line change
Expand Up @@ -247,15 +247,10 @@ export function useBlockNameForPatterns( clientId, attributes ) {
if ( ! activeVariationName ) {
return;
}
const {
getBlockRootClientId,
__experimentalGetPatternsByBlockTypes,
} = select( blockEditorStore );
const { getBlockRootClientId, getPatternsByBlockTypes } =
select( blockEditorStore );
const rootClientId = getBlockRootClientId( clientId );
return __experimentalGetPatternsByBlockTypes(
blockName,
rootClientId
);
return getPatternsByBlockTypes( blockName, rootClientId );
},
[ clientId, activeVariationName ]
);
Expand Down
11 changes: 3 additions & 8 deletions packages/block-library/src/template-part/edit/utils/hooks.js
Original file line number Diff line number Diff line change
Expand Up @@ -83,15 +83,10 @@ export function useAlternativeBlockPatterns( area, clientId ) {
const blockNameWithArea = area
? `core/template-part/${ area }`
: 'core/template-part';
const {
getBlockRootClientId,
__experimentalGetPatternsByBlockTypes,
} = select( blockEditorStore );
const { getBlockRootClientId, getPatternsByBlockTypes } =
select( blockEditorStore );
const rootClientId = getBlockRootClientId( clientId );
return __experimentalGetPatternsByBlockTypes(
blockNameWithArea,
rootClientId
);
return getPatternsByBlockTypes( blockNameWithArea, rootClientId );
},
[ area, clientId ]
);
Expand Down
8 changes: 2 additions & 6 deletions packages/edit-post/src/components/start-page-options/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -23,15 +23,11 @@ function useStartPatterns() {
// the current post type is part of the postTypes declared.
const { blockPatternsWithPostContentBlockType, postType } = useSelect(
( select ) => {
const { __experimentalGetPatternsByBlockTypes } =
select( blockEditorStore );
const { getPatternsByBlockTypes } = select( blockEditorStore );
const { getCurrentPostType } = select( editorStore );
return {
// get pa
blockPatternsWithPostContentBlockType:
__experimentalGetPatternsByBlockTypes(
'core/post-content'
),
getPatternsByBlockTypes( 'core/post-content' ),
postType: getCurrentPostType(),
};
},
Expand Down