Use react-app ESLint config and fix a few issues

remix-run · Sep 23, 2019 · c4a89e1 · c4a89e1
1 parent 6372049
commit c4a89e1
Show file tree

Hide file tree

Showing 8 changed files with 461 additions and 328 deletions.
diff --git a/website/.eslintrc b/website/.eslintrc
@@ -0,0 +1,7 @@
+{
+  "extends": "react-app",
+  "rules": {
+    "import/no-webpack-loader-syntax": "off",
+    "react/prop-types": "off"
+  }
+}
diff --git a/website/modules/.eslintrc b/website/modules/.eslintrc
diff --git a/website/modules/components/Home/Header.js b/website/modules/components/Home/Header.js
@@ -109,7 +109,7 @@ function Banner() {
               margin={`${isSmallScreen ? 20 : 20}px 0`}
               fontSize={isSmallScreen ? "80%" : null}
             >
-              Components are the heart of React's powerful, declarative
+              Components are the heart of React&apos;s powerful, declarative
               programming model. React Router is a collection of{" "}
               <b>navigational components</b> that compose declaratively with
               your application. Whether you want to have{" "}

diff --git a/website/modules/components/Home/Video.js b/website/modules/components/Home/Video.js
@@ -14,6 +14,7 @@ function Video() {
         boxShadow="0px 10px 30px hsla(0, 0%, 0%, 0.5)"
       >
         <iframe
+          title="Intro to React Router"
           width="100%"
           height="100%"
           src="https://www.youtube.com/embed/cKnc8gXn80Q"

diff --git a/website/modules/components/Logo.js b/website/modules/components/Logo.js
@@ -18,7 +18,7 @@ function Logo({ size = 230, shadow = true }) {
       }
     >
       <Block position="relative" top="-4%" textAlign="center" width="100%">
-        <img src={LogoImage} width="75%" />
+        <img src={LogoImage} alt="React Training" width="75%" />
       </Block>
     </Row>
   );

diff --git a/website/modules/components/MailingListSignup.js b/website/modules/components/MailingListSignup.js
@@ -73,12 +73,17 @@ class MailingListSignup extends Component {
               <Block textAlign="center">
                 <p>Thanks! You've been added to our list.</p>
                 <p style={{ marginTop: 10 }}>
-                  <a
-                    style={{ textDecoration: "underline", cursor: "pointer" }}
+                  <button
+                    style={{
+                      border: "none",
+                      textDecoration: "underline",
+                      fontSize: "1em",
+                      cursor: "pointer"
+                    }}
                     onClick={() => this.setState({ submitted: false })}
                   >
                     Reset
-                  </a>
+                  </button>
                 </p>
               </Block>
             ) : (

diff --git a/website/package.json b/website/package.json
@@ -4,7 +4,8 @@
   "version": "5.0.1",
   "scripts": {
     "build": "cross-env NODE_ENV=production webpack -p",
-    "start": "webpack-dev-server --inline --host 0.0.0.0"
+    "start": "webpack-dev-server --inline --host 0.0.0.0",
+    "lint": "eslint modules"
   },
   "dependencies": {
     "@codesandbox/react-embed": "0.0.14",
@@ -24,8 +25,10 @@
     "slug": "^0.9.2"
   },
   "devDependencies": {
+    "@typescript-eslint/eslint-plugin": "2.x",
+    "@typescript-eslint/parser": "2.x",
     "babel-core": "^6.26.3",
-    "babel-eslint": "^8.2.3",
+    "babel-eslint": "10.x",
     "babel-loader": "^7.1.2",
     "babel-plugin-dev-expression": "^0.2.1",
     "babel-plugin-transform-class-properties": "^6.24.1",
@@ -38,9 +41,13 @@
     "copy-webpack-plugin": "^4.0.1",
     "cross-env": "^5.2.0",
     "css-loader": "^2.1.1",
-    "eslint": "^4.19.1",
-    "eslint-plugin-import": "^2.12.0",
-    "eslint-plugin-react": "^7.9.1",
+    "eslint": "6.x",
+    "eslint-config-react-app": "^5.0.2",
+    "eslint-plugin-flowtype": "3.x",
+    "eslint-plugin-import": "2.x",
+    "eslint-plugin-jsx-a11y": "6.x",
+    "eslint-plugin-react": "7.x",
+    "eslint-plugin-react-hooks": "1.x",
     "file-loader": "^1.1.5",
     "html-loader": "^0.5.1",
     "html-webpack-plugin": "^3.2.0",