refactor: bring down eslint warnings to zero (#1714)

- install `@eslint-react/eslint-plugin` dependency
- configure `@eslint-react/eslint-plugin` in eslint config
- modernize `lint` command in `package.json`
- disable or fix various reported lint issues
- fix `div` being nested in `p` for settings
- replace deprecated `event.keyCode` with `event.key`
- update isEscKeyPress method and unit tests which used deprecated `event.keyCode`
- allow `eslint` v8 as peer dependency for `@eslint-react/eslint-plugin`

3 files changed, 5 insertions, 0 deletions

diff --git a/src/features/todos/actions.ts b/src/features/todos/actions.ts
index c2000752f..27c7e489b 100644
--- a/src/features/todos/actions.ts
+++ b/src/features/todos/actions.ts
@@ -36,6 +36,7 @@ export const todoActions = createActionsFromDefinitions<TodoActionsType>(
       channel: PropTypes.string.isRequired,
       message: PropTypes.shape({
         action: PropTypes.string.isRequired,
+        // eslint-disable-next-line react/forbid-prop-types
         data: PropTypes.object,
       }),
     },
diff --git a/src/features/todos/components/TodosWebview.tsx b/src/features/todos/components/TodosWebview.tsx
index f9493d519..544768bbf 100644
--- a/src/features/todos/components/TodosWebview.tsx
+++ b/src/features/todos/components/TodosWebview.tsx
@@ -92,6 +92,7 @@ class TodosWebview extends Component<IProps, IState> {
   }
 
   componentDidMount() {
+    // eslint-disable-next-line @eslint-react/no-set-state-in-component-did-mount
     this.setState({
       width: this.props.width,
     });
@@ -173,6 +174,7 @@ class TodosWebview extends Component<IProps, IState> {
     }
 
     return (
+      // eslint-disable-next-line jsx-a11y/no-static-element-interactions
       <div
         className={classnames({
           [classes.root]: true,
@@ -185,6 +187,7 @@ class TodosWebview extends Component<IProps, IState> {
         ref={this.node}
         id="todos-panel"
       >
+        {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}
         <div
           className={classes.resizeHandler}
           style={{
diff --git a/src/features/todos/index.ts b/src/features/todos/index.ts
index 2fa8c3130..5465ed48a 100644
--- a/src/features/todos/index.ts
+++ b/src/features/todos/index.ts
@@ -3,6 +3,7 @@ import TodoStore from './store';
 export const todosStore = new TodoStore();
 
 export default function initTodos(stores: { todos?: any }, actions: any) {
+  // eslint-disable-next-line no-param-reassign
   stores.todos = todosStore;
   todosStore.start(stores, actions);
 }