Lodash: Refactor components away from _.includes() (#43518)

* Lodash: Refactor components away from _.includes() * Add changelog
WordPress · Aug 23, 2022 · c9bbb3f · c9bbb3f
1 parent dc2ba4b
commit c9bbb3f
Show file tree

Hide file tree

Showing 5 changed files with 15 additions and 24 deletions.
diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md
@@ -53,6 +53,11 @@
 -   `Snackbar`: Refactor away from `_.omit()` ([#43474](https://github.com/WordPress/gutenberg/pull/43474/)).
 -   `UnitControl`: Refactor away from `_.omit()` ([#43474](https://github.com/WordPress/gutenberg/pull/43474/)).
 -   `BottomSheet`: Refactor away from `_.omit()` ([#43474](https://github.com/WordPress/gutenberg/pull/43474/)).
+-   `DropZone`: Refactor away from `_.includes()` ([#43518](https://github.com/WordPress/gutenberg/pull/43518/)).
+-   `NavigableMenu`: Refactor away from `_.includes()` ([#43518](https://github.com/WordPress/gutenberg/pull/43518/)).
+-   `Tooltip`: Refactor away from `_.includes()` ([#43518](https://github.com/WordPress/gutenberg/pull/43518/)).
+-   `TreeGrid`: Refactor away from `_.includes()` ([#43518](https://github.com/WordPress/gutenberg/pull/43518/)).
+
 
 ### Experimental
 

diff --git a/packages/components/src/drop-zone/index.js b/packages/components/src/drop-zone/index.js
@@ -2,7 +2,6 @@
  * External dependencies
  */
 import classnames from 'classnames';
-import { includes } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -60,12 +59,12 @@ export default function DropZoneComponent( {
 			 * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.
 			 * The order of the checks is important to recognise the HTML drop.
 			 */
-			if ( includes( event.dataTransfer.types, 'text/html' ) ) {
+			if ( event.dataTransfer.types.includes( 'text/html' ) ) {
 				_type = 'html';
 			} else if (
 				// Check for the types because sometimes the files themselves
 				// are only available on drop.
-				includes( event.dataTransfer.types, 'Files' ) ||
+				event.dataTransfer.types.includes( 'Files' ) ||
 				getFilesFromDataTransfer( event.dataTransfer ).length > 0
 			) {
 				_type = 'file';

diff --git a/packages/components/src/navigable-container/menu.js b/packages/components/src/navigable-container/menu.js
@@ -1,8 +1,4 @@
 // @ts-nocheck
-/**
- * External dependencies
- */
-import { includes } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -35,11 +31,11 @@ export function NavigableMenu(
 			previous = [ LEFT, UP ];
 		}
 
-		if ( includes( next, keyCode ) ) {
+		if ( next.includes( keyCode ) ) {
 			return 1;
-		} else if ( includes( previous, keyCode ) ) {
+		} else if ( previous.includes( keyCode ) ) {
 			return -1;
-		} else if ( includes( [ DOWN, UP, LEFT, RIGHT ], keyCode ) ) {
+		} else if ( [ DOWN, UP, LEFT, RIGHT ].includes( keyCode ) ) {
 			// Key press should be handled, e.g. have event propagation and
 			// default behavior handled by NavigableContainer but not result
 			// in an offset.

diff --git a/packages/components/src/tooltip/index.js b/packages/components/src/tooltip/index.js
@@ -1,8 +1,4 @@
 // @ts-nocheck
-/**
- * External dependencies
- */
-import { includes } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -211,7 +207,7 @@ function Tooltip( props ) {
 			// quickly blur/mouseleave before delayedSetIsOver is called.
 			delayedSetIsOver.cancel();
 
-			const _isOver = includes( [ 'focus', 'mouseenter' ], event.type );
+			const _isOver = [ 'focus', 'mouseenter' ].includes( event.type );
 			if ( _isOver === isOver ) {
 				return;
 			}

diff --git a/packages/components/src/tree-grid/index.js b/packages/components/src/tree-grid/index.js
@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import { includes } from 'lodash';
-
 /**
  * WordPress dependencies
  */
@@ -68,7 +63,7 @@ function TreeGrid(
 
 			if (
 				hasModifierKeyPressed ||
-				! includes( [ UP, DOWN, LEFT, RIGHT, HOME, END ], keyCode )
+				! [ UP, DOWN, LEFT, RIGHT, HOME, END ].includes( keyCode )
 			) {
 				return;
 			}
@@ -92,7 +87,7 @@ function TreeGrid(
 				activeRow.getAttribute( 'aria-expanded' ) === 'false' &&
 				keyCode === RIGHT;
 
-			if ( includes( [ LEFT, RIGHT ], keyCode ) ) {
+			if ( [ LEFT, RIGHT ].includes( keyCode ) ) {
 				// Calculate to the next element.
 				let nextIndex;
 				if ( keyCode === LEFT ) {
@@ -177,7 +172,7 @@ function TreeGrid(
 				// Prevent key use for anything else. This ensures Voiceover
 				// doesn't try to handle key navigation.
 				event.preventDefault();
-			} else if ( includes( [ UP, DOWN ], keyCode ) ) {
+			} else if ( [ UP, DOWN ].includes( keyCode ) ) {
 				// Calculate the rowIndex of the next row.
 				const rows = Array.from(
 					treeGridElement.querySelectorAll( '[role="row"]' )
@@ -231,7 +226,7 @@ function TreeGrid(
 				// Prevent key use for anything else. This ensures Voiceover
 				// doesn't try to handle key navigation.
 				event.preventDefault();
-			} else if ( includes( [ HOME, END ], keyCode ) ) {
+			} else if ( [ HOME, END ].includes( keyCode ) ) {
 				// Calculate the rowIndex of the next row.
 				const rows = Array.from(
 					treeGridElement.querySelectorAll( '[role="row"]' )