@open-turo/eslint-config-react 1.0.1 → 1.1.0

package/.github/CODEOWNERS

@@ -0,0 +1 @@
+* @open-turo/node

package/.github/dependabot.yaml

@@ -2,6 +2,8 @@ version: 2
 updates:
   - package-ecosystem: npm
     directory: /
+    reviewers:
+      - "open-turo/node"
     schedule:
       interval: weekly
     commit-message:

package/.github/workflows/ci.yaml

@@ -8,12 +8,12 @@ jobs:
     name: Lint
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
         with:
           fetch-depth: 0
-      - uses: wagoid/commitlint-github-action@v4
-      - uses: actions/setup-python@v2
-      - uses: KeisukeYamashita/setup-release@v1.0.2
-        with:
-          repository: rhysd/actionlint
-      - uses: pre-commit/action@v2.0.0
+      - name: Download actionlint
+        run: |
+          mkdir -p "$HOME/bin"
+          bash <(curl https://raw.githubusercontent.com/rhysd/actionlint/main/scripts/download-actionlint.bash) latest "$HOME/bin"
+          echo "${HOME}/bin" >> "$GITHUB_PATH"
+      - uses: open-turo/action-pre-commit@v1

package/.pre-commit-config.yaml

@@ -7,7 +7,7 @@ repos:
       - id: end-of-file-fixer
       - id: trailing-whitespace
   - repo: https://github.com/pre-commit/mirrors-prettier
-    rev: v2.5.1
+    rev: v2.7.1
     hooks:
       - id: prettier
         stages: [commit]

package/README.md

@@ -1,6 +1,17 @@
 # `@open-turo/eslint-config-react`
 
-Turo eslint configuration for react. The config expects that Typescript is being used.
+Turo eslint configuration for react. The config expects that Typescript is being used as it extends
+`eslint-config-typescript`.
+
+## Relevant notes
+
+The `eslint` configurations in this repo extend `@open-turo/eslint-config-typescript/legacy`; as it is the base TS
+eslint config that supports our existing front-end codebase.
+
+However, if you are creating a new React project and you think you would benefit from having the configurations in this
+repository extend the default `@open-turo/eslint-config-typescript` config instead, please raise an issue and/or feel
+free to create a PR to add a new default that extends it, and rename the current configurations to `legacy` and
+`legacy-extended` respectively. We are not doing that for now to reduce maintenance burden, as it would be unused.
 
 ## Usage
 
@@ -10,12 +21,34 @@ Install the package and all of its peer dependencies:
 npx install-peerdeps --dev @open-turo/eslint-config-react
 ```
 
-Then in your `.eslintrc` file add:
+Then in your `.eslintrc` file extend from one of the two configurations included in this package:
+
+1. The default, based on our existing front-end repositories
+2. The "extended", which adds more react-related plugins. We intend to transition to this one as default over time
+
+### Default config
+
+The default config of this repo is the recommended version for nour existing front-end projects.
+
+To use this config, just add to your `.eslintrc` the following:
+
+```
+"extends": "@open-turo/eslint-config-typescript"
+```
+
+### Extended config (extended react-related rules)
+
+We also provide an alternative `extended` preset, which adds more react-related plugins.
+We intend to transition to this one as default over time; and we encourage you to use it for new projects.
+
+If you want to use this `extended` configuration, you can import it by instead adding the following to your `.eslintrc`:
 
 ```
-"extends": "@open-turo/eslint-config-react"
+"extends": "@open-turo/eslint-config-typescript/extended"
 ```
 
+Simply notice the `/extended` suffix, which points to the `extended.js` file in this repository.
+
 ## Development
 
 Install [pre-commit](https://pre-commit.com/) and the commit hooks:

package/extended.js

@@ -0,0 +1,43 @@
+module.exports = {
+  root: true,
+  plugins: ["react", "react-hooks", "jsx-a11y"],
+  extends: [
+    "./index.js",
+    "plugin:react/recommended",
+    "plugin:react-hooks/recommended",
+    "plugin:jsx-a11y/recommended",
+  ],
+  parserOptions: {
+    ecmaFeatures: {
+      jsx: true,
+    },
+  },
+  rules: {
+    "jsx-a11y/anchor-is-valid": [
+      "warn",
+      {
+        specialLink: ["to"],
+      },
+    ],
+    // don't force .jsx extension
+    "react/jsx-filename-extension": "off",
+    // In TS you must use the Fragment syntax instead of the shorthand
+    "react/jsx-fragments": "off",
+    // This allows props to be spread in JSX
+    "react/jsx-props-no-spreading": "off",
+    // ensure props are alphabetical
+    "react/jsx-sort-props": "error",
+    // We don't need default props on TS components
+    "react/require-default-props": "off",
+    "react/sort-prop-types": "error",
+    // State initialization can be in the constructor or via class fields
+    "react/state-in-constructor": "off",
+    // This allows static properties to be placed within the class declaration
+    "react/static-property-placement": "off",
+  },
+  settings: {
+    react: {
+      version: "detect",
+    },
+  },
+};

package/index.js

@@ -1,46 +1,22 @@
 module.exports = {
-  parser: "@typescript-eslint/parser",
-  plugins: ["react", "react-hooks", "jsx-a11y"],
-  extends: [
-    "plugin:react/recommended",
-    "plugin:react-hooks/recommended",
-    "plugin:jsx-a11y/recommended",
-  ],
-  parserOptions: {
-    ecmaVersion: 2022,
-    sourceType: "module",
-    ecmaFeatures: {
-      jsx: true,
-    },
+  root: true,
+  env: {
+    browser: true,
   },
+  ignorePatterns: ["babel.config.js"],
+  extends: ["@open-turo/eslint-config-typescript/legacy"],
   rules: {
-    rules: {
-      "jsx-a11y/anchor-is-valid": [
-        "warn",
-        {
-          specialLink: ["to"],
-        },
-      ],
-      // don't force .jsx extension
-      "react/jsx-filename-extension": "off",
-      // In TS you must use the Fragment syntax instead of the shorthand
-      "react/jsx-fragments": "off",
-      // This allows props to be spread in JSX
-      "react/jsx-props-no-spreading": "off",
-      // ensure props are alphabetical
-      "react/jsx-sort-props": "error",
-      // We don't need default props on TS components
-      "react/require-default-props": "off",
-      "react/sort-prop-types": "error",
-      // State initialization can be in the constructor or via class fields
-      "react/state-in-constructor": "off",
-      // This allows static properties to be placed within the class declaration
-      "react/static-property-placement": "off",
-    },
-  },
-  settings: {
-    react: {
-      version: "detect",
-    },
+    "node/no-unpublished-import": [
+      "error",
+      {
+        allowModules: [
+          "@jest/globals",
+          "@testing-library/dom",
+          "@testing-library/react",
+          "@testing-library/user-event",
+          "nock",
+        ],
+      },
+    ],
   },
 };

package/package.json

@@ -4,10 +4,11 @@
   "devDependencies": {
     "@commitlint/cli": "^17.0.0",
     "@open-turo/commitlint-config-conventional": "^1.0.2",
+    "@open-turo/eslint-config-typescript": "2.0.0",
     "@semantic-release/git": "^10.0.1",
     "@typescript-eslint/eslint-plugin": "^5.20.0",
     "@typescript-eslint/parser": "^5.20.0",
-    "eslint": "^8.16.0",
+    "eslint": "^8.28.0",
     "eslint-plugin-jsx-a11y": "^6.5.1",
     "eslint-plugin-react": "^7.29.4",
     "eslint-plugin-react-hooks": "^4.4.0",
@@ -22,6 +23,7 @@
   "main": "index.js",
   "name": "@open-turo/eslint-config-react",
   "peerDependencies": {
+    "@open-turo/eslint-config-typescript": "2.0.0",
     "@typescript-eslint/eslint-plugin": "^5.20.0",
     "@typescript-eslint/parser": "^5.20.0",
     "eslint": ">=8.16.0",
@@ -33,5 +35,5 @@
     "access": "public"
   },
   "repository": "https://github.com/open-turo/eslint-config-react",
-  "version": "1.0.1"
+  "version": "1.1.0"
 }