Remove the utility property from the inserter items objects

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 (<https://en.wikipedia.org/wiki/Frecency>)
 that combines block usage frequenty and recency.
 
@@ -419,7 +411,6 @@ _Properties_
 - _category_ `string`: Block category that the item is associated with.
 - _keywords_ `Array<string>`: 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.
 
 <a name="getLastMultiSelectedBlockClientId" href="#getLastMultiSelectedBlockClientId">#</a> **getLastMultiSelectedBlockClientId**

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)
 

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( () => {

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( <InserterBlockList /> );
- 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(

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 [

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' ]
  );
  },

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', () => {