Update eslint and related dependencies

.eslintrc.json

@@ -32,15 +32,19 @@
     "Generator": false
   },
   "rules": {
-    "quotes": ["error", "double", { "avoidEscape": true }],
-    "max-len": ["off", 100],
+    "array-callback-return": "warn",
     "class-methods-use-this": "off",
-    "operator-assignment": "warn",
-    "react/jsx-filename-extension": "off",
-    "react/no-multi-comp": "off",
-    "react/prop-types": "off",
-    "react/require-default-props": "off",
-    "radix": "off",
+    "flowtype/no-types-missing-file-annotation": "off",
+    "import/extensions": ["warn", { "js": "never", "jsx": "always" }],
+    "import/no-cycle": "off",
+    "import/no-named-as-default-member": "warn",
+    "import/no-unresolved": "off",
+    "jsx-a11y/anchor-is-valid": "off",
+    "jsx-a11y/click-events-have-key-events": "off",
+    "jsx-a11y/no-static-element-interactions": "off",
+    "jsx-a11y/label-has-associated-control": "off",
+    "lines-between-class-members": ["warn", "always", { "exceptAfterSingleLine": true }],
+    "max-len": ["off", 100],
     "no-bitwise": "off",
     "no-confusing-arrow": "off",
     "no-continue": "warn",
@@ -50,26 +54,26 @@
     "no-multi-str": "off",
     "no-param-reassign": "warn",
     "no-plusplus": "off",
-    "no-restricted-syntax": "warn",
-    "array-callback-return": "warn",
     "no-restricted-properties": ["off", { "object": "Math", "property": "pow" }],
+    "no-restricted-syntax": "warn",
     "no-restricted-syntax": ["error", "ForInStatement"],
     "no-underscore-dangle": "off",
     "no-unused-vars": ["error", { "argsIgnorePattern": "^_" }],
-    "no-use-before-define": ["error", { "functions": false }],
+    "no-use-before-define": ["error", { "functions": false, "classes": false }],
     "one-var": ["error", "never"],
-    "import/extensions": ["warn", { "js": "never", "jsx": "always" }],
-    "import/no-unresolved": "off",
+    "operator-assignment": "warn",
+    "prefer-destructuring": "warn",
     "quote-props": ["error", "as-needed", { "numbers": true }],
+    "quotes": ["error", "double", { "avoidEscape": true }],
+    "radix": "off",
+    "react/destructuring-assignment": "off",
+    "react/jsx-filename-extension": "off",
+    "react/no-multi-comp": "off",
+    "react/prop-types": "off",
+    "react/require-default-props": "off",
     "react/sort-comp": [
       "error",
       { "order": ["type-annotations", "static-methods", "lifecycle", "everything-else", "render"] }
-    ],
-    "flowtype/no-types-missing-file-annotation": "off",
-    "prefer-destructuring": "warn",
-    "jsx-a11y/anchor-is-valid": "off",
-    "jsx-a11y/click-events-have-key-events": "off",
-    "jsx-a11y/no-static-element-interactions": "off",
-    "import/no-named-as-default-member": "warn"
+    ]
   }
 }

app/assets/javascripts/admin/auth/change_password_view.js

