[CORL-678] Transition to eslint (#2634)

* chore: setup eslint

* chore: tslint checks with types & check for import order

* chore: complete eslint transition

* fix: tests

* fix: linting after rebase, faster lint for lint-staged

* chore: remove line

* fix: lint rules

* feat: add a11y linter and fix errors

* fix: tests

src/core/client/admin/App/App.tsx

@@ -1,10 +1,10 @@
-import TransitionControl from "coral-framework/testHelpers/TransitionControl";
 import { BrowserProtocol, queryMiddleware } from "farce";
 import { createFarceRouter, ElementsRenderer } from "found";
 import { Resolver } from "found-relay";
 import React, { FunctionComponent } from "react";
 
 import { CoralContextConsumer } from "coral-framework/lib/bootstrap/CoralContext";
+import TransitionControl from "coral-framework/testHelpers/TransitionControl";
 
 import routeConfig from "../routeConfig";
 import NotFound from "../routes/NotFound";
@@ -13,16 +13,17 @@ const Router = createFarceRouter({
   historyProtocol: new BrowserProtocol(),
   historyMiddlewares: [queryMiddleware],
   routeConfig,
-  renderReady: ({ elements }) => (
-    <>
-      <ElementsRenderer elements={elements} />
-      {// this enables router transition control when writing tests.
-      process.env.NODE_ENV === "test" && <TransitionControl />}
-    </>
-  ),
-  renderError: ({ error }) => (
-    <div>{error.status === 404 ? <NotFound /> : "Error"}</div>
-  ),
+  renderReady: function FarceRouterReady({ elements }) {
+    return (
+      <>
+        <ElementsRenderer elements={elements} />
+        {process.env.NODE_ENV === "test" && <TransitionControl />}
+      </>
+    );
+  },
+  renderError: function FarceRouterError({ error }) {
+    return <div>{error.status === 404 ? <NotFound /> : "Error"}</div>;
+  },
 });
 
 const App: FunctionComponent = () => (

src/core/client/admin/App/DecisionHistory/ApprovedComment.tsx

@@ -1,6 +1,8 @@
 import { Localized } from "fluent-react/compat";
 import React, { FunctionComponent } from "react";
 
+import { Typography } from "coral-ui/components";
+
 import ApprovedIcon from "./ApprovedIcon";
 import DecisionItem from "./DecisionItem";
 import DotDivider from "./DotDivider";
@@ -9,8 +11,6 @@ import GoToCommentLink from "./GoToCommentLink";
 import Info from "./Info";
 import Timestamp from "./Timestamp";
 
-import { Typography } from "coral-ui/components";
-
 interface Props {
   href: string;
   username: string;

src/core/client/admin/App/DecisionHistory/DecisionHistoryContainer.tsx

@@ -1,9 +1,10 @@
 import React from "react";
 import { graphql, RelayPaginationProp } from "react-relay";
 
+import { withPaginationContainer } from "coral-framework/lib/relay";
+
 import { DecisionHistoryContainer_viewer as ViewerData } from "coral-admin/__generated__/DecisionHistoryContainer_viewer.graphql";
 import { DecisionHistoryContainerPaginationQueryVariables } from "coral-admin/__generated__/DecisionHistoryContainerPaginationQuery.graphql";
-import { withPaginationContainer } from "coral-framework/lib/relay";
 
 import DecisionHistory from "./DecisionHistory";
 
@@ -45,7 +46,7 @@ export class DecisionHistoryContainer extends React.Component<
       error => {
         this.setState({ disableLoadMore: false });
         if (error) {
-          // tslint:disable-next-line:no-console
+          // eslint-disable-next-line no-console
           console.error(error);
         }
       }

src/core/client/admin/App/DecisionHistory/DecisionHistoryItemContainer.tsx

@@ -1,9 +1,10 @@
 import React from "react";
 import { graphql } from "react-relay";
 
-import { DecisionHistoryItemContainer_action as ActionData } from "coral-admin/__generated__/DecisionHistoryItemContainer_action.graphql";
 import { withFragmentContainer } from "coral-framework/lib/relay";
 
+import { DecisionHistoryItemContainer_action as ActionData } from "coral-admin/__generated__/DecisionHistoryItemContainer_action.graphql";
+
 import ApprovedComment from "./ApprovedComment";
 import RejectedComment from "./RejectedComment";
 
@@ -16,9 +17,7 @@ class DecisionHistoryItemContainer extends React.Component<
   DecisionHistoryItemContainerProps
 > {
   public render() {
-    const href = `/admin/moderate/comment/${
-      this.props.action.revision.comment.id
-    }`;
+    const href = `/admin/moderate/comment/${this.props.action.revision.comment.id}`;
     const username =
       (this.props.action.revision.comment.author &&
         this.props.action.revision.comment.author.username) ||

src/core/client/admin/App/DecisionHistory/DecisionHistoryQuery.tsx

@@ -1,6 +1,7 @@
-import { graphql, QueryRenderer } from "coral-framework/lib/relay";
 import React, { Component } from "react";
 
+import { graphql, QueryRenderer } from "coral-framework/lib/relay";
+
 import { DecisionHistoryQuery as QueryTypes } from "coral-admin/__generated__/DecisionHistoryQuery.graphql";
 
 import DecisionHistoryContainer from "./DecisionHistoryContainer";

src/core/client/admin/App/DecisionHistory/RejectedComment.tsx

@@ -1,6 +1,8 @@
 import { Localized } from "fluent-react/compat";
 import React, { FunctionComponent } from "react";
 
+import { Typography } from "coral-ui/components";
+
 import DecisionItem from "./DecisionItem";
 import DotDivider from "./DotDivider";
 import Footer from "./Footer";
@@ -9,8 +11,6 @@ import Info from "./Info";
 import RejectedIcon from "./RejectedIcon";
 import Timestamp from "./Timestamp";
 
-import { Typography } from "coral-ui/components";
-
 interface Props {
   href: string;
   username: string;

src/core/client/admin/App/Main.spec.tsx

@@ -1,7 +1,7 @@
-import { removeFragmentRefs } from "coral-framework/testHelpers";
 import React from "react";
 import { createRenderer } from "react-test-renderer/shallow";
 
+import { removeFragmentRefs } from "coral-framework/testHelpers";
 import { PropTypesOf } from "coral-framework/types";
 
 import Main from "./Main";

src/core/client/admin/App/MainRoute.tsx

@@ -1,10 +1,10 @@
 import React from "react";
 
-import { MainRouteQueryResponse } from "coral-admin/__generated__/MainRouteQuery.graphql";
-
 import { graphql } from "coral-framework/lib/relay";
 import { withRouteConfig } from "coral-framework/lib/router";
 
+import { MainRouteQueryResponse } from "coral-admin/__generated__/MainRouteQuery.graphql";
+
 import Main from "./Main";
 
 interface Props {

src/core/client/admin/App/Navigation/NavigationContainer.tsx

@@ -1,6 +1,5 @@
 import React from "react";
 
-import { NavigationContainer_viewer as ViewerData } from "coral-admin/__generated__/NavigationContainer_viewer.graphql";
 import { Ability, can } from "coral-admin/permissions";
 import { graphql, withFragmentContainer } from "coral-framework/lib/relay";
 import {
@@ -8,6 +7,8 @@ import {
   withSignOutMutation,
 } from "coral-framework/mutations";
 
+import { NavigationContainer_viewer as ViewerData } from "coral-admin/__generated__/NavigationContainer_viewer.graphql";
+
 import Navigation from "./Navigation";
 
 interface Props {

src/core/client/admin/App/UserMenu/UserMenuContainer.tsx

@@ -1,12 +1,13 @@
 import React from "react";
 
-import { UserMenuContainer_viewer as ViewerData } from "coral-admin/__generated__/UserMenuContainer_viewer.graphql";
 import { graphql, withFragmentContainer } from "coral-framework/lib/relay";
 import {
   SignOutMutation,
   withSignOutMutation,
 } from "coral-framework/mutations";
 
+import { UserMenuContainer_viewer as ViewerData } from "coral-admin/__generated__/UserMenuContainer_viewer.graphql";
+
 import UserMenu from "./UserMenu";
 
 interface Props {