chore: Update Betterer with eslint rules (#769)

* Update Betterer with eslint rules
Signed-off-by: Marcos Iglesias <miglesiasvalle@lyft.com>

* Update documentation
Signed-off-by: Marcos Iglesias <miglesiasvalle@lyft.com>

amundsen_application/static/.betterer.ts

+import { eslint } from '@betterer/eslint';
+
+export default {
+  'eslint': eslint({
+    '@typescript-eslint/no-shadow': 'error',
+    '@typescript-eslint/dot-notation': 'error',
+    '@typescript-eslint/naming-convention': 'error',
+    '@typescript-eslint/no-unused-vars': 'error',
+    'array-callback-return': 'error',
+    'consistent-return': 'error',
+    'default-case': 'error',
+    'import/first': 'error',
+    'import/no-cycle': 'error',
+    'import/order': 'error',
+    'no-case-declarations': 'error',
+    'no-extra-boolean-cast': 'error',
+    'no-multi-str': 'error',
+    'no-nested-ternary': 'error',
+    'no-param-reassign': 'error',
+    'no-restricted-globals': 'error',
+    'no-script-url': 'error',
+    'no-unneeded-ternary': 'error',
+    'no-useless-return': 'error',
+    'no-void': 'error',
+    'prefer-destructuring': 'error',
+    'prefer-promise-reject-errors': 'error',
+    'react/button-has-type': 'error',
+    'react/destructuring-assignment': 'error',
+    'react/jsx-boolean-value': 'error',
+    'react/jsx-closing-tag-location': 'error',
+    'react/jsx-props-no-spreading': 'error',
+    'react/no-access-state-in-setstate': 'error',
+    'react/no-did-update-set-state': 'error',
+    'react/prefer-stateless-function': 'error',
+    'react/sort-comp': 'error',
+    'react/static-property-placement': 'error',
+    'jsx-a11y/label-has-associated-control': 'error',
+    'jsx-a11y/control-has-associated-label': 'error',
+    'jsx-a11y/click-events-have-key-events': 'error',
+    'jsx-a11y/no-noninteractive-element-interactions': 'error',
+    'jsx-a11y/no-static-element-interactions': 'error',
+  }).include('./js/**/*.{ts,tsx,js,jsx}'),
+};
+

amundsen_application/static/package.json

@@ -55,7 +55,7 @@
     "@babel/preset-env": "^7.0.0",
     "@babel/preset-react": "^7.10.4",
     "@betterer/cli": "^3.0.3",
-    "@betterer/typescript": "^3.0.1",
+    "@betterer/eslint": "^3.1.2",
     "@storybook/addon-actions": "^6.0.26",
     "@storybook/addon-info": "^5.3.21",
     "@storybook/addon-links": "^6.0.26",

docs/developer_guide.md

@@ -60,10 +60,6 @@ Using Storybook makes it much easier to quickly iterate on components when getti
 
 We use TypeScript in our codebase, so `npm run tsc` conducts type checking. The build commands `npm run build` and `npm run dev-build` also conduct type checking, but are slower because they also build the source code. Run any of these commands and fix all failed checks before submitting a PR.
 
-Currently, we are trying to gradually make our TypeScript code more strict. For that, we are leveraging a project called [betterer][betterer], which keeps track of our errors when a given test is passed. Right now, we are running it with "strictNullChecks" set to true, so if any code change makes the results worse, it will break the build.
-
-[betterer]: https://github.com/phenomnomnominal/betterer
-
 ### Frontend Linting and Formatting
 
 We have in place two linters – [ESLint][eslint] for our JavaScript and TypeScript files, [Stylelint][stylelint] for our Sass files. If you have both ESLint and Stylelint extensions installed on your IDE, you should get warnings on your editor by default.
@@ -78,7 +74,9 @@ Whenever you want to run these tasks manually, you can execute:
 
 We also check your changed files and format them when you create a new commit, making it easy for you and for the project to keep a consistent code style. We do this leveraging [Husky][husky] and [Lint-staged][lint-staged].
 
-Looking forward, we aim at setting more strict best practices using ESLint and Stylelint. You can read about our plans to improve our TypeScript, Styles and general code style on these issues:
+Looking forward, we aim at setting more strict best practices using ESLint and Stylelint. For that, we are leveraging a project called [betterer][betterer], which keeps track of our errors when a given test is passed. You can run it using `npm run betterer` and it will break if you introduce any new eslint errors. If you want to ignore the new errors you can run `npm run betterer:update` to update the betterer.results file. We do not recommend adding or introducing new eslint errors.
+
+You can read about our plans to improve our TypeScript, Styles and general code style on these issues:
 
 - [Adopt Typescript Recommended Guidelines on the Frontend library][typescript-issue]
 - [Adopt Stylelint's Sass Guidelines on the Frontend library][stylelint-issue]
@@ -119,3 +117,4 @@ You can find the complete list of placeholder selectors for text in [this file](
 [airbnb-issue]: https://github.com/lyft/amundsen/issues/502
 [stylelint-issue]: https://github.com/lyft/amundsen/issues/501
 [semanticchecklist]: https://learn-the-web.algonquindesign.ca/topics/html-semantics-checklist/
+[betterer]: https://github.com/phenomnomnominal/betterer