Add prettier to eslint config (#71)

* Remove default rails 5.2 support (#62) * Remove default rails 5.2 support * Limit rails support to what we test Signed-off-by: Gabriel Pereira <gabriel.pereira@powerhrg.com> * Add prettier as eslint-config dep Signed-off-by: Gabriel Pereira <gabriel.pereira@powerhrg.com> * Run prettier --write on eslint Signed-off-by: Gabriel Pereira <gabriel.pereira@powerhrg.com> * Export prettier config Signed-off-by: Gabriel Pereira <gabriel.pereira@powerhrg.com> * Run prettier on Github checks Signed-off-by: Gabriel Pereira <gabriel.pereira@powerhrg.com> * Don't encourage overrides Signed-off-by: Gabriel Pereira <gabriel.pereira@powerhrg.com> * Update documentations to include JS examples Signed-off-by: Gabriel Pereira <gabriel.pereira@powerhrg.com> * Improve package's doc to include Prettier Signed-off-by: Gabriel Pereira <gabriel.pereira@powerhrg.com> * Add missing extra line Co-authored-by: Ben Langfeld <ben@langfeld.me> Signed-off-by: Gabriel Pereira <gabriel.pereira@powerhrg.com> * Fix prettier offense on Readme Signed-off-by: Gabriel Pereira <gabriel.pereira@powerhrg.com> * Add eslint-config-prettier to ignore conflicting rules Adds the lib as a dependency so that clients can run `yarn eslint-config-prettier path/to/main.js` to check rules. * Add doc on how to spot conflicting rules * Run prettier on doc * Revert "Remove default rails 5.2 support (#62)" This reverts commit 037009f. --------- Signed-off-by: Gabriel Pereira <gabriel.pereira@powerhrg.com> Co-authored-by: Carlos Palhares <chjunior@gmail.com> Co-authored-by: Ben Langfeld <ben@langfeld.me>
powerhome · Jan 30, 2023 · 3b4ba28 · 3b4ba28
1 parent 1c5e514
commit 3b4ba28
Show file tree

Hide file tree

Showing 10 changed files with 80 additions and 26 deletions.
diff --git a/.github/workflows/eslint-config.yml b/.github/workflows/eslint-config.yml
@@ -16,13 +16,16 @@ jobs:
       - uses: actions/checkout@v3
       - name: Set up Node ${{ env.NODE_VERSION }}
         uses: actions/setup-node@v3
-        with: 
+        with:
           node-version: ${{ env.NODE_VERSION }}
       - run: yarn install --frozen-lockfile
         working-directory: ${{ env.PROJECT_DIR }}
-      - name: Run the build script
+      - name: Run ESlint
         run: yarn lint
         working-directory: ${{ env.PROJECT_DIR }}
+      - name: Run Prettier
+        run: yarn prettier
+        working-directory: ${{ env.PROJECT_DIR }}
 
   release:
     needs: build

diff --git a/docs/README.md b/docs/README.md
@@ -32,7 +32,7 @@ This gem is focused on providing Cops to support a healthy cobra app development
 
 [@powerhome/eslint-config](https://github.com/powerhome/power-tools/blob/main/packages/eslint-config/docs/README.md) ☕️
 
-Shared eslint-config from Power Home Remodeling.
+Shared eslint-config and Prettier formatting from Power Home Remodeling.
 
 [cygnet](https://github.com/powerhome/power-tools/blob/main/packages/cygnet/docs/README.md) 💎
 
@@ -48,14 +48,24 @@ Edgestitch allows engines to define partial structure-self.sql files to be stitc
 
 ## Installation 🛠
 
-These packages are all meant to install inside of an application and aren't intended to stand alone; currently, they are all published to [RubyGems](https://rubygems.org/) and you can use standard Bundler methods to install them.
+These packages are all meant to install inside of an application and aren't intended to stand alone; currently, they are all published to [RubyGems](https://rubygems.org/) or [npm](https://www.npmjs.com/) and you can use standard methods to install them.
 
+For ruby gems:
 ```ruby=
 # Gemfile
 
 gem "nitro_config"
 ```
 
+For JS modules:
+```js
+# package.json
+
+"devDependencies": {
+  "@powerhome/eslint-config": "0.1.0"
+}
+```
+
 ## Local Development 👩🏽‍💻
 
 If a change needs to be made to a package, the easiest way to develop and test locally would be to temporarily change your Gemfile to point to your local version of the package:
@@ -66,6 +76,14 @@ If a change needs to be made to a package, the easiest way to develop and test l
 gem "nitro_config", path: "~/path/to/gems/nitro_config"
 ```
 
+For JS modules you can point your package.json to the local version of the package:
+```js
+# package.json
+"devDependencies": {
+  "@powerhome/eslint-config": "file:../path/to/eslint-config"
+}
+```
+
 ⚠️ <b>Please note</b> that such a change should never be committed, as other users would not have access to the same path your computer. ⚠️
 
 ## Testing 🔍

diff --git a/packages/eslint-config/.prettierignore b/packages/eslint-config/.prettierignore
@@ -0,0 +1,4 @@
+.tmp
+node_modules/
+**/*.d.ts
+**/*.d.ts.map
diff --git a/packages/eslint-config/docs/README.md b/packages/eslint-config/docs/README.md
@@ -1,6 +1,6 @@
 # @powerhome/eslint-config
 
-Provides eslint-config for Power Home Remodeling apps.
+Provides eslint-config and Prettier formatting for Power Home Remodeling apps.
 
 ## Installation
 
@@ -33,16 +33,32 @@ Assuming it's a typescript app, add an `extends` line to your `.eslintrc.json`:
 }
 ```
 
-That's it! You can override the standard configuration after that.
-
 ## Flow type apps
 
 For flow-based apps, replace `@powerhome` by `@powerhome/eslint-config/flow`. Note that usage of Flow at Power is not recommended, and all projects should migrate to TypeScript; this set of rules is provided only for transitionary purposes and will be removed in future releases.
 
+## Prettier
+
+Prettier takes code formatting decisions while ESlint cares about code quality measurements. Both tools were put together into the same package since they both handle code quality in JS.
+
+To install Prettier rules into your application simply add the following line to your `package.json` and Power's standards for code formatting will be loaded when you run Prettier.
+
+```json
+"prettier": "@powerhome/eslint-config/prettier"
+```
+
+Prettier and ESlint rules might conflict sometimes. To find out rules that are conflicting you can run the following command line in your project:
+
+```
+yarn eslint-config-prettier path/to/main.js
+```
+
+That's a helper method created by the `eslint-config-prettier` package that points out which rules are conflicting.
+
 ## Contributing
 
 Bug reports and pull requests are welcome on GitHub at https://github.com/powerhome/power_linting.
 
 ## License
 
-The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
+The package is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
diff --git a/packages/eslint-config/lib/base.js b/packages/eslint-config/lib/base.js
@@ -6,6 +6,7 @@ module.exports = {
     "plugin:jsx-control-statements/recommended",
     "plugin:react/recommended",
     "plugin:react-hooks/recommended",
+    "prettier",
   ],
   parser: "babel-eslint",
   parserOptions: {
@@ -29,18 +30,13 @@ module.exports = {
     "no-use-before-define": [2, { functions: true, classes: true }],
     "react/forbid-prop-types": 2,
     "react/jsx-boolean-value": 2,
-    "react/jsx-closing-bracket-location": 1,
-    "react/jsx-curly-spacing": 2,
     "react/jsx-handler-names": 2,
-    "react/jsx-indent-props": 2,
     "react/jsx-key": 2,
-    "react/jsx-max-props-per-line": 2,
     "react/jsx-no-bind": 0,
     "react/jsx-no-literals": 1,
     "react/jsx-no-undef": [2, { allowGlobals: true }],
     "react/jsx-pascal-case": 2,
     "react/jsx-sort-props": 2,
-    "react/jsx-wrap-multilines": 2,
     "react/no-danger": 1,
     "react/no-did-mount-set-state": 2,
     "react/no-did-update-set-state": 2,

diff --git a/packages/eslint-config/lib/flow.js b/packages/eslint-config/lib/flow.js
@@ -1,8 +1,5 @@
 module.exports = {
-  extends: [
-    "@powerhome/eslint-config/base",
-    "plugin:flowtype/recommended"
-  ],
+  extends: ["@powerhome/eslint-config/base", "plugin:flowtype/recommended"],
   plugins: ["flowtype"],
   ignorePatterns: ["flow-typed/**/*"],
 }
diff --git a/packages/eslint-config/lib/prettier.js b/packages/eslint-config/lib/prettier.js
@@ -0,0 +1,3 @@
+module.exports = {
+  semi: false,
+}
diff --git a/packages/eslint-config/mkdocs.yml b/packages/eslint-config/mkdocs.yml
@@ -3,7 +3,7 @@ site_description: Provides eslint-config for Power Home Remodeling apps
 repo_url: https://github.com/powerhome/power_linting
 edit_uri: edit/main/eslint-config/docs/
 nav:
-  - 'Home': 'README.md'
+  - "Home": "README.md"
 
 plugins:
   - techdocs-core
diff --git a/packages/eslint-config/package.json b/packages/eslint-config/package.json
@@ -9,38 +9,45 @@
     "./base": "./lib/base.js",
     "./flow": "./lib/flow.js",
     "./typescript": "./lib/typescript.js",
+    "./prettier": "./lib/prettier.js",
     ".": "./lib/typescript.js"
   },
   "keywords": [
     "eslint",
     "eslintconfig"
   ],
   "scripts": {
-    "lint": "eslint lib/*"
+    "lint": "eslint lib/*",
+    "prettier": "prettier -c --config ./lib/prettier.js .",
+    "prettier:write": "prettier --write --config ./lib/prettier.js ."
   },
   "peerDependencies": {
+    "@typescript-eslint/eslint-plugin": "5.47.0",
+    "@typescript-eslint/parser": "5.47.0",
+    "babel-eslint": "8 || 10",
     "eslint": "7.32.0",
     "eslint-plugin-flowtype": "8.0.3",
     "eslint-plugin-jsx-control-statements": "3.0.0",
     "eslint-plugin-react": "7.31.11",
     "eslint-plugin-react-hooks": "4.6.0",
     "eslint-webpack-plugin": "3.2.0",
-    "@typescript-eslint/eslint-plugin": "5.47.0",
-    "@typescript-eslint/parser": "5.47.0",
-    "babel-eslint": "8 || 10",
     "typescript": "4.9.4"
   },
   "devDependencies": {
-    "semver": "7.3.8",
+    "@typescript-eslint/eslint-plugin": "5.47.0",
+    "@typescript-eslint/parser": "5.47.0",
+    "babel-eslint": "10.1.0",
     "eslint": "7.32.0",
     "eslint-plugin-flowtype": "8.0.3",
     "eslint-plugin-jsx-control-statements": "3.0.0",
     "eslint-plugin-react": "7.31.11",
     "eslint-plugin-react-hooks": "4.6.0",
     "eslint-webpack-plugin": "3.2.0",
-    "@typescript-eslint/eslint-plugin": "5.47.0",
-    "@typescript-eslint/parser": "5.47.0",
-    "babel-eslint": "10.1.0",
+    "prettier": "2.8.1",
+    "semver": "7.3.8",
     "typescript": "4.9.4"
+  },
+  "dependencies": {
+    "eslint-config-prettier": "^8.6.0"
   }
 }
diff --git a/packages/eslint-config/yarn.lock b/packages/eslint-config/yarn.lock
@@ -652,6 +652,11 @@ escape-string-regexp@^4.0.0:
   resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz#14ba83a5d373e3d311e5afca29cf5bfad965bf34"
   integrity sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==
 
+eslint-config-prettier@^8.6.0:
+  version "8.6.0"
+  resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-8.6.0.tgz#dec1d29ab728f4fa63061774e1672ac4e363d207"
+  integrity sha512-bAF0eLpLVqP5oEVUFKpMA+NnRFICwn9X8B5jrR9FcqnYBuPbqWEjTEspPWMj5ye6czoSLDweCzSo3Ko7gGrZaA==
+
 eslint-plugin-flowtype@8.0.3:
   version "8.0.3"
   resolved "https://registry.yarnpkg.com/eslint-plugin-flowtype/-/eslint-plugin-flowtype-8.0.3.tgz#e1557e37118f24734aa3122e7536a038d34a4912"
@@ -1467,6 +1472,11 @@ prelude-ls@^1.2.1:
   resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396"
   integrity sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==
 
+prettier@2.8.1:
+  version "2.8.1"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.8.1.tgz#4e1fd11c34e2421bc1da9aea9bd8127cd0a35efc"
+  integrity sha512-lqGoSJBQNJidqCHE80vqZJHWHRFoNYsSpP9AjFhlhi9ODCJA541svILes/+/1GM3VaL/abZi7cpFzOpdR9UPKg==
+
 progress@^2.0.0:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/progress/-/progress-2.0.3.tgz#7e8cf8d8f5b8f239c1bc68beb4eb78567d572ef8"