Lodash: Refactor away from _.sortBy() (#43479)

* Lodash: Refactor away from _.sortBy()

* Use String.prototype.localeCompare()

.eslintrc.js

@@ -134,6 +134,7 @@ module.exports = {
 							'reverse',
 							'size',
 							'snakeCase',
+							'sortBy',
 							'startCase',
 							'startsWith',
 							'stubFalse',

bin/plugin/commands/changelog.js

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-const { groupBy, escapeRegExp, flow, sortBy } = require( 'lodash' );
+const { groupBy, escapeRegExp, flow } = require( 'lodash' );
 const Octokit = require( '@octokit/rest' );
 const { sprintf } = require( 'sprintf-js' );
 const semver = require( 'semver' );
@@ -823,7 +823,9 @@ function getContributorPropsMarkdownList( ftcPRs ) {
  * @return {IssuesListForRepoResponseItem[]} The sorted list of pull requests.
  */
 function sortByUsername( items ) {
-	return sortBy( items, ( item ) => item.user.login.toLowerCase() );
+	return [ ...items ].sort( ( a, b ) =>
+		a.user.login.toLowerCase().localeCompare( b.user.login.toLowerCase() )
+	);
 }
 
 /**

packages/babel-plugin-makepot/index.js

@@ -33,15 +33,7 @@
  */
 
 const { po } = require( 'gettext-parser' );
-const {
-	pick,
-	reduce,
-	forEach,
-	sortBy,
-	isEqual,
-	merge,
-	isEmpty,
-} = require( 'lodash' );
+const { pick, reduce, forEach, isEqual, merge, isEmpty } = require( 'lodash' );
 const { relative, sep } = require( 'path' );
 const { writeFileSync } = require( 'fs' );
 
@@ -196,6 +188,20 @@ function isSameTranslation( a, b ) {
 	);
 }
 
+/**
+ * Sorts multiple translation objects by their reference.
+ * The reference is where they occur, in the format `file:line`.
+ *
+ * @param {Array} translations Array of translations to sort.
+ *
+ * @return {Array} Sorted translations.
+ */
+function sortByReference( translations = [] ) {
+	return [ ...translations ].sort( ( a, b ) =>
+		a.comments.reference.localeCompare( b.comments.reference )
+	);
+}
+
 module.exports = () => {
 	const strings = {};
 	let nplurals = 2,
@@ -323,9 +329,8 @@ module.exports = () => {
 						( memo, file ) => {
 							for ( const context in strings[ file ] ) {
 								// Within the same file, sort translations by line.
-								const sortedTranslations = sortBy(
-									strings[ file ][ context ],
-									'comments.reference'
+								const sortedTranslations = sortByReference(
+									strings[ file ][ context ]
 								);
 
 								forEach(

packages/block-library/src/index.native.js

@@ -2,7 +2,6 @@
  * External dependencies
  */
 import { Platform } from 'react-native';
-import { sortBy } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -161,16 +160,22 @@ export const registerBlock = ( block ) => {
 const registerBlockVariations = ( block ) => {
 	const { metadata, settings, name } = block;
 
-	sortBy( settings.variations, 'title' ).forEach( ( v ) => {
-		registerBlockType( `${ name }-${ v.name }`, {
-			...metadata,
-			name: `${ name }-${ v.name }`,
-			...settings,
-			icon: v.icon(),
-			title: v.title,
-			variations: [],
+	if ( ! settings.variations ) {
+		return;
+	}
+
+	[ ...settings.variations ]
+		.sort( ( a, b ) => a.title.localeCompare( b.title ) )
+		.forEach( ( v ) => {
+			registerBlockType( `${ name }-${ v.name }`, {
+				...metadata,
+				name: `${ name }-${ v.name }`,
+				...settings,
+				icon: v.icon(),
+				title: v.title,
+				variations: [],
+			} );
 		} );
-	} );
 };
 
 // Only enable code block for development

packages/block-library/src/navigation/menu-items-to-blocks.js

@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import { sortBy } from 'lodash';
-
 /**
  * WordPress dependencies
  */
@@ -40,7 +35,9 @@ function mapMenuItemsToBlocks( menuItems ) {
 	let mapping = {};
 
 	// The menuItem should be in menu_order sort order.
-	const sortedItems = sortBy( menuItems, 'menu_order' );
+	const sortedItems = [ ...menuItems ].sort(
+		( a, b ) => a.menu_order - b.menu_order
+	);
 
 	const innerBlocks = sortedItems.map( ( menuItem ) => {
 		if ( menuItem.type === 'block' ) {

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

@@ -2,7 +2,6 @@
  * External dependencies
  */
 import classnames from 'classnames';
-import { sortBy } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -133,7 +132,12 @@ function usePageData() {
 		// TODO: Once the REST API supports passing multiple values to
 		// 'orderby', this can be removed.
 		// https://core.trac.wordpress.org/ticket/39037
-		const sortedPages = sortBy( pages, [ 'menu_order', 'title.rendered' ] );
+		const sortedPages = [ ...( pages ?? [] ) ].sort( ( a, b ) => {
+			if ( a.menu_order === b.menu_order ) {
+				return a.title.rendered.localeCompare( b.title.rendered );
+			}
+			return a.menu_order - b.menu_order;
+		} );
 		const pagesByParentId = sortedPages.reduce( ( accumulator, page ) => {
 			const { parent } = page;
 			if ( accumulator.has( parent ) ) {

packages/edit-navigation/src/components/block-placeholder/menu-items-to-blocks.js

@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import { sortBy } from 'lodash';
-
 /**
  * WordPress dependencies
  */
@@ -41,7 +36,9 @@ function mapMenuItemsToBlocks( menuItems ) {
 	let mapping = {};
 
 	// The menuItem should be in menu_order sort order.
-	const sortedItems = sortBy( menuItems, 'menu_order' );
+	const sortedItems = [ ...menuItems ].sort(
+		( a, b ) => a.menu_order - b.menu_order
+	);
 
 	const innerBlocks = sortedItems.map( ( menuItem ) => {
 		const attributes = menuItemToBlockAttributes( menuItem );

packages/edit-navigation/src/store/transform.js

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { get, omit, sortBy } from 'lodash';
+import { get, omit } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -168,7 +168,9 @@ export function menuItemsToBlocks( menuItems ) {
  */
 function mapMenuItemsToBlocks( menuItems ) {
 	// The menuItem should be in menu_order sort order.
-	const sortedItems = sortBy( menuItems, 'menu_order' );
+	const sortedItems = [ ...menuItems ].sort(
+		( a, b ) => a.menu_order - b.menu_order
+	);
 
 	const blocks = sortedItems.map( ( menuItem ) => {
 		if ( menuItem.type === 'block' ) {