From d7f3896a7118021f82e54a4afe8a9dff0820c862 Mon Sep 17 00:00:00 2001 From: Luis Valdovinos Date: Mon, 1 Jul 2019 22:46:32 -0500 Subject: [PATCH 1/2] import lodash functions instead of whole lib --- package.json | 16 +++++++++- src/components/PageDropdown.js | 4 +-- src/index.js | 7 +++-- src/plugins/local/selectors/localSelectors.js | 4 +-- src/selectors/dataSelectors.js | 10 ++++--- src/utils/__tests__/initilizerTests.js | 4 +-- src/utils/compositionUtils.js | 30 +++++++++++-------- src/utils/initializer.js | 8 ++--- stories/index.tsx | 1 - 9 files changed, 53 insertions(+), 31 deletions(-) diff --git a/package.json b/package.json index 8c0ce867..a757361a 100644 --- a/package.json +++ b/package.json @@ -81,7 +81,21 @@ }, "dependencies": { "immutable": "^3.8.2", - "lodash": "^4.17.11", + "lodash.assignin": "^4.2.0", + "lodash.compact": "^3.0.1", + "lodash.flatten": "^4.4.0", + "lodash.flattendeep": "^4.4.0", + "lodash.flow": "^3.5.0", + "lodash.flowright": "^3.5.0", + "lodash.forin": "^4.4.0", + "lodash.isequal": "^4.5.0", + "lodash.isfinite": "^3.3.2", + "lodash.merge": "^4.6.1", + "lodash.pick": "^4.4.0", + "lodash.pickby": "^4.6.0", + "lodash.range": "^3.2.0", + "lodash.union": "^4.6.0", + "lodash.uniq": "^4.5.0", "max-safe-integer": "^2.0.0", "prop-types": "^15.7.2", "react-redux": "^5.1.1", diff --git a/src/components/PageDropdown.js b/src/components/PageDropdown.js index 004ed06a..505790d8 100644 --- a/src/components/PageDropdown.js +++ b/src/components/PageDropdown.js @@ -1,11 +1,11 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; -import _ from 'lodash'; +import isFinite from 'lodash.isfinite'; /** Gets a range from a single value. * TODO: Could probably make this take a predicate to avoid running through the loop twice */ const getRange = (number) => { - if (!_.isFinite(number)) { return [0] } + if (!isFinite(number)) { return [0] } return Array(number).fill().map((_, i) => i + 1); } diff --git a/src/index.js b/src/index.js index 8ad6027b..1cb1ce0f 100644 --- a/src/index.js +++ b/src/index.js @@ -8,7 +8,8 @@ import { import { createProvider } from 'react-redux'; import React, { Component } from 'react'; import PropTypes from 'prop-types'; -import _ from 'lodash'; +import forIn from 'lodash.forin'; +import pickBy from 'lodash.pickby'; import corePlugin from './core'; import init from './utils/initializer'; @@ -45,7 +46,7 @@ class Griddle extends Component { this.provider = createProvider(storeKey); this.storeListener = new StoreListener(this.store); - _.forIn(this.listeners, (listener, name) => { + forIn(this.listeners, (listener, name) => { this.storeListener.addListener(listener, name, { events: this.events, selectors: this.selectors @@ -54,7 +55,7 @@ class Griddle extends Component { } componentWillReceiveProps(nextProps) { - const newState = _.pickBy(nextProps, (value, key) => { + const newState = pickBy(nextProps, (value, key) => { return this.props[key] !== value; }); diff --git a/src/plugins/local/selectors/localSelectors.js b/src/plugins/local/selectors/localSelectors.js index 33ec878d..2a315651 100644 --- a/src/plugins/local/selectors/localSelectors.js +++ b/src/plugins/local/selectors/localSelectors.js @@ -1,6 +1,6 @@ import Immutable from 'immutable'; import { createSelector } from 'reselect'; -import _ from 'lodash'; +import isFinite from 'lodash.isfinite'; import { defaultSort } from '../../../utils/sortUtils'; import { getVisibleDataForColumns } from '../../../utils/dataUtils'; @@ -125,7 +125,7 @@ export const maxPageSelector = createSelector( const result = calc > Math.floor(calc) ? Math.floor(calc) + 1 : Math.floor(calc); - return _.isFinite(result) ? result : 1; + return isFinite(result) ? result : 1; } ) diff --git a/src/selectors/dataSelectors.js b/src/selectors/dataSelectors.js index 4f560342..c5fa3050 100644 --- a/src/selectors/dataSelectors.js +++ b/src/selectors/dataSelectors.js @@ -1,10 +1,12 @@ import Immutable from 'immutable'; import { createSelector, createSelectorCreator, defaultMemoize } from 'reselect'; -import _ from 'lodash'; +import isEqual from 'lodash.isequal'; +import isFinite from 'lodash.isfinite'; +import union from 'lodash.union'; const createDeepEqualSelector = createSelectorCreator( defaultMemoize, - _.isEqual, + isEqual, ) import MAX_SAFE_INTEGER from 'max-safe-integer' @@ -43,7 +45,7 @@ export const maxPageSelector = createSelector( const result = calc > Math.floor(calc) ? Math.floor(calc) + 1 : Math.floor(calc); - return _.isFinite(result) ? result : 1; + return isFinite(result) ? result : 1; } ); @@ -76,7 +78,7 @@ export const allColumnsSelector = createSelector( Object.keys(renderProperties.get('columnProperties').toJSON()) : []; - return _.union(dataColumns, columnPropertyColumns); + return union(dataColumns, columnPropertyColumns); } ); diff --git a/src/utils/__tests__/initilizerTests.js b/src/utils/__tests__/initilizerTests.js index 0623ea16..ec6380e0 100644 --- a/src/utils/__tests__/initilizerTests.js +++ b/src/utils/__tests__/initilizerTests.js @@ -1,5 +1,5 @@ import test from 'ava'; -import _ from 'lodash'; +import range from 'lodash.range'; import init from '../initializer'; @@ -260,7 +260,7 @@ test('init returns composed reducer given plugins', (assert) => { }); test('init returns flattened/compacted reduxMiddleware given plugins', (assert) => { - const mw = _.range(0, 4).map(i => () => i); + const mw = range(0, 4).map(i => () => i); const ctx = { props: { plugins: [ diff --git a/src/utils/compositionUtils.js b/src/utils/compositionUtils.js index ed94f9a2..cd769093 100644 --- a/src/utils/compositionUtils.js +++ b/src/utils/compositionUtils.js @@ -1,4 +1,10 @@ -import _ from 'lodash'; +import pickBy from 'lodash.pickby'; +import assignIn from 'lodash.assignin'; +import pick from 'lodash.pick'; +import flattenDeep from 'lodash.flattendeep'; +import uniq from 'lodash.uniq'; +import flow from 'lodash.flow'; +import flowRight from 'lodash.flowright'; /** Extends an array rather than known list of objects */ //TODO: Look at using object.assign @@ -10,7 +16,7 @@ export function extendArray(objects) { objects.unshift({}); //Buid the combined object - let combinedObject = _.extend.apply(this, objects); + let combinedObject = assignIn.apply(this, objects); //TODO: why are we doing this? is it necessary objects.shift(); @@ -54,7 +60,7 @@ export function getPropertiesByEnding(ending, object) { export function getObjectWherePropertyEndsWith(ending, object) { const keys = getPropertiesByEnding(ending, object); - return _.pick(object, keys); + return pick(object, keys); } /** Creates a new reducer by taking the output of the first reducer as state to the second @@ -84,7 +90,7 @@ export function composeReducers(reducers) { * @param {Object } objects - An array of objects */ export function getKeysForObjects(objects) { - return _.uniq(_.flattenDeep(objects.map(o => Object.keys(o)))); + return uniq(flattenDeep(objects.map(o => Object.keys(o)))); } /** Determines if a given key is a Griddle hook reducer @@ -99,7 +105,7 @@ export function isKeyGriddleHook(key) { * @param {Object} reducerObject - The reducer object to remove hooks from */ export function removeHooksFromObject(reducerObject) { - return _.pickBy(reducerObject, (value, key) => { + return pickBy(reducerObject, (value, key) => { if (isKeyGriddleHook(key)) { return false; } @@ -124,14 +130,14 @@ export function removeKeyNamePartFromObject(reducerObject, keyString) { */ export function getBeforeHooksFromObject(reducerObject) { return removeKeyNamePartFromObject( - _.pickBy(reducerObject, (value, key) => key.endsWith('BEFORE')), '_BEFORE'); + pickBy(reducerObject, (value, key) => key.endsWith('BEFORE')), '_BEFORE'); } /** Gets an object that consists of only the BEFORE_REDUCE hooks. * @param {Object} reducerObject - the reducer to get the BEFORE_REDUCE hooks from */ export function getBeforeReduceHooksFromObject(reducerObject) { - return _.pickBy(reducerObject, (value, key) => key === 'BEFORE_REDUCE') + return pickBy(reducerObject, (value, key) => key === 'BEFORE_REDUCE') } @@ -140,14 +146,14 @@ export function getBeforeReduceHooksFromObject(reducerObject) { */ export function getAfterHooksFromObject(reducerObject) { return removeKeyNamePartFromObject( - _.pickBy(reducerObject, (value, key) => key.endsWith('AFTER')), '_AFTER'); + pickBy(reducerObject, (value, key) => key.endsWith('AFTER')), '_AFTER'); } /** Gets an object that conists of only the AFTER_REDUCE hooks. * @param {Object} reducerObject - the reducer to get the AFTER_REDUCE hooks from */ export function getAfterReduceHooksFromObject(reducerObject) { - return _.pickBy(reducerObject, (value, key) => key === 'AFTER_REDUCE'); + return pickBy(reducerObject, (value, key) => key === 'AFTER_REDUCE'); } /** Combines the given reducer objects left to right @@ -232,7 +238,7 @@ export function callReducerWithBeforeAfterPipe(reducerObject, state, action) { const partialCall = (partialAction => partialState => call(partialState, partialAction))(action); - const method = _.flow([before, partialCall, after]); + const method = flow([before, partialCall, after]); return method(state); } @@ -295,13 +301,13 @@ export function wrapMethodsByWordEnding(componentArray, wordEnding, keyReplaceSt // Determine if we are working with an HoC that wraps another HoC newObject[keyWithoutEnhancer] = keyWithoutEnhancer.endsWith('Container') || keyWithoutEnhancer.endsWith('Enhancer') ? // If we are enhancing a container or enhancer flow this stuff since it's likely an HoC - _.flowRight(current[key], (current[keyWithoutEnhancer] || previous[keyWithoutEnhancer])) : + flowRight(current[key], (current[keyWithoutEnhancer] || previous[keyWithoutEnhancer])) : // Wrap the current component in the Enhancer or container current[key](current[keyWithoutEnhancer] || previous[keyWithoutEnhancer]) } } - return _.pickBy(Object.assign(previous, current, newObject), (v, k) => (!k.endsWith(wordEnding))) ; + return pickBy(Object.assign(previous, current, newObject), (v, k) => (!k.endsWith(wordEnding))) ; }, {}) } diff --git a/src/utils/initializer.js b/src/utils/initializer.js index c4b159d8..9b06998b 100644 --- a/src/utils/initializer.js +++ b/src/utils/initializer.js @@ -1,7 +1,7 @@ -import merge from 'lodash/merge'; -import pickBy from 'lodash/pickBy'; -import compact from 'lodash/compact'; -import flatten from 'lodash/flatten'; +import merge from 'lodash.merge'; +import pickBy from 'lodash.pickby'; +import compact from 'lodash.compact'; +import flatten from 'lodash.flatten'; import { buildGriddleReducer, buildGriddleComponents diff --git a/stories/index.tsx b/stories/index.tsx index a53f7f21..4732dacf 100644 --- a/stories/index.tsx +++ b/stories/index.tsx @@ -10,7 +10,6 @@ import withState from 'recompose/withState'; import { Provider, connect as reduxConnect } from 'react-redux'; import { createStore } from 'redux'; import { createSelector } from 'reselect'; -import _ from 'lodash'; import GenericGriddle, { connect, From a5d4ca47b87916c36ac265f0a10a06b15dfeb121 Mon Sep 17 00:00:00 2001 From: Luis Valdovinos Date: Tue, 2 Jul 2019 23:48:01 -0500 Subject: [PATCH 2/2] make sure reducerObject has only string keys --- package.json | 1 + src/utils/compositionUtils.js | 3 ++- 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index a757361a..a4f87855 100644 --- a/package.json +++ b/package.json @@ -90,6 +90,7 @@ "lodash.forin": "^4.4.0", "lodash.isequal": "^4.5.0", "lodash.isfinite": "^3.3.2", + "lodash.isstring": "^4.0.1", "lodash.merge": "^4.6.1", "lodash.pick": "^4.4.0", "lodash.pickby": "^4.6.0", diff --git a/src/utils/compositionUtils.js b/src/utils/compositionUtils.js index cd769093..7fec8db4 100644 --- a/src/utils/compositionUtils.js +++ b/src/utils/compositionUtils.js @@ -5,6 +5,7 @@ import flattenDeep from 'lodash.flattendeep'; import uniq from 'lodash.uniq'; import flow from 'lodash.flow'; import flowRight from 'lodash.flowright'; +import isString from 'lodash.isstring'; /** Extends an array rather than known list of objects */ //TODO: Look at using object.assign @@ -192,7 +193,7 @@ function buildGriddleReducerObject(reducerObjects) { if (reducerObjects.length > 0) { // remove the hooks and extend the object for(const key in reducerObjects) { - const reducer = reducerObjects[key]; + const reducer = pickBy(reducerObjects[key], (value, key) => isString(key)); reducerMethodsWithoutHooks.push(removeHooksFromObject(reducer)); beforeHooks.push(getBeforeHooksFromObject(reducer)); afterHooks.push(getAfterHooksFromObject(reducer));