Lodash: Refactor away from _.first() and _.last()

.eslintrc.js

@@ -100,6 +100,7 @@ module.exports = {
 							'findIndex',
 							'findKey',
 							'findLast',
+							'first',
 							'flatMap',
 							'flatten',
 							'flattenDeep',
@@ -122,6 +123,7 @@ module.exports = {
 							'isUndefined',
 							'keyBy',
 							'keys',
+							'last',
 							'lowerCase',
 							'mapKeys',
 							'maxBy',

packages/block-editor/src/components/block-list-appender/index.native.js

@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import { last } from 'lodash';
-
 /**
  * WordPress dependencies
  */
@@ -36,7 +31,9 @@ function BlockListAppender( {
 		return (
 			<DefaultBlockAppender
 				rootClientId={ rootClientId }
-				lastBlockClientId={ last( blockClientIds ) }
+				lastBlockClientId={
+					blockClientIds[ blockClientIds.length - 1 ]
+				}
 				containerStyle={ styles.blockListAppender }
 				placeholder={ blockClientIds.length > 0 ? '' : null }
 				showSeparator={ showSeparator }

packages/block-editor/src/components/inner-blocks/default-block-appender.js

@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import { last } from 'lodash';
-
 /**
  * WordPress dependencies
  */
@@ -28,7 +23,7 @@ export default compose( [
 		const blockClientIds = getBlockOrder( clientId );
 
 		return {
-			lastBlockClientId: last( blockClientIds ),
+			lastBlockClientId: blockClientIds[ blockClientIds.length - 1 ],
 		};
 	} ),
 ] )( DefaultBlockAppender );

packages/block-editor/src/components/provider/use-block-sync.js

@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import { last } from 'lodash';
-
 /**
  * WordPress dependencies
  */
@@ -152,7 +147,9 @@ export default function useBlockSync( {
 			// to allow that the consumer may apply modifications to reflect
 			// back on the editor.
 			if (
-				last( pendingChanges.current.outgoing ) === controlledBlocks
+				pendingChanges.current.outgoing[
+					pendingChanges.current.outgoing.length - 1
+				] === controlledBlocks
 			) {
 				pendingChanges.current.outgoing = [];
 			}

packages/block-library/src/list-item/hooks/use-outdent-list-item.js

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { first, last, castArray } from 'lodash';
+import { castArray } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -61,7 +61,7 @@ export default function useOutdentListItem( clientId ) {
 
 			if ( ! clientIds.length ) return;
 
-			const firstClientId = first( clientIds );
+			const firstClientId = clientIds[ 0 ];
 
 			// Can't outdent if it's not a list item.
 			if ( getBlockName( firstClientId ) !== listItemName ) return;
@@ -72,15 +72,15 @@ export default function useOutdentListItem( clientId ) {
 			if ( ! parentListItemId ) return;
 
 			const parentListId = getBlockRootClientId( firstClientId );
-			const lastClientId = last( clientIds );
+			const lastClientId = clientIds[ clientIds.length - 1 ];
 			const order = getBlockOrder( parentListId );
 			const followingListItems = order.slice(
 				getBlockIndex( lastClientId ) + 1
 			);
 
 			registry.batch( () => {
 				if ( followingListItems.length ) {
-					let nestedListId = first( getBlockOrder( firstClientId ) );
+					let nestedListId = getBlockOrder( firstClientId )[ 0 ];
 
 					if ( ! nestedListId ) {
 						const nestedListBlock = cloneBlock(

packages/block-library/src/list/edit.js

@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import { last } from 'lodash';
-
 /**
  * WordPress dependencies
  */
@@ -108,7 +103,7 @@ function useOutdentList( clientId ) {
 				[ newParentBlock, ...innerBlocks ]
 			);
 			// Select the last child of the list being outdent.
-			selectionChange( last( innerBlocks ).clientId );
+			selectionChange( innerBlocks[ innerBlocks.length - 1 ].clientId );
 		}, [ clientId ] ),
 	];
 }

packages/edit-site/src/components/global-styles/use-global-styles-output.js

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { first, get, isEmpty, kebabCase, pickBy, reduce, set } from 'lodash';
+import { get, isEmpty, kebabCase, pickBy, reduce, set } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -199,7 +199,7 @@ export function getStylesDeclarations(
 				return declarations;
 			}
 			const pathToValue = value;
-			if ( first( pathToValue ) === 'elements' || useEngine ) {
+			if ( pathToValue[ 0 ] === 'elements' || useEngine ) {
 				return declarations;
 			}