Block Editor: use optional chaining and nullish coalescing instead of…

… _.get. (#23632)
WordPress · Sep 29, 2020 · 1719dc2 · 1719dc2
1 parent 363df9f
commit 1719dc2
Show file tree

Hide file tree

Showing 9 changed files with 27 additions and 63 deletions.
diff --git a/packages/block-editor/src/components/block-icon/index.js b/packages/block-editor/src/components/block-icon/index.js
@@ -2,7 +2,6 @@
  * External dependencies
  */
 import classnames from 'classnames';
-import { get } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -11,7 +10,7 @@ import { Icon } from '@wordpress/components';
 import { blockDefault } from '@wordpress/icons';
 
 export default function BlockIcon( { icon, showColors = false, className } ) {
- if ( get( icon, [ 'src' ] ) === 'block-default' ) {
+ if ( icon?.src === 'block-default' ) {
  icon = {
  src: blockDefault,
  };

diff --git a/packages/block-editor/src/components/block-icon/index.native.js b/packages/block-editor/src/components/block-icon/index.native.js
@@ -1,7 +1,6 @@
 /**
  * External dependencies
  */
-import { get } from 'lodash';
 import { View } from 'react-native';
 
 /**
@@ -11,7 +10,7 @@ import { Icon } from '@wordpress/components';
 import { blockDefault } from '@wordpress/icons';
 
 export default function BlockIcon( { icon, showColors = false } ) {
- if ( get( icon, [ 'src' ] ) === 'block-default' ) {
+ if ( icon?.src === 'block-default' ) {
  icon = {
  src: blockDefault,
  };

diff --git a/packages/block-editor/src/components/colors/with-colors.js b/packages/block-editor/src/components/colors/with-colors.js
@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { get, isString, kebabCase, reduce, upperFirst } from 'lodash';
+import { isString, kebabCase, reduce, upperFirst } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -161,9 +161,7 @@ function createColorHOC( colorTypes, withColorPalette ) {
 
  const previousColorObject =
  previousState[ colorAttributeName ];
- const previousColor = get( previousColorObject, [
- 'color',
- ] );
+ const previousColor = previousColorObject?.color;
  /**
  * The "and previousColorObject" condition checks that a previous color object was already computed.
  * At the start previousColorObject and colorValue are both equal to undefined

diff --git a/packages/block-editor/src/components/default-style-picker/index.js b/packages/block-editor/src/components/default-style-picker/index.js
@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import { get } from 'lodash';
-
 /**
  * WordPress dependencies
  */
@@ -22,15 +17,9 @@ export default function DefaultStylePicker( { blockName } ) {
  const preferredStyleVariations =
  settings.__experimentalPreferredStyleVariations;
  return {
- preferredStyle: get( preferredStyleVariations, [
- 'value',
- blockName,
- ] ),
- onUpdatePreferredStyleVariations: get(
- preferredStyleVariations,
- [ 'onChange' ],
- null
- ),
+ preferredStyle: preferredStyleVariations?.value?.[ blockName ],
+ onUpdatePreferredStyleVariations:
+ preferredStyleVariations?.onChange ?? null,
  styles: select( 'core/blocks' ).getBlockStyles( blockName ),
  };
  },

diff --git a/packages/block-editor/src/components/use-simulated-media-query/index.js b/packages/block-editor/src/components/use-simulated-media-query/index.js
@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { filter, get } from 'lodash';
+import { filter } from 'lodash';
 import { match } from 'css-mediaquery';
 
 /**
@@ -20,18 +20,15 @@ function getStyleSheetsThatMatchHostname() {
  return [];
  }
 
- return filter(
- get( window, [ 'document', 'styleSheets' ], [] ),
- ( styleSheet ) => {
- if ( ! styleSheet.href ) {
- return false;
- }
- return (
- getProtocol( styleSheet.href ) === window.location.protocol &&
- getAuthority( styleSheet.href ) === window.location.host
- );
+ return filter( window?.document?.styleSheets ?? [], ( styleSheet ) => {
+ if ( ! styleSheet.href ) {
+ return false;
  }
- );
+ return (
+ getProtocol( styleSheet.href ) === window.location.protocol &&
+ getAuthority( styleSheet.href ) === window.location.host
+ );
+ } );
 }
 
 function isReplaceableMediaRule( rule ) {

diff --git a/packages/block-editor/src/hooks/align.js b/packages/block-editor/src/hooks/align.js
@@ -2,7 +2,7 @@
  * External dependencies
  */
 import classnames from 'classnames';
-import { get, has, without } from 'lodash';
+import { has, without } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -135,11 +135,7 @@ export const withToolbarControls = createHigherOrderComponent(
  const updateAlignment = ( nextAlign ) => {
  if ( ! nextAlign ) {
  const blockType = getBlockType( props.name );
- const blockDefaultAlign = get( blockType, [
- 'attributes',
- 'align',
- 'default',
- ] );
+ const blockDefaultAlign = blockType.attributes?.align?.default;
  if ( blockDefaultAlign ) {
  nextAlign = '';
  }

diff --git a/packages/block-editor/src/store/actions.js b/packages/block-editor/src/store/actions.js
@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { castArray, first, get, last, some } from 'lodash';
+import { castArray, first, last, some } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -252,11 +252,9 @@ export function toggleSelection( isSelectionEnabled = true ) {
 }
 
 function getBlocksWithDefaultStylesApplied( blocks, blockEditorSettings ) {
- const preferredStyleVariations = get(
- blockEditorSettings,
- [ '__experimentalPreferredStyleVariations', 'value' ],
- {}
- );
+ const preferredStyleVariations =
+ blockEditorSettings?.__experimentalPreferredStyleVariations?.value ??
+ {};
  return blocks.map( ( block ) => {
  const blockName = block.name;
  if ( ! hasBlockSupport( blockName, 'defaultStylePicker', true ) ) {
@@ -265,7 +263,7 @@ function getBlocksWithDefaultStylesApplied( blocks, blockEditorSettings ) {
  if ( ! preferredStyleVariations[ blockName ] ) {
  return block;
  }
- const className = get( block, [ 'attributes', 'className' ] );
+ const className = block.attributes?.className;
  if ( className?.includes( 'is-style-' ) ) {
  return block;
  }

diff --git a/packages/block-editor/src/store/reducer.js b/packages/block-editor/src/store/reducer.js
@@ -12,7 +12,6 @@ import {
  keys,
  isEqual,
  isEmpty,
- get,
  identity,
  difference,
  omitBy,
@@ -411,11 +410,7 @@ function withPersistentBlockChange( reducer ) {
  markNextChangeAsNotPersistent =
  action.type === 'MARK_NEXT_CHANGE_AS_NOT_PERSISTENT';
 
- const nextIsPersistentChange = get(
- state,
- [ 'isPersistentChange' ],
- true
- );
+ const nextIsPersistentChange = state?.isPersistentChange ?? true;
  if ( state.isPersistentChange === nextIsPersistentChange ) {
  return state;
  }

diff --git a/packages/block-editor/src/store/selectors.js b/packages/block-editor/src/store/selectors.js
@@ -5,7 +5,6 @@ import {
  castArray,
  flatMap,
  first,
- get,
  isArray,
  isBoolean,
  last,
@@ -1273,9 +1272,7 @@ const canInsertBlockTypeUnmemoized = (
  return false;
  }
 
- const parentAllowedBlocks = get( parentBlockListSettings, [
- 'allowedBlocks',
- ] );
+ const parentAllowedBlocks = parentBlockListSettings?.allowedBlocks;
  const hasParentAllowedBlock = checkAllowList(
  parentAllowedBlocks,
  blockName
@@ -1345,7 +1342,7 @@ export function canInsertBlocks( state, clientIds, rootClientId = null ) {
  * the number of inserts that have occurred.
  */
 function getInsertUsage( state, id ) {
- return get( state.preferences.insertUsage, [ id ], null );
+ return state.preferences.insertUsage?.[ id ] ?? null;
 }
 
 /**
@@ -1735,11 +1732,7 @@ export function __experimentalGetLastBlockAttributeChanges( state ) {
  * @return {Array} Reusable blocks
  */
 function getReusableBlocks( state ) {
- return get(
- state,
- [ 'settings', '__experimentalReusableBlocks' ],
- EMPTY_ARRAY
- );
+ return state?.settings?.__experimentalReusableBlocks ?? EMPTY_ARRAY;
 }
 
 /**