-
Notifications
You must be signed in to change notification settings - Fork 4.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Lodash: Refactor components away from _.map()
#47192
Conversation
@@ -70,7 +69,7 @@ export function getAutoCompleterUI( autocompleter ) { | |||
role="listbox" | |||
className="components-autocomplete__results" | |||
> | |||
{ map( items, ( option, index ) => ( | |||
{ items.map( ( option, index ) => ( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
items
is already being used as an array earlier in this component.
@@ -64,13 +63,21 @@ function ColorPalette( { | |||
const opacity = useRef( new Animated.Value( 1 ) ).current; | |||
|
|||
const defaultColors = [ | |||
...new Set( map( defaultSettings.colors, 'color' ) ), | |||
...new Set( | |||
( defaultSettings.colors ?? [] ).map( ( { color } ) => color ) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Theoretically, colors
could be undeclared, so we're defaulting to an empty array.
]; | ||
const mergedColors = [ | ||
...new Set( map( defaultSettings.allColors, 'color' ) ), | ||
...new Set( | ||
( defaultSettings.allColors ?? [] ).map( ( { color } ) => color ) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Theoretically, allColors
could be undeclared, so we're defaulting to an empty array.
]; | ||
const defaultGradientColors = [ | ||
...new Set( map( defaultSettings.gradients, 'gradient' ) ), | ||
...new Set( | ||
( defaultSettings.gradients ?? [] ).map( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Theoretically, gradients
could be undeclared, so we're defaulting to an empty array.
target={ target } | ||
/> | ||
) ); | ||
const element = Object.entries( shortcuts ?? {} ).map( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is externally exposed API, so it could be nullish, therefore we're falling back to an empty object just in case.
e7c1d7d
to
75debe4
Compare
Size Change: +10 B (0%) Total Size: 1.33 MB
ℹ️ View Unchanged
|
Flaky tests detected in 75debe4. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/3932135003
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM 👍
What?
This PR removes Lodash's
_.map()
from the components package. There are just a few usages and conversion is pretty straightforward.Why?
Lodash is known to unnecessarily inflate the bundle size of packages, and in most cases, it can be replaced with native language functionality. See these for more information and rationale:
@wordpress/api-fetch
package haslodash
as a dependency #39495How?
We're using
Array.prototype.map()
instead, with nullish coalescing where necessary.Testing Instructions