chore: add rule for eslint curly braces && lint them all (#186)

Author: smeijer

.babelrc

@@ -1,11 +1,11 @@
 {
-  "presets": [
-    "@babel/preset-react",
-    "@babel/preset-env"
-  ],
+  "presets": ["@babel/preset-react", "@babel/preset-env"],
   "plugins": [
-    ["@babel/plugin-proposal-class-properties", {
-      "loose": true
-    }]
+    [
+      "@babel/plugin-proposal-class-properties",
+      {
+        "loose": true
+      }
+    ]
   ]
 }

.eslintrc.js

@@ -21,6 +21,8 @@ module.exports = {
     jest: true,
   },
   rules: {
+    curly: 'error',
+
     // I'll probably add some typescript types instead
     'react/prop-types': 'off',
   },

.github/workflows/cd.yml

@@ -7,7 +7,7 @@ on:
 
 env:
   APP_NAME: Testing Playground
-  NODE_VERSION: "12.x"
+  NODE_VERSION: '12.x'
 
 jobs:
   create-release:
@@ -25,7 +25,7 @@ jobs:
 
       - uses: actions/setup-node@v1
         with:
-          node-version: "${{ env.NODE_VERSION }}"
+          node-version: '${{ env.NODE_VERSION }}'
 
       - name: Cache node modules
         id: cache

.github/workflows/ci.yml

@@ -5,7 +5,7 @@ on:
     types: [opened, synchronize, reopened]
 
 env:
-  NODE_VERSION: "12.x"
+  NODE_VERSION: '12.x'
 
 jobs:
   setup:
@@ -17,7 +17,7 @@ jobs:
 
       - uses: actions/setup-node@v1
         with:
-          node-version: "${{ env.NODE_VERSION }}"
+          node-version: '${{ env.NODE_VERSION }}'
 
       - name: Cache node modules
         id: cache
@@ -42,7 +42,7 @@ jobs:
 
       - uses: actions/setup-node@v1
         with:
-          node-version: "${{ env.NODE_VERSION }}"
+          node-version: '${{ env.NODE_VERSION }}'
 
       - name: Fetch all branches
         run: |
@@ -67,7 +67,7 @@ jobs:
 
       - uses: actions/setup-node@v1
         with:
-          node-version: "${{ env.NODE_VERSION }}"
+          node-version: '${{ env.NODE_VERSION }}'
 
       - name: Cache node modules
         uses: actions/cache@v1
@@ -76,4 +76,4 @@ jobs:
           key: ${{ runner.os }}-node_modules-${{ hashFiles('**/package-lock.json') }}
 
       - name: Run Tests
-        run: npm run ci:test
+        run: npm run ci:test

.lintstagedrc.js

@@ -3,5 +3,7 @@ module.exports = {
     `eslint --quiet --fix ${files.join(' ')}`,
     `jest --passWithNoTests`,
   ],
-  '**/*.{md,js}': (files) => [`prettier --write ${files.join(' ')}`],
+  '**/*.{md,js,json,yml,html,css,pcss}': (files) => [
+    `prettier --write ${files.join(' ')}`,
+  ],
 };

CODE_OF_CONDUCT.md

@@ -14,22 +14,22 @@ appearance, race, religion, or sexual identity and orientation.
 Examples of behavior that contributes to creating a positive environment
 include:
 
-* Using welcoming and inclusive language
-* Being respectful of differing viewpoints and experiences
-* Gracefully accepting constructive criticism
-* Focusing on what is best for the community
-* Showing empathy towards other community members
+- Using welcoming and inclusive language
+- Being respectful of differing viewpoints and experiences
+- Gracefully accepting constructive criticism
+- Focusing on what is best for the community
+- Showing empathy towards other community members
 
 Examples of unacceptable behavior by participants include:
 
-* The use of sexualized language or imagery and unwelcome sexual attention or
- advances
-* Trolling, insulting/derogatory comments, and personal or political attacks
-* Public or private harassment
-* Publishing others' private information, such as a physical or electronic
- address, without explicit permission
-* Other conduct which could reasonably be considered inappropriate in a
- professional setting
+- The use of sexualized language or imagery and unwelcome sexual attention or
+  advances
+- Trolling, insulting/derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or electronic
+  address, without explicit permission
+- Other conduct which could reasonably be considered inappropriate in a
+  professional setting
 
 ## Our Responsibilities
 

MAINTAINING.md

@@ -50,7 +50,7 @@ to release. See the next section on Releases for more about that.
 Our releases are automatic. They happen whenever code lands into `master`. A
 netlify build gets kicked off, and when tagged a changelog is published on
 GitHub. The changelog is generated based on the git commit messages. With this
-in mind, **please brush up on [the commit message convention][commit] which 
+in mind, **please brush up on [the commit message convention][commit] which
 drives our releases.**
 
 > One important note about this: Please make sure that commit messages do NOT
@@ -63,5 +63,4 @@ drives our releases.**
 
 Thank you so much for helping to maintain this project!
 
-[commit]:
-  https://github.com/conventional-changelog-archived-repos/conventional-changelog-angular/blob/ed32559941719a130bb0327f886d6a32a8cbc2ba/convention.md
+[commit]: https://github.com/conventional-changelog-archived-repos/conventional-changelog-angular/blob/ed32559941719a130bb0327f886d6a32a8cbc2ba/convention.md

README.md

@@ -13,7 +13,9 @@ practices.
 <hr />
 
 <!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
