feat: lint report annotations on pr workflow [#14]

.github/workflows/pr-commit-linting.yaml

@@ -0,0 +1,31 @@
+name: PR and commit linting
+
+on:
+  pull_request:
+    types: [opened, edited, reopened, synchronize]
+  push:
+    branches:
+      - main
+
+jobs:
+  lint:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: lts/*
+
+      - name: Install dependencies
+        run: npm install
+
+      - name: Generate ESLint report
+        run: yarn run lint:report
+
+      - name: Annotate Code Linting Results
+        if: always()
+        uses: ataylorme/eslint-annotate-action@v3
+        with:
+          report-json: app/web/eslint-report.json
+          only-pr-files: true

.gitignore

@@ -61,3 +61,6 @@ xcuserdata
 */ios/build
 /ios/
 /android/
+
+# Linting
+eslint-report.json

eslint.config.js

@@ -1,18 +1,27 @@
+const react = require('eslint-plugin-react');
+const typescript = require('@typescript-eslint/eslint-plugin');
+const parser = require('@typescript-eslint/parser');
 const prettier = require('eslint-plugin-prettier');
 
-module.exports = {
-  env: {
-    browser: true,
-    es2021: true,
+module.exports = [
+  {
+    files: ['./**/*.{ts,tsx,js,jsx}'],
+    languageOptions: {
+      parser: parser,
+      globals: {
+        window: true,
+        document: true,
+      },
+    },
+    plugins: {
+      react,
+      '@typescript-eslint': typescript,
+      prettier,
+    },
+    rules: {
+      'prettier/prettier': ['error'],
+      semi: ['warn', 'always'],
+      quotes: ['error', 'single'],
+    },
   },
-  extends: ['eslint:recommended', 'plugin:react/recommended', 'plugin:@typescript-eslint/recommended', 'prettier'],
-  parserOptions: {
-    ecmaVersion: 12,
-    sourceType: 'module',
-  },
-  plugins: ['react', '@typescript-eslint', 'prettier'],
-  rules: {
-    'prettier/prettier': 'error',
-    semi: ['warn', 'always'],
-  },
-};
+];

eslint.config.mjs

@@ -0,0 +1,11 @@
+import globals from 'globals';
+import pluginJs from '@eslint/js';
+import tseslint from 'typescript-eslint';
+
+/** @type {import('eslint').Linter.Config[]} */
+export default [
+  { files: ['**/*.{js,mjs,cjs,ts,tsx,jsx}'] },
+  { languageOptions: { globals: { ...globals.browser, ...globals.node } } },
+  pluginJs.configs.recommended,
+  ...tseslint.configs.recommended,
+];

package.json

@@ -8,6 +8,9 @@
     "ios": "expo run:ios",
     "web": "expo start --web",
     "format": "npx prettier --write .",
+    "lint": "npx prettier --check .",
+    "lint:fix": "eslint './**/*.{js,jsx,ts,tsx}' --fix",
+    "lint:report": "eslint './**/*.{js,jsx,ts,tsx}' -o eslint-report.json --format json",
     "prepare": "husky install"
   },
   "husky": {
@@ -49,17 +52,19 @@
   },
   "devDependencies": {
     "@babel/core": "^7.20.0",
+    "@eslint/eslintrc": "^3.2.0",
     "@types/react": "~18.3.12",
     "@types/react-native": "~0.72.8",
     "@typescript-eslint/eslint-plugin": "^8.22.0",
     "@typescript-eslint/parser": "^8.22.0",
     "babel-preset-expo": "~12.0.0",
-    "eslint": "^9.19.0",
+    "eslint": "^9.20.1",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-prettier": "^5.2.3",
+    "eslint-plugin-react": "^7.37.4",
     "husky": "^8.0.0",
     "lint-staged": "^15.2.10",
-    "prettier": "^3.4.2",
+    "prettier": "^3.5.0",
     "pretty-quick": "^4.0.0",
     "react-native-svg-transformer": "^1.1.0",
     "typescript": "~5.3.3"