feat(lint): resolve conflicts

admin-ui/app/colors.js

@@ -1,14 +1,13 @@
-import _ from 'lodash'
+import { chain, pick } from 'lodash'
 
 import colors from './colors.scss'
 
-const colorKeys = _
-  .chain(colors)
+const colorKeys = chain(colors)
   .keys()
   .filter((colorKey) => (
     colorKey.indexOf('bg-') === -1 &&
         colorKey.indexOf('fg-') === -1
   ))
   .value()
 
-export default _.pick(colors, colorKeys)
+export default pick(colors, colorKeys)

admin-ui/app/components/Avatar/Avatar.js

@@ -1,7 +1,11 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
-import _ from 'lodash'
+import filter from 'lodash/filter'
+import find from 'lodash/find'
+import reduce from 'lodash/reduce'
+import isEmpty from 'lodash/isEmpty'
+import first from 'lodash/first'
 
 const Avatar = (props) => {
   const avatarClass = classNames(
@@ -10,11 +14,11 @@ const Avatar = (props) => {
     props.className
   )
   const addOnsdArr = React.Children.toArray(props.addOns)
-  const badge = _.find(addOnsdArr, (avatarAddOn) =>
+  const badge = find(addOnsdArr, (avatarAddOn) =>
     avatarAddOn.type.addOnId === "avatar--badge")
-  const icons = _.filter(addOnsdArr, (avatarAddOn) =>
+  const icons = filter(addOnsdArr, (avatarAddOn) =>
     avatarAddOn.type.addOnId === "avatar--icon")
-  const isNested = _.reduce(addOnsdArr, (acc, avatarAddOn) =>
+  const isNested = reduce(addOnsdArr, (acc, avatarAddOn) =>
     acc || !!avatarAddOn.props.small, false)
 
   return (
@@ -27,12 +31,12 @@ const Avatar = (props) => {
         )
       }
       {
-        !_.isEmpty(icons) && (() => {
+        !isEmpty(icons) && (() => {
           switch(icons.length) {
           case 1:
             return (
               <div className="avatar__icon">
-                { _.first(icons) }
+                { first(icons) }
               </div>
             )
           default:

admin-ui/app/components/Avatar/AvatarImage.js

@@ -1,7 +1,7 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
-import _ from 'lodash'
+import omit from 'lodash/omit'
 
 import { Avatar } from './Avatar'
 import { AvatarFont } from './AvatarFont'
@@ -12,7 +12,7 @@ class AvatarImage extends React.PureComponent {
       placeholder: PropTypes.node,
       alt: PropTypes.string,
       className: PropTypes.string,
-      ..._.omit(Avatar.propTypes, ['children'])
+      ...omit(Avatar.propTypes, ['children'])
     };
 
     static defaultProps = {

admin-ui/app/components/EmptyLayout/EmptyLayoutSection.js

@@ -1,13 +1,13 @@
 import React from 'react'
-import _ from 'lodash'
+import isNumber from 'lodash'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
 
 const EmptyLayoutSection = (props) => {
   const sectionClass = classNames(props.className, 'fullscreen__section', {
     'fullscreen__section--center': props.center
   })
-  const maxWidth = _.isNumber(props.width) ? `${props.width}px` : props.width
+  const maxWidth = isNumber(props.width) ? `${props.width}px` : props.width
   return (
     <div className={ sectionClass }>
       {

admin-ui/app/components/FloatGrid/Col.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import _ from 'lodash'
+import { isUndefined, omit, pick, keys, extend } from 'lodash'
 import classNames from 'classnames'
 
 import { Col as BootstrapCol } from 'reactstrap'
@@ -18,8 +18,8 @@ const getCurrentbreakPoint = (width, breakPoints) => {
   let output = 'xl'
   for (const bp of breakPoints) {
     if (
-      (_.isUndefined(bp.min) || bp.min <= width) &&
-            (_.isUndefined(bp.max) || bp.max > width)
+      (isUndefined(bp.min) || bp.min <= width) &&
+            (isUndefined(bp.max) || bp.max > width)
     ) {
       output = bp.id
     }
@@ -66,8 +66,8 @@ export class Col extends React.Component {
 
     render() {
       const { active, children, className, trueSize } = this.props
-      const bsColumnProps = _.pick(this.props, ['xl', 'lg', 'md', 'sm', 'xs'])
-      const otherProps = _.omit(this.props, [..._.keys(Col.propTypes),
+      const bsColumnProps = pick(this.props, ['xl', 'lg', 'md', 'sm', 'xs'])
+      const otherProps = omit(this.props, [...keys(Col.propTypes),
         'minW', 'maxW', 'minH', 'maxH', 'moved', 'static', 'isDraggable', 'isResizable'])
       const floatColBpId = trueSize ? getCurrentbreakPoint(trueSize.wPx, breakPoints) : 'xl'
       const floatColClasses = classNames(className, 'float-col',
@@ -79,7 +79,7 @@ export class Col extends React.Component {
         </div>
       ) : (
         <BootstrapCol
-          { ...(_.extend(bsColumnProps, otherProps)) }
+          { ...(extend(bsColumnProps, otherProps)) }
           className={ classNames(className, 'pb-3') }
         >
           { children }

admin-ui/app/components/FloatGrid/Row.js

@@ -1,6 +1,16 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import _ from 'lodash'
+import { 
+  keys,
+  map,
+  isEqual,
+  isEmpty,
+  drop,
+  isUndefined,
+  pick,
+  indexOf,
+  max
+} from 'lodash'
 import {
   WidthProvider,
   Responsive
@@ -14,10 +24,10 @@ const responsiveBreakpoints = {
   xl: 1139, lg: 959, md: 719, sm: 539, xs: 0
   //xl: Number.MAX_VALUE, lg: 1199, md: 991, sm: 767, xs: 576
 }
-const breakPointSteps = _.keys(responsiveBreakpoints)
+const breakPointSteps = keys(responsiveBreakpoints)
 const TOTAL_ROW = 12
 
-const simplifyChildrenArray = (reactChildren) => _.map(reactChildren, child => (
+const simplifyChildrenArray = (reactChildren) => map(reactChildren, child => (
   { ...child, key: child.key.replace(/\.\$/g, '') }
 ))
 
@@ -40,8 +50,8 @@ export class Row extends React.Component {
     initialDebounceTimeout = false;
 
     componentDidUpdate(nextProps) {
-      if (!_.isEqual(nextProps.gridSize, this.props.gridSize)) {
-        if (!_.isEmpty(this._lastLayouts)) {
+      if (!isEqual(nextProps.gridSize, this.props.gridSize)) {
+        if (!isEmpty(this._lastLayouts)) {
           this._updateTrueColSizes(this._lastLayouts[this.state.activeLayout])
         }
       }
@@ -121,8 +131,8 @@ export class Row extends React.Component {
      */
     _findClosestBreakpoint = (breakpoint, definition) => {
       let found = 12
-      for (const bp of _.drop(breakPointSteps, _.indexOf(breakPointSteps, breakpoint))) {
-        if (!_.isUndefined(definition[bp])) {
+      for (const bp of drop(breakPointSteps, indexOf(breakPointSteps, breakpoint))) {
+        if (!isUndefined(definition[bp])) {
           found = definition[bp]
         }
       }
@@ -139,7 +149,7 @@ export class Row extends React.Component {
         for (const child of childrenArray) {
           let bpData = { }
           // Save the props for current child and breakpoint
-          const config = _.pick(child.props, [
+          const config = pick(child.props, [
             'i',
             'h', 'minH', 'maxH',
             'minW', 'maxW',
@@ -153,7 +163,7 @@ export class Row extends React.Component {
             ...{
               // Set the x to the calculated value or take from the 
               // props if defined for controlled type
-              x: _.isUndefined(child.props[`${breakPoint}X`]) ?
+              x: isUndefined(child.props[`${breakPoint}X`]) ?
                 rowCounter : child.props[`${breakPoint}X`],
               h: child.props[`${breakPoint}H`] || config.h || 1,
               minH: config.minH || (config.h || 1),
@@ -163,14 +173,14 @@ export class Row extends React.Component {
                         this._findClosestBreakpoint(breakPoint, child.props),
             // Set the y to the calculated value or take from the 
             // props if defined for controlled type
-            y: _.isUndefined(child.props[`${breakPoint}Y`]) ?
+            y: isUndefined(child.props[`${breakPoint}Y`]) ?
               y : child.props[`${breakPoint}Y`]
           })
           rowChildren = [...rowChildren, bpData]
           rowCounter += bpData.w
           if (rowCounter + bpData.x > TOTAL_ROW) {
             // Increase by the largest found height
-            y += _.max(_.map(rowChildren, 'h'))
+            y += max(map(rowChildren, 'h'))
             rowCounter = 0
             rowChildren = []
           }

admin-ui/app/components/HolderProvider/HolderTextProvider.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import _ from 'lodash'
+import omit from 'lodash/omit'
 import uid from 'uuid/v4'
 import qs from 'query-string'
 
@@ -78,7 +78,7 @@ class HolderTextProvider extends React.Component {
     render() {
       const onlyChild = React.Children.only(this.props.children)
 
-      const phProps = _.omit(this.props, ['children', 'width', 'height'])
+      const phProps = omit(this.props, ['children', 'width', 'height'])
       const phPropsQuery = qs.stringify(phProps)
 
       return React.cloneElement(onlyChild, {

admin-ui/app/components/InputGroupAddon/InputGroupAddon.js

@@ -1,5 +1,6 @@
 import React from 'react'
-import _ from 'lodash'
+import some from 'lodash/some'
+import includes from 'lodash/includes'
 
 import {
   InputGroupAddon as BsInputGroupAddon
@@ -8,9 +9,9 @@ import {
 const InputGroupAddon = (props) => {
   const { children, ...otherProps } = props
   const childArr = React.Children.toArray(children)
-  const isFa = _.some(childArr, (child) =>
-    React.isValidElement(child) && child.props.className && _.includes(child.props.className, 'fa'))
-  const isCheckRadio = _.some(childArr, (child) =>
+  const isFa = some(childArr, (child) =>
+    React.isValidElement(child) && child.props.className && includes(child.props.className, 'fa'))
+  const isCheckRadio = some(childArr, (child) =>
     React.isValidElement(child) && (child.props.type === 'radio' || child.props.type === 'checkbox'))
 
   const child = isFa || isCheckRadio ? (

admin-ui/app/components/Layout/Layout.js

@@ -4,7 +4,15 @@ import PropTypes from 'prop-types'
 import classNames from 'classnames'
 import { Helmet } from 'react-helmet'
 import { withRouter } from 'react-router-dom'
-import _ from 'lodash'
+import {
+  filter,
+  forOwn,
+  isUndefined,
+  compact,
+  differenceBy,
+  pick,
+  map 
+} from 'lodash'
 
 import { LayoutContent } from './LayoutContent'
 import { LayoutNavbar } from './LayoutNavbar'
@@ -26,7 +34,7 @@ const findChildByType = (children, targetType) => {
   return result
 }
 const findChildrenByType = (children, targetType) => {
-  return _.filter(React.Children.toArray(children), (child) =>
+  return filter(React.Children.toArray(children), (child) =>
     child.type.layoutPartName === targetType.layoutPartName)
 }
 
@@ -73,12 +81,12 @@ class Layout extends React.Component {
         const { screenSize } = this.state
         let currentScreenSize
 
-        _.forOwn(responsiveBreakpoints, (value, key) => {
+        forOwn(responsiveBreakpoints, (value, key) => {
           const queryParts = [
-            `${ _.isUndefined(value.min) ? '' : `(min-width: ${value.min}px)` }`,
-            `${ _.isUndefined(value.max) ? '' : `(max-width: ${value.max}px)`}`
+            `${ isUndefined(value.min) ? '' : `(min-width: ${value.min}px)` }`,
+            `${ isUndefined(value.max) ? '' : `(max-width: ${value.max}px)`}`
           ]
-          const query = _.compact(queryParts).join(' and ')
+          const query = compact(queryParts).join(' and ')
 
           if (window.matchMedia(query).matches) {
             currentScreenSize = key
@@ -196,15 +204,15 @@ class Layout extends React.Component {
     }
 
     setElementsVisibility(elements) {
-      this.setState(_.pick(elements, ['sidebarHidden', 'navbarHidden', 'footerHidden']))
+      this.setState(pick(elements, ['sidebarHidden', 'navbarHidden', 'footerHidden']))
     }
 
     render() {
       const { children, favIcons } = this.props
       const sidebar = findChildByType(children, LayoutSidebar)
       const navbars = findChildrenByType(children, LayoutNavbar)
       const content = findChildByType(children, LayoutContent)
-      const otherChildren = _.differenceBy(
+      const otherChildren = differenceBy(
         React.Children.toArray(children),
         [
           sidebar,
@@ -237,7 +245,7 @@ class Layout extends React.Component {
             <link rel="canonical" href={ config.siteCannonicalUrl } />
             <meta name="description" content={ this.state.pageDescription } />
             {
-              _.map(favIcons, (favIcon, index) => (
+              map(favIcons, (favIcon, index) => (
                 <link { ...favIcon } key={ index } />
               ))
             }

admin-ui/app/components/Layout/setupPage.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import _ from 'lodash'
+import pick from 'lodash/pick'
 import PropTypes from 'prop-types'
 import { withPageConfig } from './withPageConfig'
 
@@ -10,7 +10,7 @@ export const setupPage = (startupConfig) =>
               pageConfig: PropTypes.object
             }
             componentDidMount() {
-              this.prevConfig = _.pick(this.props.pageConfig,
+              this.prevConfig = pick(this.props.pageConfig,
                 ['pageTitle', 'pageDescription', 'pageKeywords'])
               this.props.pageConfig.changeMeta(startupConfig)
             }

admin-ui/app/components/OuterClick/OuterClick.js

@@ -1,7 +1,7 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 import ReactDOM from 'react-dom'
-import _ from 'lodash'
+import some from 'lodash/some'
 
 // Safely gets the browser document object,
 // returns a simple mock for server rendering purposes
@@ -54,7 +54,7 @@ class OuterClick extends React.Component {
           // eslint-disable-next-line react/no-find-dom-node
           const domElement = ReactDOM.findDOMNode(this.elementRef)
 
-          const isExcluded = _.some(this.props.excludedElements,
+          const isExcluded = some(this.props.excludedElements,
             // eslint-disable-next-line react/no-find-dom-node
             (element) => element && ReactDOM.findDOMNode(element).contains(evt.target))