MNT ESLint issues (#1070)

client/src/components/ElementActions/tests/AbstractAction-test.js

@@ -2,8 +2,8 @@
 /* global jest, test, describe, it, expect */
 
 import React from 'react';
-import AbstractAction from '../AbstractAction';
 import { render, fireEvent } from '@testing-library/react';
+import AbstractAction from '../AbstractAction';
 
 function makeProps(obj = {}) {
   return {

client/src/components/ElementActions/tests/ArchiveAction-test.js

@@ -2,8 +2,8 @@
 /* global jest, test, describe, it, expect */
 
 import React from 'react';
-import { Component as ArchiveAction } from '../ArchiveAction';
 import { render, fireEvent } from '@testing-library/react';
+import { Component as ArchiveAction } from '../ArchiveAction';
 
 const WrappedComponent = (props) => <div>{props.children}</div>;
 const ActionComponent = ArchiveAction(WrappedComponent);

client/src/components/ElementActions/tests/DuplicateAction-test.js

@@ -2,8 +2,8 @@
 /* global jest, test, describe, it, expect */
 
 import React from 'react';
-import { Component as DuplicateAction } from '../DuplicateAction';
 import { render } from '@testing-library/react';
+import { Component as DuplicateAction } from '../DuplicateAction';
 
 const WrappedComponent = (props) => <div>{props.children}</div>;
 const ActionComponent = DuplicateAction(WrappedComponent);

client/src/components/ElementActions/tests/PublishAction-test.js

@@ -1,8 +1,8 @@
 /* eslint-disable import/no-extraneous-dependencies */
 /* global jest, test, describe, it, expect, window */
 import React from 'react';
-import { Component as PublishAction } from '../PublishAction';
 import { fireEvent, render } from '@testing-library/react';
+import { Component as PublishAction } from '../PublishAction';
 
 jest.mock('isomorphic-fetch', () =>
   () => Promise.resolve({

client/src/components/ElementActions/tests/SaveAction-test.js

@@ -2,8 +2,8 @@
 /* global jest, test, describe, it, expect */
 
 import React from 'react';
-import { Component as SaveAction } from '../SaveAction';
 import { render } from '@testing-library/react';
+import { Component as SaveAction } from '../SaveAction';
 
 jest.mock('isomorphic-fetch', () =>
   () => Promise.resolve({

client/src/components/ElementActions/tests/UnpublishAction-test.js

@@ -2,8 +2,8 @@
 /* global jest, test, describe, it, expect, window */
 
 import React from 'react';
-import { Component as UnpublishAction } from '../UnpublishAction';
 import { fireEvent, render } from '@testing-library/react';
+import { Component as UnpublishAction } from '../UnpublishAction';
 
 window.jQuery = {
   noticeAdd: jest.fn()

client/src/components/ElementEditor/AddNewButton.js

@@ -17,9 +17,9 @@ class AddNewButton extends Component {
   }
 
   toggle() {
-    this.setState({
-      popoverOpen: !this.state.popoverOpen
-    });
+    this.setState((prevState) => ({
+      popoverOpen: !prevState.popoverOpen,
+    }));
   }
 
   /**

client/src/components/ElementEditor/Element.js

@@ -121,11 +121,11 @@ class Element extends Component {
    * Prevents the Element from being expanded in case a loading error occurred.
    * This gets triggered from the InlineEditForm component.
    */
-   handleLoadingError() {
+  handleLoadingError() {
     this.setState({
       loadingError: true
     });
-   }
+  }
 
   /**
    * Dispatcher to Tabs redux store for this element's tabset
@@ -187,9 +187,9 @@ class Element extends Component {
     }
 
     if (type.inlineEditable && !loadingError) {
-      this.setState({
-        previewExpanded: !this.state.previewExpanded
-      });
+      this.setState((prevState) => ({
+        previewExpanded: !prevState.previewExpanded
+      }));
       return;
     }
 
@@ -325,9 +325,7 @@ function mapStateToProps(state, ownProps) {
     state.tabs &&
     state.tabs.fields &&
     state.tabs.fields[uniqueFieldId] &&
-    state.tabs.fields[uniqueFieldId].activeTab
-  ;
-
+    state.tabs.fields[uniqueFieldId].activeTab;
   return {
     tabSetName,
     activeTab,

client/src/components/ElementEditor/ElementActions.js

@@ -24,10 +24,9 @@ class ElementActions extends Component {
    */
   handleEditTabsClick(event) {
     const { handleEditTabsClick } = this.props;
-     handleEditTabsClick(event.target.name);
+    handleEditTabsClick(event.target.name);
   }
 
-
   /**
    * Render buttons for the edit form tabs that will be a part of the edit form (if they exist)
    *
@@ -80,7 +79,6 @@ class ElementActions extends Component {
   render() {
     const { children, id, ActionMenuComponent } = this.props;
 
-
     const dropdownToggleClassNames = [
       'element-editor-header__actions-toggle',
       'btn',
@@ -92,7 +90,7 @@ class ElementActions extends Component {
     return (
       <ActionMenuComponent
         id={`element-editor-actions-${id}`}
-        className={'element-editor-header__actions-dropdown'}
+        className="element-editor-header__actions-dropdown"
         dropdownMenuProps={{ right: true }}
         dropdownToggleClassNames={dropdownToggleClassNames}
       >
@@ -136,4 +134,3 @@ export default compose(
     () => 'ElementEditor.ElementList.Element'
   )
 )(ElementActions);
-

client/src/components/ElementEditor/ElementEditor.js

@@ -132,20 +132,20 @@ const elementFormSelector = createSelector([
   (state) => {
     const elementFormState = state.form.formState.element;
 
-  if (!elementFormState) {
-    return {};
-  }
+    if (!elementFormState) {
+      return {};
+    }
 
-  return elementFormState;
+    return elementFormState;
   }], (elementFormState) => {
-    const formNamePattern = loadElementFormStateName('[0-9]+');
+  const formNamePattern = loadElementFormStateName('[0-9]+');
 
   return Object.keys(elementFormState)
-  .filter(key => key.match(formNamePattern))
-  .reduce((accumulator, key) => ({
-    ...accumulator,
-    [key]: elementFormState[key].values
-  }), {});
+    .filter(key => key.match(formNamePattern))
+    .reduce((accumulator, key) => ({
+      ...accumulator,
+      [key]: elementFormState[key].values
+    }), {});
 });
 
 function mapStateToProps(state) {
@@ -173,4 +173,3 @@ export default compose(
   ),
   sortBlockMutation
 )(ElementEditor);
-

client/src/components/ElementEditor/Header.js

@@ -15,7 +15,6 @@ import getFormState from 'lib/getFormState';
 import { elementDragSource } from 'lib/dragHelpers';
 import { getEmptyImage } from 'react-dnd-html5-backend';
 
-
 class Header extends Component {
   constructor(props) {
     super(props);
@@ -79,11 +78,10 @@ class Header extends Component {
     );
   }
 
-
   toggle() {
-    this.setState({
-      tooltipOpen: !this.state.tooltipOpen
-    });
+    this.setState((prevState) => ({
+      tooltipOpen: !prevState.tooltipOpen
+    }));
   }
 
   /**

client/src/components/ElementEditor/HoverBar.js

@@ -1,10 +1,10 @@
 /* global window */
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
-import prefixClassNames from '../../lib/prefixClassNames';
 import { inject } from 'lib/Injector';
 import { elementTypeType } from 'types/elementTypeType';
 import i18n from 'i18n';
+import prefixClassNames from '../../lib/prefixClassNames';
 
 const classNames = prefixClassNames('element-editor__hover-bar');
 
@@ -63,9 +63,9 @@ class HoverBar extends Component {
   }
 
   toggle() {
-    this.setState({
-      popoverOpen: !this.state.popoverOpen
-    });
+    this.setState((prevState) => ({
+      popoverOpen: !prevState.popoverOpen
+    }));
   }
 
   render() {
@@ -78,7 +78,6 @@ class HoverBar extends Component {
   }
 }
 
-
 HoverBar.propTypes = {
   elementTypes: PropTypes.arrayOf(elementTypeType).isRequired,
   elementId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,

client/src/components/ElementEditor/tests/Content-test.js

@@ -2,8 +2,8 @@
 /* global jest, test, describe, it, expect */
 
 import React from 'react';
-import { Component as Content } from '../Content';
 import { render } from '@testing-library/react';
+import { Component as Content } from '../Content';
 
 function makeProps(obj = {}) {
   return {

client/src/components/ElementEditor/tests/Element-test.js

@@ -2,8 +2,8 @@
 /* global jest, test, describe, it, expect */
 
 import React from 'react';
-import { Component as Element } from '../Element';
 import { render } from '@testing-library/react';
+import { Component as Element } from '../Element';
 
 function makeProps(obj = {}) {
   return {

client/src/components/ElementEditor/tests/ElementActions-test.js

@@ -2,9 +2,9 @@
 /* global jest, test, describe, it, expect */
 
 import React from 'react';
-import { Component as ElementActions } from '../ElementActions';
 import AbstractAction from 'components/ElementActions/AbstractAction';
 import { render } from '@testing-library/react';
+import { Component as ElementActions } from '../ElementActions';
 
 function makeProps(obj = {}) {
   return {
@@ -34,7 +34,6 @@ test('ElementActions should map input tabs into an array of buttons', () => {
   expect(container.querySelectorAll('.dropdown-divider')).toHaveLength(0);
 });
 
-
 test('ElementActions should render a divider when CMS tab actions and default actions are rendered', () => {
   const { container } = render(
     <ElementActions {...makeProps()}>

client/src/components/ElementEditor/tests/ElementEditor-test.js

@@ -2,8 +2,8 @@
 /* global jest, test, describe, it, expect */
 
 import React from 'react';
-import { Component as ElementEditor } from '../ElementEditor';
 import { render, screen } from '@testing-library/react';
+import { Component as ElementEditor } from '../ElementEditor';
 
 function makeProps(obj = {}) {
   return {

client/src/components/ElementEditor/tests/ElementList-test.js

@@ -2,8 +2,8 @@
 /* global jest, test, describe, it, expect */
 
 import React from 'react';
-import { Component as ElementList } from '../ElementList';
 import { render } from '@testing-library/react';
+import { Component as ElementList } from '../ElementList';
 
 const elementTypes = [
   {

client/src/components/ElementEditor/tests/Header-test.js

@@ -2,8 +2,8 @@
 /* global jest, test, describe, it, expect */
 
 import React from 'react';
+import { fireEvent, render, screen } from '@testing-library/react';
 import { Component as Header } from '../Header';
-import { fireEvent, render, screen, waitFor } from '@testing-library/react';
 
 // Fixes issue when rendering reactstrap tooltip
 // Warning: `NaN` is an invalid value for the `left` css style property.

client/src/components/ElementEditor/tests/HoverBar-test.js

@@ -2,8 +2,8 @@
 /* global jest, test, describe, it, expect */
 
 import React from 'react';
-import { Component as HoverBar } from '../HoverBar';
 import { render } from '@testing-library/react';
+import { Component as HoverBar } from '../HoverBar';
 
 function makeProps(obj = {}) {
   return {

client/src/components/ElementEditor/tests/Summary-test.js

@@ -2,8 +2,8 @@
 /* global jest, test, describe, it, expect */
 
 import React from 'react';
-import Summary from '../Summary';
 import { render } from '@testing-library/react';
+import Summary from '../Summary';
 
 function makeProps(obj = {}) {
   return {

client/src/components/HistoricElementView/HistoricElementView.js

@@ -25,15 +25,15 @@ const ElementalAreaHistoryFactory = (FieldGroup) =>
       return (
         <Tag className={classNames}>
           {legend}
-          <div className={'elemental-preview elemental-preview--historic'}>
+          <div className="elemental-preview elemental-preview--historic">
             {data.ElementEditLink &&
               <a className="elemental-preview__link" href={data.ElementEditLink}>
                 <span className="elemental-preview__link-text">{i18n._t('HistoricElementView.VIEW_BLOCK_HISTORY', 'Block history')}</span>
                 <i className="font-icon-angle-right btn--icon-lg elemental-preview__link-caret" />
               </a>
             }
-            <div className={'elemental-preview__icon'}><i className={data.ElementIcon} /></div>
-            <div className={'elemental-preview__detail'}>
+            <div className="elemental-preview__icon"><i className={data.ElementIcon} /></div>
+            <div className="elemental-preview__detail">
               <h3>{data.ElementTitle} <small>{data.ElementType}</small></h3>
             </div>
           </div>

client/src/components/HistoricElementView/tests/HistoricElementView-test.js

@@ -1,8 +1,8 @@
 /* global jest, test, describe, beforeEach, it, expect */
 
 import React from 'react';
-import ElementalAreaHistoryFactory from '../HistoricElementView';
 import { render } from '@testing-library/react';
+import ElementalAreaHistoryFactory from '../HistoricElementView';
 
 function makeProps(obj = {}) {
   return {
@@ -21,9 +21,11 @@ class FieldGroupStub extends React.Component {
   getLegend() {
     return 'nah';
   }
+
   getClassName() {
     return 'ok';
   }
+
   render() {
     return <div className="test-field-group-stub">Group</div>;
   }