+
 [![All Contributors](https://img.shields.io/badge/all_contributors-10-orange.svg?style=flat-square)](#contributors-)
+
 <!-- ALL-CONTRIBUTORS-BADGE:END -->
 
 **Playground for [testing-library/dom]**
@@ -122,6 +124,7 @@ Thanks goes to these people ([emoji key][emojis]):
 
 <!-- markdownlint-enable -->
 <!-- prettier-ignore-end -->
+
 <!-- ALL-CONTRIBUTORS-LIST:END -->
 
 This project follows the [all-contributors][all-contributors] specification.

devtools/src/devtools/main.html

@@ -1,9 +1,9 @@
-<!doctype html>
+<!DOCTYPE html>
 <html>
-<head>
-    <meta charset="utf-8">
-</head>
-<body>
+  <head>
+    <meta charset="utf-8" />
+  </head>
+  <body>
     <script src="main.js"></script>
-</body>
-</html>
+  </body>
+</html>

devtools/src/devtools/pane.html

@@ -1,11 +1,11 @@
-<!doctype html>
+<!DOCTYPE html>
 <html>
-<head>
-    <meta charset="utf8">
+  <head>
+    <meta charset="utf8" />
     <link rel="stylesheet" href="../../../src/styles/index.css" />
-</head>
-<body>
+  </head>
+  <body>
     <div id="app" />
     <script src="pane.js"></script>
-</body>
-</html>
+  </body>
+</html>

devtools/src/devtools/panel.html

@@ -1,11 +1,11 @@
-<!doctype html>
+<!DOCTYPE html>
 <html>
-<head>
-    <meta charset="utf8">
+  <head>
+    <meta charset="utf8" />
     <link rel="stylesheet" href="../../../src/styles/index.css" />
-</head>
-<body>
+  </head>
+  <body>
     <div id="app" />
     <script src="panel.js"></script>
-</body>
-</html>
+  </body>
+</html>

devtools/src/manifest.json

@@ -23,9 +23,7 @@
     }
   },
 
-  "web_accessible_resources": [
-    "window/testing-library.js"
-  ],
+  "web_accessible_resources": ["window/testing-library.js"],
 
   "devtools_page": "devtools/main.html",
 
@@ -36,11 +34,7 @@
     "persistent": false
   },
 
-  "permissions": [
-    "<all_urls>",
-    "activeTab",
-    "clipboardWrite"
-  ],
+  "permissions": ["<all_urls>", "activeTab", "clipboardWrite"],
 
   "content_scripts": [
     {

src/components/Editor.js

@@ -58,8 +58,12 @@ function getQueryHints(cm) {
   let start = cursor.ch;
   let end = cursor.ch;
 
-  while (start && /\w|\./.test(line.charAt(start - 1))) --start;
-  while (end < line.length && /\w|\./.test(line.charAt(end))) ++end;
+  while (start && /\w|\./.test(line.charAt(start - 1))) {
+    --start;
+  }
+  while (end < line.length && /\w|\./.test(line.charAt(end))) {
+    ++end;
+  }
 
   const word = line.slice(start, end).toLowerCase();
   const offset = word.lastIndexOf('.') + 1;
@@ -169,7 +173,9 @@ function Editor({ onLoad, onChange, mode, initialValue }) {
   }, [mode]);
 
   useEffect(() => {
-    if (!editor.current || typeof onChange !== 'function') return;
+    if (!editor.current || typeof onChange !== 'function') {
+      return;
+    }
 
     editor.current.on(
       'changes',

src/embed.html

@@ -35,12 +35,7 @@
       </script>
     </template>
 
-    <template
-      data-testing-playground
-      data-panes="query, result, markup"
-      data-height="250"
-      data-width="80%"
-    >
+    <template data-testing-playground data-panes="query, result, markup" data-height="250" data-width="80%">
       <script type="text/html">
         <button>one</button>
       </script>

src/styles/app.pcss

@@ -17,7 +17,8 @@ body:not(.embedded) {
 }
 
 /* purgecss ignore */
-body.embedded, body.embedded #app {
+body.embedded,
+body.embedded #app {
   @apply h-full overflow-hidden p-1;
 }
 
@@ -30,7 +31,7 @@ nav a:not(.title):hover {
 }
 
 .footer:not(:hover) {
-  opacity: .3;
+  opacity: 0.3;
 }
 
 .footer > div > span {
@@ -81,7 +82,7 @@ blockquote:before {
   font-size: 80px;
   display: block;
   padding-left: 10px;
-  content: "\201C";
+  content: '\201C';
   position: absolute;
   left: -20px;
   top: -32px;
@@ -92,24 +93,24 @@ blockquote cite {
 }
 
 blockquote cite:before {
-  content: "\2014 \2009";
+  content: '\2014 \2009';
 }
 
 .field {
   @apply relative cursor-default p-1 rounded border border-transparent;
   z-index: 0;
-  transition: background-color .2s ease;
+  transition: background-color 0.2s ease;
 }
 
-.field[data-clickable="false"]:hover {
+.field[data-clickable='false']:hover {
   @apply bg-gray-100;
 }
 
-.field[data-clickable="true"] {
+.field[data-clickable='true'] {
   @apply cursor-pointer bg-blue-100;
 }
 
-.field[data-clickable="true"]:hover {
+.field[data-clickable='true']:hover {
   @apply bg-blue-200;
 }
 
@@ -129,7 +130,7 @@ blockquote cite:before {
 }
 
 button:disabled {
-  opacity: .2;
+  opacity: 0.2;
 }
 
 /**
@@ -160,7 +161,8 @@ button:disabled {
   @apply block appearance-none border rounded w-full py-2 px-3 mb-2 text-gray-700 leading-tight;
 }
 
-.preview input:focus, .preview button:focus {
+.preview input:focus,
+.preview button:focus {
   @apply outline-none border border-gray-700;
 }