Skip to content

Commit

Permalink
Add getClientIdsTreeWithBlockEditingMode()
Browse files Browse the repository at this point in the history
  • Loading branch information
noisysocks committed Jun 15, 2023
1 parent 8df14fb commit 9179abb
Show file tree
Hide file tree
Showing 5 changed files with 238 additions and 28 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -10,37 +10,26 @@ import { useSelect } from '@wordpress/data';
import { store as blockEditorStore } from '../../store';
import { unlock } from '../../lock-unlock';

const NON_DISABLED_EDITING_MODES = [ 'default', 'contentOnly' ];

export default function useListViewClientIds( { blocks, rootClientId } ) {
return useSelect(
( select ) => {
const {
getDraggedBlockClientIds,
getSelectedBlockClientIds,
__unstableGetClientIdsTree,
getBlockEditingMode,
getClientIdsTreeWithBlockEditingMode,
} = unlock( select( blockEditorStore ) );

const removeDisabledBlocks = ( tree ) => {
return tree.flatMap( ( { clientId, innerBlocks, ...rest } ) => {
if ( getBlockEditingMode( clientId ) === 'disabled' ) {
return removeDisabledBlocks( innerBlocks );
}
return [
{
clientId,
innerBlocks: removeDisabledBlocks( innerBlocks ),
...rest,
},
];
} );
};

return {
selectedClientIds: getSelectedBlockClientIds(),
draggedClientIds: getDraggedBlockClientIds(),
clientIdsTree: removeDisabledBlocks(
blocks ?? __unstableGetClientIdsTree( rootClientId )
),
clientIdsTree:
blocks ??
getClientIdsTreeWithBlockEditingMode(
NON_DISABLED_EDITING_MODES,
rootClientId
),
};
},
[ blocks, rootClientId ]
Expand Down
44 changes: 44 additions & 0 deletions packages/block-editor/src/store/private-selectors.js
Original file line number Diff line number Diff line change
Expand Up @@ -135,3 +135,47 @@ export const isBlockSubtreeDisabled = createSelector(
},
( state ) => [ state.blockEditingModes, state.blocks.parents ]
);

/**
* Returns a tree of block objects with only clientID and innerBlocks set. Only
* blocks with the given editing mode are included in the tree.
*
* @param {Object} state Global application state.
* @param {BlockEditingMode|BlockEditingMode[]} mode The editing mode(s)
* to filter by.
* @param {?string} rootClientId Optional root
* client ID of block
* list.
*
* @return {Object[]} Tree of block objects with only clientID and innerBlocks set.
*/
export const getClientIdsTreeWithBlockEditingMode = createSelector(
( state, mode, rootClientId = '' ) => {
const modes = Array.isArray( mode ) ? mode : [ mode ];
return getBlockOrder( state, rootClientId ).flatMap( ( clientId ) => {
if ( modes.includes( getBlockEditingMode( state, clientId ) ) ) {
return [
{
clientId,
innerBlocks: getClientIdsTreeWithBlockEditingMode(
state,
mode,
clientId
),
},
];
}
return getClientIdsTreeWithBlockEditingMode(
state,
mode,
clientId
);
} );
},
( state ) => [
state.blocks.order,
state.blockEditingModes,
state.settings.templateLock,
state.blockListSettings,
]
);
35 changes: 28 additions & 7 deletions packages/block-editor/src/store/selectors.js
Original file line number Diff line number Diff line change
Expand Up @@ -187,16 +187,27 @@ export function getBlocks( state, rootClientId ) {
* Returns a stripped down block object containing only its client ID,
* and its inner blocks' client IDs.
*
* @deprecated
*
* @param {Object} state Editor state.
* @param {string} clientId Client ID of the block to get.
*
* @return {Object} Client IDs of the post blocks.
*/
export const __unstableGetClientIdWithClientIdsTree = createSelector(
( state, clientId ) => ( {
clientId,
innerBlocks: __unstableGetClientIdsTree( state, clientId ),
} ),
( state, clientId ) => {
deprecated(
"wp.data.select( 'core/block-editor' ).__unstableGetClientIdWithClientIdsTree",
{
since: '6.3',
version: '6.5',
}
);
return {
clientId,
innerBlocks: __unstableGetClientIdsTree( state, clientId ),
};
},
( state ) => [ state.blocks.order ]
);

Expand All @@ -205,16 +216,26 @@ export const __unstableGetClientIdWithClientIdsTree = createSelector(
* given root, consisting of stripped down block objects containing only
* their client IDs, and their inner blocks' client IDs.
*
* @deprecated
*
* @param {Object} state Editor state.
* @param {?string} rootClientId Optional root client ID of block list.
*
* @return {Object[]} Client IDs of the post blocks.
*/
export const __unstableGetClientIdsTree = createSelector(
( state, rootClientId = '' ) =>
getBlockOrder( state, rootClientId ).map( ( clientId ) =>
( state, rootClientId = '' ) => {
deprecated(
"wp.data.select( 'core/block-editor' ).__unstableGetClientIdsTree",
{
since: '6.3',
version: '6.5',
}
);
return getBlockOrder( state, rootClientId ).map( ( clientId ) =>
__unstableGetClientIdWithClientIdsTree( state, clientId )
),
);
},
( state ) => [ state.blocks.order ]
);

Expand Down
157 changes: 156 additions & 1 deletion packages/block-editor/src/store/test/private-selectors.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import {
getLastInsertedBlocksClientIds,
getBlockEditingMode,
isBlockSubtreeDisabled,
getClientIdsTreeWithBlockEditingMode,
} from '../private-selectors';

jest.mock( '@wordpress/data/src/select', () => ( {
Expand Down Expand Up @@ -74,7 +75,13 @@ describe( 'private selectors', () => {
[ 'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c', {} ], // | | Paragraph
] ),
order: new Map( [
[ '', [ '6cf70164-9097-4460-bcbf-200560546988' ] ],
[
'',
[
'6cf70164-9097-4460-bcbf-200560546988',
'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
],
],
[ '6cf70164-9097-4460-bcbf-200560546988', [] ],
[
'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
Expand Down Expand Up @@ -381,5 +388,153 @@ describe( 'private selectors', () => {
).toBe( false );
} );
} );

describe( 'getClientIdsTreeWithBlockEditingMode', () => {
it( 'should return tree containing only clientId and innerBlocks', () => {
const state = {
...baseState,
blockEditingModes: new Map( [] ),
};
expect(
getClientIdsTreeWithBlockEditingMode( state, 'default' )
).toEqual( [
{
clientId: '6cf70164-9097-4460-bcbf-200560546988',
innerBlocks: [],
},
{
clientId: 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
innerBlocks: [
{
clientId:
'b26fc763-417d-4f01-b81c-2ec61e14a972',
innerBlocks: [],
},
{
clientId:
'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
innerBlocks: [
{
clientId:
'b3247f75-fd94-4fef-97f9-5bfd162cc416',
innerBlocks: [],
},
{
clientId:
'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
innerBlocks: [],
},
],
},
],
},
] );
} );

it( 'should return a subtree when rootBlockClientId is given', () => {
const state = {
...baseState,
blockEditingModes: new Map( [] ),
};
expect(
getClientIdsTreeWithBlockEditingMode(
state,
'default',
'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337'
)
).toEqual( [
{
clientId: 'b26fc763-417d-4f01-b81c-2ec61e14a972',
innerBlocks: [],
},
{
clientId: '9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
innerBlocks: [
{
clientId:
'b3247f75-fd94-4fef-97f9-5bfd162cc416',
innerBlocks: [],
},
{
clientId:
'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
innerBlocks: [],
},
],
},
] );
} );

it( 'should filter by a single mode', () => {
const state = {
...baseState,
blockEditingModes: new Map( [
[
'b26fc763-417d-4f01-b81c-2ec61e14a972',
'contentOnly',
],
[ '9b9c5c3f-2e46-4f02-9e14-9fe9515b958f', 'disabled' ],
] ),
};
expect(
getClientIdsTreeWithBlockEditingMode( state, 'disabled' )
).toEqual( [
{
clientId: '9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
innerBlocks: [
{
clientId:
'b3247f75-fd94-4fef-97f9-5bfd162cc416',
innerBlocks: [],
},
{
clientId:
'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
innerBlocks: [],
},
],
},
] );
} );

it( 'should filter by multiple modes', () => {
const state = {
...baseState,
blockEditingModes: new Map( [
[
'b26fc763-417d-4f01-b81c-2ec61e14a972',
'contentOnly',
],
[ '9b9c5c3f-2e46-4f02-9e14-9fe9515b958f', 'disabled' ],
] ),
};
expect(
getClientIdsTreeWithBlockEditingMode( state, [
'contentOnly',
'disabled',
] )
).toEqual( [
{
clientId: 'b26fc763-417d-4f01-b81c-2ec61e14a972',
innerBlocks: [],
},
{
clientId: '9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
innerBlocks: [
{
clientId:
'b3247f75-fd94-4fef-97f9-5bfd162cc416',
innerBlocks: [],
},
{
clientId:
'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
innerBlocks: [],
},
],
},
] );
} );
} );
} );
} );
1 change: 1 addition & 0 deletions packages/block-editor/src/store/test/selectors.js
Original file line number Diff line number Diff line change
Expand Up @@ -4734,6 +4734,7 @@ describe( '__unstableGetClientIdWithClientIdsTree', () => {
{ clientId: 'baz', innerBlocks: [] },
],
} );
expect( console ).toHaveWarned();
} );
} );
describe( '__unstableGetClientIdsTree', () => {
Expand Down

0 comments on commit 9179abb

Please sign in to comment.