@@ -44,7 +44,7 @@ class ChangePasswordView extends React.PureComponent<Props, State> {
 
   handleConfirmBlur = (e: SyntheticInputEvent<>) => {
     const value = e.target.value;
-    this.setState({ confirmDirty: this.state.confirmDirty || !!value });
+    this.setState(prevState => ({ confirmDirty: prevState.confirmDirty || !!value }));
   };
 
   checkConfirm = (rule, value, callback) => {

app/assets/javascripts/admin/auth/finish_reset_password_view.js

@@ -38,7 +38,7 @@ class FinishResetPasswordView extends React.PureComponent<Props, State> {
 
   handleConfirmBlur = (e: SyntheticInputEvent<>) => {
     const value = e.target.value;
-    this.setState({ confirmDirty: this.state.confirmDirty || !!value });
+    this.setState(prevState => ({ confirmDirty: prevState.confirmDirty || !!value }));
   };
 
   checkPassword = (rule, value, callback) => {

app/assets/javascripts/admin/auth/registration_form.js

@@ -86,7 +86,7 @@ class RegistrationView extends React.PureComponent<Props, State> {
 
   handleConfirmBlur = (e: SyntheticInputEvent<>) => {
     const { value } = e.target;
-    this.setState({ confirmDirty: this.state.confirmDirty || !!value });
+    this.setState(prevState => ({ confirmDirty: prevState.confirmDirty || !!value }));
   };
 
   checkPassword = (rule, value, callback) => {

app/assets/javascripts/admin/onboarding.js

@@ -175,10 +175,10 @@ class OnboardingView extends React.PureComponent<StateProps, State> {
   }
 
   advanceStep = () => {
-    this.setState({
-      currentStep: this.state.currentStep + 1,
+    this.setState(prevState => ({
+      currentStep: prevState.currentStep + 1,
       datasetNameToImport: null,
-    });
+    }));
   };
 
   renderCreateOrganization() {

app/assets/javascripts/admin/project/project_list_view.js

@@ -100,9 +100,9 @@ class ProjectListView extends React.PureComponent<Props, State> {
 
         try {
           await deleteProject(project.name);
-          this.setState({
-            projects: this.state.projects.filter(p => p.id !== project.id),
-          });
+          this.setState(prevState => ({
+            projects: prevState.projects.filter(p => p.id !== project.id),
+          }));
         } catch (error) {
           handleGenericError(error);
         } finally {
@@ -117,9 +117,9 @@ class ProjectListView extends React.PureComponent<Props, State> {
     APICall: string => Promise<APIProjectType>,
   ) => {
     const updatedProject = await APICall(project.name);
-    this.setState({
-      projects: this.state.projects.map(p => (p.id === project.id ? updatedProject : p)),
-    });
+    this.setState(prevState => ({
+      projects: prevState.projects.map(p => (p.id === project.id ? updatedProject : p)),
+    }));
   };
 
   increaseProjectTaskInstances = async (project: APIProjectType) => {
@@ -131,9 +131,9 @@ class ProjectListView extends React.PureComponent<Props, State> {
             isLoading: true,
           });
           const updatedProject = await increaseProjectTaskInstances(project.name);
-          this.setState({
-            projects: this.state.projects.map(p => (p.id === project.id ? updatedProject : p)),
-          });
+          this.setState(prevState => ({
+            projects: prevState.projects.map(p => (p.id === project.id ? updatedProject : p)),
+          }));
         } catch (error) {
           handleGenericError(error);
         } finally {

app/assets/javascripts/admin/project/transfer_all_tasks_modal.js

@@ -109,8 +109,10 @@ class TransferAllTasksModal extends React.PureComponent<Props, State> {
   }
 
   handleSelectChange = (userId: string) => {
-    const selectedUser = this.state.users.find(user => user.id === userId);
-    this.setState({ selectedUser });
+    this.setState(prevState => {
+      const selectedUser = prevState.users.find(user => user.id === userId);
+      return { selectedUser };
+    });
   };
 
   render() {

app/assets/javascripts/admin/scripts/script_create_view.js

@@ -31,6 +31,7 @@ class ScriptCreateView extends React.PureComponent<Props, State> {
   state = {
     users: [],
   };
+
   componentDidMount() {
     this.fetchData();
     this.applyDefaults();

app/assets/javascripts/admin/scripts/script_list_view.js

@@ -76,9 +76,9 @@ class ScriptListView extends React.PureComponent<Props, State> {
           });
 
           await deleteScript(script.id);
-          this.setState({
-            scripts: this.state.scripts.filter(s => s.id !== script.id),
-          });
+          this.setState(prevState => ({
+            scripts: prevState.scripts.filter(s => s.id !== script.id),
+          }));
         } catch (error) {
           handleGenericError(error);
         } finally {

app/assets/javascripts/admin/statistic/project_progress_report_view.js

@@ -61,12 +61,15 @@ class ProjectProgressReportView extends React.PureComponent<{}, State> {
       this.fetchData();
     });
   };
+
   handleOpenSettings = () => {
     this.setState({ areSettingsVisible: true });
   };
+
   handleReload = () => {
     this.fetchData();
   };
+
   handleAutoReload = () => {
     this.fetchData(true);
   };

app/assets/javascripts/admin/task/task_annotation_view.js

@@ -57,9 +57,9 @@ class TaskAnnotationView extends React.PureComponent<Props & StateProps, State>
       okText: messages.yes,
       onOk: () =>
         deleteAnnotation(annotation.id, annotation.typ).then(() =>
-          this.setState({
-            annotations: this.state.annotations.filter(a => a.id !== annotation.id),
-          }),
+          this.setState(prevState => ({
+            annotations: prevState.annotations.filter(a => a.id !== annotation.id),
+          })),
         ),
     });
   };
@@ -75,12 +75,12 @@ class TaskAnnotationView extends React.PureComponent<Props & StateProps, State>
   };
 
   updateAnnotationState = (updatedAnnotation: APIAnnotationType) => {
-    this.setState({
+    this.setState(prevState => ({
       isTransferModalVisible: false,
-      annotations: this.state.annotations.map(
+      annotations: prevState.annotations.map(
         a => (a.id === updatedAnnotation.id ? updatedAnnotation : a),
       ),
-    });
+    }));
   };
 
   getDropdownMenu(annotation: APIAnnotationType) {

app/assets/javascripts/admin/task/task_create_form_view.js

@@ -108,6 +108,7 @@ class TaskCreateFormView extends React.PureComponent<Props, State> {
     isNMLSpecification: false,
     isUploading: false,
   };
+
   componentDidMount() {
     this.fetchData();
     this.applyDefaults();

app/assets/javascripts/admin/task/task_list_view.js

@@ -91,9 +91,9 @@ class TaskListView extends React.PureComponent<Props, State> {
             isLoading: true,
           });
           await deleteTask(task.id);
-          this.setState({
-            tasks: this.state.tasks.filter(t => t.id !== task.id),
-          });
+          this.setState(prevState => ({
+            tasks: prevState.tasks.filter(t => t.id !== task.id),
+          }));
         } catch (error) {
           handleGenericError(error);
         } finally {

app/assets/javascripts/admin/tasktype/task_type_list_view.js

@@ -81,9 +81,9 @@ class TaskTypeListView extends React.PureComponent<Props, State> {
           });
 
           await deleteTaskType(taskType.id);
-          this.setState({
-            tasktypes: this.state.tasktypes.filter(p => p.id !== taskType.id),
-          });
+          this.setState(prevState => ({
+            tasktypes: prevState.tasktypes.filter(p => p.id !== taskType.id),
+          }));
         } catch (error) {
           handleGenericError(error);
         } finally {

app/assets/javascripts/admin/team/team_list_view.js

@@ -76,9 +76,9 @@ class TeamListView extends React.PureComponent<Props, State> {
         try {
           this.setState({ isLoading: true });
           await deleteTeam(team.id);
-          this.setState({
-            teams: this.state.teams.filter(t => t.id !== team.id),
-          });
+          this.setState(prevState => ({
+            teams: prevState.teams.filter(t => t.id !== team.id),
+          }));
         } catch (error) {
           handleGenericError(error);
         } finally {
@@ -89,10 +89,10 @@ class TeamListView extends React.PureComponent<Props, State> {
   };
 
   createTeam = (newTeam: APITeamType) => {
-    this.setState({
+    this.setState(prevState => ({
       isTeamCreationModalVisible: false,
-      teams: this.state.teams.concat([newTeam]),
-    });
+      teams: prevState.teams.concat([newTeam]),
+    }));
   };
 
   renderPlaceholder() {

app/assets/javascripts/admin/time/time_line_view.js

@@ -55,38 +55,41 @@ class TimeLineView extends React.PureComponent<*, State> {
 
   async fetchTimeTrackingData() {
     if (this.state.user != null) {
+      /* eslint-disable react/no-access-state-in-setstate */
       const timeTrackingData = await getTimeTrackingForUser(
         this.state.user.id,
         this.state.dateRange[0],
         this.state.dateRange[1],
       );
 
       this.setState({ timeTrackingData }, this.calculateStats);
+      /* eslint-enable react/no-access-state-in-setstate */
     }
   }
 
   calculateStats() {
-    const totalTime = _.sumBy(this.state.timeTrackingData, timeSpan =>
-      moment.duration(timeSpan.time).asMilliseconds(),
-    );
-    const numberTasks = _.uniq(this.state.timeTrackingData.map(timeSpan => timeSpan.annotation))
-      .length;
-
-    // prevent devision by zero
-    const averageTimePerTask = numberTasks === 0 ? 0 : totalTime / numberTasks;
-
-    this.setState({
-      stats: {
-        totalTime,
-        numberTasks,
-        averageTimePerTask,
-      },
+    this.setState(prevState => {
+      const totalTime = _.sumBy(prevState.timeTrackingData, timeSpan =>
+        moment.duration(timeSpan.time).asMilliseconds(),
+      );
+      const numberTasks = _.uniq(prevState.timeTrackingData.map(timeSpan => timeSpan.annotation))
+        .length;
+
+      // prevent devision by zero
+      const averageTimePerTask = numberTasks === 0 ? 0 : totalTime / numberTasks;
+
+      return {
+        stats: {
+          totalTime,
+          numberTasks,
+          averageTimePerTask,
+        },
+      };
     });
   }
 
   handleUserChange = async (userId: number) => {
-    const user = this.state.users.find(u => u.id === userId);
-    await this.setState({ user });
+    await this.setState(prevState => ({ user: prevState.users.find(u => u.id === userId) }));
     this.fetchTimeTrackingData();
   };
 

app/assets/javascripts/admin/user/team_role_modal_view.js

@@ -89,20 +89,20 @@ class TeamRoleModalView extends React.PureComponent<TeamRoleModalPropType, State
 
     if (team) {
       const selectedTeam = { id: team.id, name: teamName, isTeamManager };
-      const newSelectedTeams = update(this.state.selectedTeams, {
-        [teamName]: { $set: selectedTeam },
-      });
-
-      this.setState({ selectedTeams: newSelectedTeams });
+      this.setState(prevState => ({
+        selectedTeams: update(prevState.selectedTeams, {
+          [teamName]: { $set: selectedTeam },
+        }),
+      }));
     }
   }
 
   handleUnselectTeam(teamName: string) {
-    const newSelectedTeams = update(this.state.selectedTeams, {
-      $unset: [teamName],
-    });
-
-    this.setState({ selectedTeams: newSelectedTeams });
+    this.setState(prevState => ({
+      selectedTeams: update(prevState.selectedTeams, {
+        $unset: [teamName],
+      }),
+    }));
   }
 
   getTeamComponent(team: APITeamType) {