@open-turo/eslint-config-react 1.0.2 → 1.1.1

package/.github/workflows/ci.yaml

@@ -8,7 +8,8 @@ jobs:
     name: Lint
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - name: Checkout
+        uses: actions/checkout@v3
         with:
           fetch-depth: 0
       - name: Download actionlint

package/.github/workflows/release.yaml

@@ -9,10 +9,11 @@ jobs:
   release:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v2
+      - name: Checkout
+        uses: actions/checkout@v3
         with:
           fetch-depth: 0
-      - name: Semantic Release
+      - name: Semantic release
         id: release
         uses: cycjimmy/semantic-release-action@v2
         with:

package/README.md

@@ -1,6 +1,26 @@
 # `@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.
+
+[![Release](https://img.shields.io/github/v/release/open-turo/eslint-config-react)](https://github.com/open-turo/eslint-config-react/releases/)
+[![Tests pass/fail](https://img.shields.io/github/workflow/status/open-turo/eslint-config-react/CI)](https://github.com/open-turo/eslint-config-react/actions/)
+[![License](https://img.shields.io/github/license/open-turo/eslint-config-react)](./LICENSE)
+[![Contributions welcome](https://img.shields.io/badge/contributions-welcome-brightgreen.svg)](https://github.com/dwyl/esta/issues)
+![CI](https://github.com/open-turo/eslint-config-react/actions/workflows/release.yaml/badge.svg)
+[![semantic-release: angular](https://img.shields.io/badge/semantic--release-angular-e10079?logo=semantic-release)](https://github.com/semantic-release/semantic-release)
+[![Conventional commits](https://img.shields.io/badge/conventional%20commits-1.0.2-%23FE5196?logo=conventionalcommits&logoColor=white)](https://conventionalcommits.org)
+[![Join us!](https://img.shields.io/badge/Turo-Join%20us%21-593CFB.svg)](https://turo.com/jobs)
 
 ## Usage
 
@@ -10,12 +30,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-react"
+"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-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.2"
+  "version": "1.1.1"
 }