fix(dependencies): stopping (and preventing) full lodash library import... now using only method level imports.

superset-frontend/.eslintrc.js

@@ -71,6 +71,7 @@ module.exports = {
     'prettier',
     'react',
     'file-progress',
+    'lodash',
     'theme-colors',
     'translation-vars',
   ],
@@ -241,6 +242,7 @@ module.exports = {
     'jsx-a11y/anchor-is-valid': 1,
     'jsx-a11y/click-events-have-key-events': 0, // re-enable up for discussion
     'jsx-a11y/mouse-events-have-key-events': 0, // re-enable up for discussion
+    'lodash/import-scope': [2, 'member'],
     'new-cap': 0,
     'no-bitwise': 0,
     'no-continue': 0,

superset-frontend/package.json

@@ -290,6 +290,7 @@
     "eslint-plugin-jest": "^24.7.0",
     "eslint-plugin-jest-dom": "^3.6.5",
     "eslint-plugin-jsx-a11y": "^6.4.1",
+    "eslint-plugin-lodash": "^7.4.0",
     "eslint-plugin-no-only-tests": "^2.4.0",
     "eslint-plugin-prettier": "^4.0.0",
     "eslint-plugin-react": "^7.22.0",

superset-frontend/packages/generator-superset/generators/plugin-chart/index.js

@@ -20,7 +20,14 @@
 /* eslint-disable sort-keys */
 
 const Generator = require('yeoman-generator');
-const _ = require('lodash');
+// eslint-disable-next-line lodash/import-scope
+const kebabCase = require('lodash/kebabCase');
+// eslint-disable-next-line lodash/import-scope
+const startCase = require('lodash/startCase');
+// eslint-disable-next-line lodash/import-scope
+const camelCase = require('lodash/camelCase');
+// eslint-disable-next-line lodash/import-scope
+const upperFirst = require('lodash/upperFirst');
 
 module.exports = class extends Generator {
   async prompting() {
@@ -32,23 +39,23 @@ module.exports = class extends Generator {
         name: 'packageName',
         message: 'Package name:',
         // Default to current folder name, e.g. superset-plugin-chart-hello-world
-        default: _.kebabCase(this.appname),
+        default: kebabCase(this.appname),
       },
       {
         type: 'input',
         name: 'pluginName',
         message: 'Plugin name:',
         // Hello World
-        default: _.startCase(
-          _.camelCase(this.appname.replace('superset plugin chart', '').trim()),
+        default: startCase(
+          camelCase(this.appname.replace('superset plugin chart', '').trim()),
         ),
       },
       {
         type: 'input',
         name: 'description',
         message: 'Description:',
         // Superset Plugin Chart Hello World
-        default: _.upperFirst(_.startCase(this.appname)),
+        default: upperFirst(startCase(this.appname)),
       },
       {
         type: 'list',
@@ -70,7 +77,7 @@ module.exports = class extends Generator {
 
   writing() {
     // SupersetPluginChartHelloWorld
-    const packageLabel = _.upperFirst(_.camelCase(this.answers.packageName));
+    const packageLabel = upperFirst(camelCase(this.answers.packageName));
 
     const params = {
       ...this.answers,

superset-frontend/packages/superset-ui-core/src/query/normalizeOrderBy.ts

@@ -16,8 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import isEmpty from 'lodash/isEmpty';
-import isBoolean from 'lodash/isBoolean';
+import { isEmpty, isBoolean } from 'lodash';
 
 import { QueryObject } from './types';
 

superset-frontend/packages/superset-ui-core/src/query/normalizeTimeColumn.ts

@@ -16,7 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import omit from 'lodash/omit';
+import { omit } from 'lodash';
 
 import {
   AdhocColumn,

superset-frontend/packages/superset-ui-core/src/utils/convertKeysToCamelCase.ts

@@ -17,9 +17,7 @@
  * under the License.
  */
 
-import camelCase from 'lodash/camelCase';
-import isPlainObject from 'lodash/isPlainObject';
-import mapKeys from 'lodash/mapKeys';
+import { camelCase, isPlainObject, mapKeys } from 'lodash';
 
 export default function convertKeysToCamelCase<T>(object: T) {
   if (object === null || object === undefined) {

superset-frontend/plugins/plugin-chart-echarts/src/Gauge/transformProps.ts

@@ -28,7 +28,7 @@ import {
 import { EChartsCoreOption, GaugeSeriesOption } from 'echarts';
 import { GaugeDataItemOption } from 'echarts/types/src/chart/gauge/GaugeSeries';
 import { CallbackDataParams } from 'echarts/types/src/util/types';
-import range from 'lodash/range';
+import { range } from 'lodash';
 import { parseNumbersList } from '../utils/controls';
 import {
   DEFAULT_FORM_DATA as DEFAULT_GAUGE_FORM_DATA,

superset-frontend/plugins/plugin-chart-echarts/src/utils/treeBuilder.ts

@@ -17,7 +17,7 @@
  * under the License.
  */
 import { DataRecord, DataRecordValue } from '@superset-ui/core';
-import _ from 'lodash';
+import { groupBy as _groupBy, isNumber, transform } from 'lodash';
 
 export type TreeNode = {
   name: DataRecordValue;
@@ -28,7 +28,7 @@ export type TreeNode = {
 };
 
 function getMetricValue(datum: DataRecord, metric: string) {
-  return _.isNumber(datum[metric]) ? (datum[metric] as number) : 0;
+  return isNumber(datum[metric]) ? (datum[metric] as number) : 0;
 }
 
 export function treeBuilder(
@@ -38,8 +38,8 @@ export function treeBuilder(
   secondaryMetric?: string,
 ): TreeNode[] {
   const [curGroupBy, ...restGroupby] = groupBy;
-  const curData = _.groupBy(data, curGroupBy);
-  return _.transform(
+  const curData = _groupBy(data, curGroupBy);
+  return transform(
     curData,
     (result, value, key) => {
       const name = curData[key][0][curGroupBy]!;

superset-frontend/src/SqlLab/actions/sqlLab.js

@@ -24,8 +24,7 @@ import {
   t,
   isFeatureEnabled,
 } from '@superset-ui/core';
-import invert from 'lodash/invert';
-import mapKeys from 'lodash/mapKeys';
+import { invert, mapKeys } from 'lodash';
 
 import { now } from 'src/utils/dates';
 import {

superset-frontend/src/SqlLab/components/App/index.jsx

@@ -22,7 +22,7 @@ import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 import { Redirect } from 'react-router-dom';
 import { css, styled, t } from '@superset-ui/core';
-import throttle from 'lodash/throttle';
+import { throttle } from 'lodash';
 import {
   LOCALSTORAGE_MAX_USAGE_KB,
   LOCALSTORAGE_WARNING_THRESHOLD,

superset-frontend/src/SqlLab/components/SqlEditor/index.tsx

@@ -44,8 +44,7 @@ import {
 } from '@superset-ui/core';
 import type { QueryEditor, SqlLabRootState } from 'src/SqlLab/types';
 import type { DatabaseObject } from 'src/features/databases/types';
-import debounce from 'lodash/debounce';
-import throttle from 'lodash/throttle';
+import { debounce, throttle, isBoolean, isEmpty } from 'lodash';
 import Modal from 'src/components/Modal';
 import Mousetrap from 'mousetrap';
 import Button from 'src/components/Button';
@@ -93,7 +92,6 @@ import {
 } from 'src/utils/localStorageHelpers';
 import { EmptyStateBig } from 'src/components/EmptyState';
 import getBootstrapData from 'src/utils/getBootstrapData';
-import { isBoolean, isEmpty } from 'lodash';
 import TemplateParamsEditor from '../TemplateParamsEditor';
 import SouthPane from '../SouthPane';
 import SaveQuery, { QueryPayload } from '../SaveQuery';

superset-frontend/src/SqlLab/components/TabbedSqlEditors/index.jsx

@@ -17,7 +17,7 @@
  * under the License.
  */
 import React from 'react';
-import pick from 'lodash/pick';
+import { pick } from 'lodash';
 import PropTypes from 'prop-types';
 import { EditableTabs } from 'src/components/Tabs';
 import { connect } from 'react-redux';

superset-frontend/src/SqlLab/hooks/useQueryEditor/index.ts

@@ -16,7 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import pick from 'lodash/pick';
+import { pick } from 'lodash';
 import { shallowEqual, useSelector } from 'react-redux';
 import { SqlLabRootState, QueryEditor } from 'src/SqlLab/types';
 

superset-frontend/src/SqlLab/utils/reduxStateToLocalStorageHelper.js

@@ -16,7 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import pick from 'lodash/pick';
+import { pick } from 'lodash';
 import { tableApiUtil } from 'src/hooks/apiResources/tables';
 import {
   BYTES_PER_CHAR,

superset-frontend/src/components/DropdownButton/index.tsx

@@ -19,7 +19,7 @@
 import React, { ReactNode } from 'react';
 import { AntdDropdown, AntdTooltip } from 'src/components';
 import { styled } from '@superset-ui/core';
-import kebabCase from 'lodash/kebabCase';
+import { kebabCase } from 'lodash';
 
 const StyledDropdownButton = styled.div`
   .ant-btn-group {

superset-frontend/src/components/Icons/index.tsx

@@ -18,7 +18,7 @@
  */
 
 import React from 'react';
-import _ from 'lodash';
+import { startCase } from 'lodash';
 import AntdEnhancedIcons from './AntdEnhanced';
 import Icon from './Icon';
 import IconType from './IconType';
@@ -168,7 +168,7 @@ const IconFileNames = [
 
 const iconOverrides: Record<string, React.FC<IconType>> = {};
 IconFileNames.forEach(fileName => {
-  const keyName = _.startCase(fileName).replace(/ /g, '');
+  const keyName = startCase(fileName).replace(/ /g, '');
   iconOverrides[keyName] = (props: IconType) => (
     <Icon fileName={fileName} {...props} />
   );

superset-frontend/src/components/Select/AsyncSelect.tsx

@@ -31,8 +31,7 @@ import React, {
 } from 'react';
 import { ensureIsArray, t, usePrevious } from '@superset-ui/core';
 import { LabeledValue as AntdLabeledValue } from 'antd/lib/select';
-import debounce from 'lodash/debounce';
-import { isEqual, uniq } from 'lodash';
+import { debounce, isEqual, uniq } from 'lodash';
 import Icons from 'src/components/Icons';
 import { getClientErrorObject } from 'src/utils/getClientErrorObject';
 import { FAST_DEBOUNCE, SLOW_DEBOUNCE } from 'src/constants';

superset-frontend/src/components/TableView/TableView.tsx

@@ -17,7 +17,7 @@
  * under the License.
  */
 import React, { useEffect, useRef } from 'react';
-import isEqual from 'lodash/isEqual';
+import { isEqual } from 'lodash';
 import { styled, t } from '@superset-ui/core';
 import { useFilters, usePagination, useSortBy, useTable } from 'react-table';
 import { Empty } from 'src/components';

superset-frontend/src/dashboard/components/DashboardBuilder/DashboardContainer.tsx

@@ -28,7 +28,7 @@ import {
   useComponentDidUpdate,
 } from '@superset-ui/core';
 import { ParentSize } from '@visx/responsive';
-import pick from 'lodash/pick';
+import { pick } from 'lodash';
 import Tabs from 'src/components/Tabs';
 import DashboardGrid from 'src/dashboard/containers/DashboardGrid';
 import {

superset-frontend/src/dashboard/components/SyncDashboardState/index.tsx

@@ -17,7 +17,7 @@
  * under the License.
  */
 import React, { useEffect } from 'react';
-import pick from 'lodash/pick';
+import { pick } from 'lodash';
 import { shallowEqual, useSelector } from 'react-redux';
 import { DashboardContextForExplore } from 'src/types/DashboardContextForExplore';
 import {

superset-frontend/src/dashboard/components/nativeFilters/FilterBar/Vertical.tsx

@@ -18,7 +18,7 @@
  */
 
 /* eslint-disable no-param-reassign */
-import throttle from 'lodash/throttle';
+import { throttle } from 'lodash';
 import React, {
   useEffect,
   useState,

superset-frontend/src/dashboard/util/charts/useChartIds.ts

@@ -17,7 +17,7 @@
  * under the License.
  */
 import { useSelector } from 'react-redux';
-import isEqual from 'lodash/isEqual';
+import { isEqual } from 'lodash';
 import { createSelector } from '@reduxjs/toolkit';
 import { RootState } from 'src/dashboard/types';
 import { useMemoCompare } from 'src/hooks/useMemoCompare';

superset-frontend/src/explore/components/DataTableControl/index.tsx

@@ -29,7 +29,7 @@ import {
 } from '@superset-ui/core';
 import { Global } from '@emotion/react';
 import { Column } from 'react-table';
-import debounce from 'lodash/debounce';
+import { debounce } from 'lodash';
 import { Space } from 'src/components';
 import { Input } from 'src/components/Input';
 import {

superset-frontend/src/explore/components/controls/DndColumnSelectControl/useResizeButton.tsx

@@ -18,7 +18,7 @@
  */
 
 import React, { useCallback, useEffect, useState } from 'react';
-import throttle from 'lodash/throttle';
+import { throttle } from 'lodash';
 import {
   POPOVER_INITIAL_HEIGHT,
   POPOVER_INITIAL_WIDTH,

superset-frontend/src/explore/components/controls/TextControl/index.tsx

@@ -18,7 +18,7 @@
  */
 import React from 'react';
 import { legacyValidateNumber, legacyValidateInteger } from '@superset-ui/core';
-import debounce from 'lodash/debounce';
+import { debounce } from 'lodash';
 import { FAST_DEBOUNCE } from 'src/constants';
 import ControlHeader from 'src/explore/components/ControlHeader';
 import { Input } from 'src/components/Input';

superset-frontend/src/explore/controlUtils/getFormDataWithDashboardContext.ts

@@ -16,7 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import isEqual from 'lodash/isEqual';
+import { isEqual } from 'lodash';
 import {
   AdhocFilter,
   ensureIsArray,

superset-frontend/src/filters/components/Select/SelectFilterPlugin.tsx

@@ -31,7 +31,7 @@ import {
   tn,
 } from '@superset-ui/core';
 import { LabeledValue as AntdLabeledValue } from 'antd/lib/select';
-import debounce from 'lodash/debounce';
+import { debounce } from 'lodash';
 import { useImmerReducer } from 'use-immer';
 import { Select } from 'src/components';
 import { SLOW_DEBOUNCE } from 'src/constants';

superset-frontend/src/utils/downloadAsImage.ts

@@ -18,7 +18,7 @@
  */
 import { SyntheticEvent } from 'react';
 import domToImage from 'dom-to-image-more';
-import kebabCase from 'lodash/kebabCase';
+import { kebabCase } from 'lodash';
 import { t, supersetTheme } from '@superset-ui/core';
 import { addWarningToast } from 'src/components/MessageToasts/actions';
 

superset-frontend/src/utils/downloadAsPdf.ts

@@ -18,7 +18,7 @@
  */
 import { SyntheticEvent } from 'react';
 import domToPdf from 'dom-to-pdf';
-import kebabCase from 'lodash/kebabCase';
+import { kebabCase } from 'lodash';
 import { logging, t } from '@superset-ui/core';
 import { addWarningToast } from 'src/components/MessageToasts/actions';