diff --git a/docs/designers-developers/developers/data/data-core-block-editor.md b/docs/designers-developers/developers/data/data-core-block-editor.md index 23e48402fb1cb..58b7bf52e3327 100644 --- a/docs/designers-developers/developers/data/data-core-block-editor.md +++ b/docs/designers-developers/developers/data/data-core-block-editor.md @@ -383,14 +383,6 @@ items (e.g. a regular block type) and dynamic items (e.g. a reusable block). Each item object contains what's necessary to display a button in the inserter and handle its selection. -The 'utility' property indicates how useful we think an item will be to the -user. There are 4 levels of utility: - -1. Blocks that are contextually useful (utility = 3) -2. Blocks that have been previously inserted (utility = 2) -3. Blocks that are in the common category (utility = 1) -4. All other blocks (utility = 0) - The 'frecency' property is a heuristic () that combines block usage frequenty and recency. @@ -419,7 +411,6 @@ _Properties_ - _category_ `string`: Block category that the item is associated with. - _keywords_ `Array`: Keywords that can be searched to find this item. - _isDisabled_ `boolean`: Whether or not the user should be prevented from inserting this item. -- _utility_ `number`: How useful we think this item is, between 0 and 3. - _frecency_ `number`: Hueristic that combines frequency and recency. # **getLastMultiSelectedBlockClientId** diff --git a/packages/block-editor/CHANGELOG.md b/packages/block-editor/CHANGELOG.md index 27311c857ea90..179d63203badf 100644 --- a/packages/block-editor/CHANGELOG.md +++ b/packages/block-editor/CHANGELOG.md @@ -5,6 +5,7 @@ ### Breaking Changes - The block control value for `InnerBlocks` has been changed from `__experimentalBlocks` to `value` and is now considered a stable API. +- Removed the `utility` property from the objects returned by the `getInserterItems` selector. ## 3.7.0 (2020-02-10) diff --git a/packages/block-editor/src/components/inserter/block-list.js b/packages/block-editor/src/components/inserter/block-list.js index 6ac48ccf3bebc..60d3b97557bd8 100644 --- a/packages/block-editor/src/components/inserter/block-list.js +++ b/packages/block-editor/src/components/inserter/block-list.js @@ -124,9 +124,7 @@ export function InserterBlockList( { }, [ filteredItems, rootChildBlocks ] ); const suggestedItems = useMemo( () => { - return items - .filter( ( item ) => item.utility > 0 ) - .slice( 0, MAX_SUGGESTED_ITEMS ); + return items.slice( 0, MAX_SUGGESTED_ITEMS ); }, [ items ] ); const reusableItems = useMemo( () => { diff --git a/packages/block-editor/src/components/inserter/test/block-list.js b/packages/block-editor/src/components/inserter/test/block-list.js index bf27a966a0a62..5e51597c4c64b 100644 --- a/packages/block-editor/src/components/inserter/test/block-list.js +++ b/packages/block-editor/src/components/inserter/test/block-list.js @@ -89,20 +89,6 @@ describe( 'InserterMenu', () => { assertNoResultsMessageToBePresent( container ); } ); - it( 'should show only high utility items in the suggested tab', () => { - const { container } = render( ); - const firstPanel = container.querySelector( - '.block-editor-inserter__panel-content' - ); - const visibleBlocks = firstPanel.querySelectorAll( - '.block-editor-block-types-list__item-title' - ); - expect( visibleBlocks ).toHaveLength( 3 ); - expect( visibleBlocks[ 0 ].textContent ).toEqual( 'Text' ); - expect( visibleBlocks[ 1 ].textContent ).toEqual( 'Advanced Text' ); - expect( visibleBlocks[ 2 ].textContent ).toEqual( 'Some Other Block' ); - } ); - it( 'should show items from the embed category in the embed tab', () => { const { container } = initializeAllClosedMenuState(); const embedTabContent = container.querySelectorAll( diff --git a/packages/block-editor/src/components/inserter/test/fixtures/index.js b/packages/block-editor/src/components/inserter/test/fixtures/index.js index d3b46654736c9..e0290fa8bed3c 100644 --- a/packages/block-editor/src/components/inserter/test/fixtures/index.js +++ b/packages/block-editor/src/components/inserter/test/fixtures/index.js @@ -31,7 +31,7 @@ export const withVariationsItem = { title: 'With Variations', category: 'widgets', isDisabled: false, - utility: 0, + utility: 1, variations: [ { name: 'variation-one', @@ -75,7 +75,7 @@ export const moreItem = { title: 'More', category: 'layout', isDisabled: true, - utility: 0, + utility: 1, }; export const youtubeItem = { @@ -86,7 +86,7 @@ export const youtubeItem = { category: 'embed', keywords: [ 'google', 'video' ], isDisabled: false, - utility: 0, + utility: 1, }; export const textEmbedItem = { @@ -96,7 +96,7 @@ export const textEmbedItem = { title: 'A Text Embed', category: 'embed', isDisabled: false, - utility: 0, + utility: 1, }; export const reusableItem = { @@ -106,7 +106,7 @@ export const reusableItem = { title: 'My reusable block', category: 'reusable', isDisabled: false, - utility: 0, + utility: 1, }; export default [ diff --git a/packages/block-editor/src/store/selectors.js b/packages/block-editor/src/store/selectors.js index 183210fc14c79..d2b4a86dd13a3 100644 --- a/packages/block-editor/src/store/selectors.js +++ b/packages/block-editor/src/store/selectors.js @@ -42,27 +42,6 @@ import { SVG, Rect, G, Path } from '@wordpress/components'; */ // Module constants - -/** - * @private - */ -export const INSERTER_UTILITY_HIGH = 3; - -/** - * @private - */ -export const INSERTER_UTILITY_MEDIUM = 2; - -/** - * @private - */ -export const INSERTER_UTILITY_LOW = 1; - -/** - * @private - */ -export const INSERTER_UTILITY_NONE = 0; - const MILLISECONDS_PER_HOUR = 3600 * 1000; const MILLISECONDS_PER_DAY = 24 * 3600 * 1000; const MILLISECONDS_PER_WEEK = 7 * 24 * 3600 * 1000; @@ -1261,14 +1240,6 @@ const canIncludeBlockTypeInInserter = ( state, blockType, rootClientId ) => { * Each item object contains what's necessary to display a button in the * inserter and handle its selection. * - * The 'utility' property indicates how useful we think an item will be to the - * user. There are 4 levels of utility: - * - * 1. Blocks that are contextually useful (utility = 3) - * 2. Blocks that have been previously inserted (utility = 2) - * 3. Blocks that are in the common category (utility = 1) - * 4. All other blocks (utility = 0) - * * The 'frecency' property is a heuristic (https://en.wikipedia.org/wiki/Frecency) * that combines block usage frequenty and recency. * @@ -1289,22 +1260,10 @@ const canIncludeBlockTypeInInserter = ( state, blockType, rootClientId ) => { * @property {string[]} keywords Keywords that can be searched to find this item. * @property {boolean} isDisabled Whether or not the user should be prevented from inserting * this item. - * @property {number} utility How useful we think this item is, between 0 and 3. * @property {number} frecency Hueristic that combines frequency and recency. */ export const getInserterItems = createSelector( ( state, rootClientId = null ) => { - const calculateUtility = ( category, count, isContextual ) => { - if ( isContextual ) { - return INSERTER_UTILITY_HIGH; - } else if ( count > 0 ) { - return INSERTER_UTILITY_MEDIUM; - } else if ( category === 'common' ) { - return INSERTER_UTILITY_LOW; - } - return INSERTER_UTILITY_NONE; - }; - const calculateFrecency = ( time, count ) => { if ( ! time ) { return count; @@ -1342,7 +1301,6 @@ export const getInserterItems = createSelector( ); } - const isContextual = isArray( blockType.parent ); const { time, count = 0 } = getInsertUsage( state, id ) || {}; const inserterVariations = blockType.variations.filter( ( { scope } ) => ! scope || scope.includes( 'inserter' ) @@ -1360,11 +1318,7 @@ export const getInserterItems = createSelector( variations: inserterVariations, example: blockType.example, isDisabled, - utility: calculateUtility( - blockType.category, - count, - isContextual - ), + utility: 1, // deprecated frecency: calculateFrecency( time, count ), }; }; @@ -1384,7 +1338,6 @@ export const getInserterItems = createSelector( } const { time, count = 0 } = getInsertUsage( state, id ) || {}; - const utility = calculateUtility( 'reusable', count, false ); const frecency = calculateFrecency( time, count ); return { @@ -1398,7 +1351,7 @@ export const getInserterItems = createSelector( category: 'reusable', keywords: [], isDisabled: false, - utility, + utility: 1, // deprecated frecency, }; }; @@ -1419,7 +1372,7 @@ export const getInserterItems = createSelector( return orderBy( [ ...blockTypeInserterItems, ...reusableBlockInserterItems ], - [ 'utility', 'frecency' ], + [ 'frecency' ], [ 'desc', 'desc' ] ); }, diff --git a/packages/block-editor/src/store/test/selectors.js b/packages/block-editor/src/store/test/selectors.js index cb792c2f7af91..ad2311344b9ba 100644 --- a/packages/block-editor/src/store/test/selectors.js +++ b/packages/block-editor/src/store/test/selectors.js @@ -62,9 +62,6 @@ const { getBlockListSettings, __experimentalGetBlockListSettingsForBlocks, __experimentalGetLastBlockAttributeChanges, - INSERTER_UTILITY_HIGH, - INSERTER_UTILITY_MEDIUM, - INSERTER_UTILITY_LOW, getLowestCommonAncestorWithSelectedBlock, } = selectors; @@ -2323,7 +2320,7 @@ describe( 'selectors', () => { keywords: [ 'testing' ], variations: [], isDisabled: false, - utility: 0, + utility: 1, frecency: 0, } ); const reusableBlockItem = items.find( @@ -2340,12 +2337,12 @@ describe( 'selectors', () => { category: 'reusable', keywords: [], isDisabled: false, - utility: 0, + utility: 1, frecency: 0, } ); } ); - it( 'should order items by descending utility and frecency', () => { + it( 'should order items by descending frecency', () => { const state = { blocks: { byClientId: {}, @@ -2384,12 +2381,12 @@ describe( 'selectors', () => { ( item ) => item.id ); expect( itemIDs ).toEqual( [ - 'core/post-content-child', 'core/block/2', 'core/block/1', + 'core/test-block-a', 'core/test-block-b', 'core/test-freeform', - 'core/test-block-a', + 'core/post-content-child', ] ); } ); @@ -2457,9 +2454,9 @@ describe( 'selectors', () => { ); expect( firstBlockFirstCall ).toBe( firstBlockSecondCall ); expect( firstBlockFirstCall.map( ( item ) => item.id ) ).toEqual( [ + 'core/test-block-a', 'core/test-block-b', 'core/test-freeform', - 'core/test-block-a', 'core/block/1', 'core/block/2', ] ); @@ -2470,9 +2467,9 @@ describe( 'selectors', () => { 'block4' ); expect( secondBlockFirstCall.map( ( item ) => item.id ) ).toEqual( [ + 'core/test-block-a', 'core/test-block-b', 'core/test-freeform', - 'core/test-block-a', 'core/block/1', 'core/block/2', ] ); @@ -2514,29 +2511,7 @@ describe( 'selectors', () => { expect( testBlockBItem.isDisabled ).toBe( true ); } ); - it( 'should give common blocks a low utility', () => { - const state = { - blocks: { - byClientId: {}, - attributes: {}, - order: {}, - parents: {}, - cache: {}, - }, - preferences: { - insertUsage: {}, - }, - blockListSettings: {}, - settings: {}, - }; - const items = getInserterItems( state ); - const testBlockBItem = items.find( - ( item ) => item.id === 'core/test-block-b' - ); - expect( testBlockBItem.utility ).toBe( INSERTER_UTILITY_LOW ); - } ); - - it( 'should give used blocks a medium utility and set a frecency', () => { + it( 'should set a frecency', () => { const state = { blocks: { byClientId: {}, @@ -2557,44 +2532,8 @@ describe( 'selectors', () => { const reusableBlock2Item = items.find( ( item ) => item.id === 'core/test-block-b' ); - expect( reusableBlock2Item.utility ).toBe( - INSERTER_UTILITY_MEDIUM - ); expect( reusableBlock2Item.frecency ).toBe( 2.5 ); } ); - - it( 'should give contextual blocks a high utility', () => { - const state = { - blocks: { - byClientId: { - block1: { name: 'core/test-block-b' }, - }, - attributes: { - block1: { attribute: {} }, - }, - order: { - '': [ 'block1' ], - }, - parents: { - block1: '', - }, - cache: { - block1: {}, - }, - controlledInnerBlocks: {}, - }, - preferences: { - insertUsage: {}, - }, - blockListSettings: {}, - settings: {}, - }; - const items = getInserterItems( state, 'block1' ); - const testBlockCItem = items.find( - ( item ) => item.id === 'core/test-block-c' - ); - expect( testBlockCItem.utility ).toBe( INSERTER_UTILITY_HIGH ); - } ); } ); describe( 'isValidTemplate', () => {