chore: update eslint and add rules (#111)

* feat: update eslint pkgs + separate prettier from eslint (best practice)

* feat: add rules to eslint config

* fix: linting and code migration

* chore: lint and format

* fix: handle i18n promises

* ci: update lint including prettier check

* fix(eslint): revert removal of `eslint-config-prettier`

* build: set npm engine version to lts (20.x.x)

* ci: add husky for pre-commit hook (`npm test`)

* ci(eslint): specify file extensions to check

* ci(eslint): add back react rules

* ci: change pre-commit hook from `npm test` to `npm run lint`

* chore: update lockfile

---------

Co-authored-by: Federico Grandi <[email protected]>

.eslintrc.cjs

@@ -1,20 +1,49 @@
+/* eslint-env node */
 module.exports = {
   env: { browser: true, es2020: true },
   extends: [
     'eslint:recommended',
-    'plugin:@typescript-eslint/recommended', // Uses the recommended rules from the @typescript-eslint/eslint-plugin
+    'plugin:@typescript-eslint/recommended-type-checked',
     'plugin:react-hooks/recommended',
-    'plugin:prettier/recommended' // Enables eslint-plugin-prettier and eslint-config-prettier. This will display prettier errors as ESLint errors. Make sure this is always the last configuration in the extends array.
+    'plugin:react/recommended',
+    'plugin:react/jsx-runtime',
+    'prettier' // this prevents conflicts between eslint and prettier (eslint-config-prettier)
   ],
-  parser: '@typescript-eslint/parser', // Specifies the ESLint parser
+  parser: '@typescript-eslint/parser',
+  root: true,
   parserOptions: {
-    ecmaVersion: 'latest', // Allows for the parsing of modern ECMAScript features
-    sourceType: 'module' // Allows for the use of imports
+    ecmaVersion: 'latest',
+    sourceType: 'module',
+    tsconfigRootDir: __dirname,
+    project: true
   },
-  plugins: ['react-refresh'],
+  plugins: ['react-refresh', 'unused-imports'],
+  overrides: [
+    {
+      extends: ['plugin:@typescript-eslint/disable-type-checked'],
+      files: ['./**/*.{js,cjs}']
+    }
+  ],
   rules: {
     '@typescript-eslint/explicit-module-boundary-types': 'off',
     'react-refresh/only-export-components': 'warn',
-    'prettier/prettier': 'warn',
+
+    // no unused vars/imports
+    '@typescript-eslint/no-unused-vars': 'off',
+    'unused-imports/no-unused-imports': 'error',
+    'unused-imports/no-unused-vars': [
+      'warn',
+      {
+        vars: 'all',
+        varsIgnorePattern: '^_',
+        args: 'after-used',
+        argsIgnorePattern: '^_'
+      }
+    ]
+  },
+  settings: {
+    react: { // eslint-plugin-react
+      version: 'detect' 
+    }
   }
 }

.github/workflows/preview.yml

@@ -45,7 +45,7 @@ jobs:
         uses: actions/setup-node@v3
         if: ${{ github.event.action != 'closed' }} # Skipping these steps if the PR has been closed
         with:
-          node-version: '16'
+          node-version: '20'
           cache: npm
 
       - name: Install dependencies

.github/workflows/release.yml

@@ -12,7 +12,7 @@ jobs:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
         with:
-          node-version: 16
+          node-version: 20
           cache: npm
       - run: npm ci --ignore-scripts
       - run: npm run deploy:prod -- -r https://git:${DEPLOYMENT_PAT}@github.com/thetolproject/thetolproject.github.io.git -u "${GITHUB_ACTOR} <${GITHUB_ACTOR}@users.noreply.github.com>"

.github/workflows/test.yml

@@ -14,7 +14,7 @@ jobs:
       - uses: actions/checkout@v2
       - uses: actions/setup-node@v2
         with:
-          node-version: 16
+          node-version: 20
       - uses: actions/cache@v2
         id: cache
         with:
@@ -32,7 +32,7 @@ jobs:
       - uses: actions/checkout@v2
       - uses: actions/setup-node@v2
         with:
-          node-version: 16
+          node-version: 20
       - uses: actions/cache@v2
         id: cache
         with:
@@ -50,7 +50,7 @@ jobs:
       - uses: actions/checkout@v2
       - uses: actions/setup-node@v2
         with:
-          node-version: 16
+          node-version: 20
       - uses: actions/cache@v2
         id: cache
         with:
@@ -68,7 +68,7 @@ jobs:
       - uses: actions/checkout@v2
       - uses: actions/setup-node@v2
         with:
-          node-version: 16
+          node-version: 20
       - uses: actions/cache@v2
         id: cache
         with:
@@ -86,7 +86,7 @@ jobs:
       - uses: actions/checkout@v2
       - uses: actions/setup-node@v2
         with:
-          node-version: 16
+          node-version: 20
       - uses: actions/cache@v2
         id: cache
         with:

.husky/pre-commit

@@ -0,0 +1 @@
+npm run lint