ci: fix lint and add husky hook

.eslintrc.json

@@ -15,6 +15,15 @@
   },
   "plugins": ["react"],
   "rules": {
+    "indent": ["error", 2, { "SwitchCase": 1 }],
+    "linebreak-style": ["error", "unix"],
+    "no-trailing-spaces": 2,
+    "eol-last": 2,
+    "space-in-parens": ["error", "never"],
+    "no-multiple-empty-lines": 1,
+    "space-infix-ops": "error",
+    "no-useless-escape": "off",
+    "require-atomic-updates": "off",
     "react/jsx-uses-vars": 1,
     "react/jsx-uses-react": 1,
     "react/react-in-jsx-scope": 1,

.github/workflows/ci.yml

@@ -44,26 +44,26 @@ jobs:
     steps:
     - uses: actions/checkout@v2
     - uses: dangoslen/changelog-enforcer@v2
-  # check-lint:
-  #   name: Lint
-  #   timeout-minutes: 15
-  #   runs-on: ubuntu-18.04
-  #   steps:
-  #     - uses: actions/checkout@v2
-  #     - name: Use Node.js ${{ env.NODE_VERSION }}
-  #       uses: actions/setup-node@v1
-  #       with:
-  #         node-version: ${{ env.node-version }}
-  #     - name: Cache Node.js modules
-  #       uses: actions/cache@v2
-  #       with:
-  #         path: ~/.npm
-  #         key: ${{ runner.os }}-node-${{ env.NODE_VERSION }}-${{ hashFiles('**/package-lock.json') }}
-  #         restore-keys: |
-  #           ${{ runner.os }}-node-${{ env.NODE_VERSION }}-
-  #     - name: Install dependencies
-  #       run: npm ci
-  #     - run: npm run lint
+  check-lint:
+    name: Lint
+    timeout-minutes: 15
+    runs-on: ubuntu-18.04
+    steps:
+      - uses: actions/checkout@v2
+      - name: Use Node.js ${{ env.NODE_VERSION }}
+        uses: actions/setup-node@v1
+        with:
+          node-version: ${{ env.node-version }}
+      - name: Cache Node.js modules
+        uses: actions/cache@v2
+        with:
+          path: ~/.npm
+          key: ${{ runner.os }}-node-${{ env.NODE_VERSION }}-${{ hashFiles('**/package-lock.json') }}
+          restore-keys: |
+            ${{ runner.os }}-node-${{ env.NODE_VERSION }}-
+      - name: Install dependencies
+        run: npm ci
+      - run: npm run lint
   check-circular:
      name: Circular Dependencies
      timeout-minutes: 5

.husky/_/husky.sh

@@ -0,0 +1,31 @@
+#!/bin/sh
+if [ -z "$husky_skip_init" ]; then
+  debug () {
+    if [ "$HUSKY_DEBUG" = "1" ]; then
+      echo "husky (debug) - $1"
+    fi
+  }
+
+  readonly hook_name="$(basename "$0")"
+  debug "starting $hook_name..."
+
+  if [ "$HUSKY" = "0" ]; then
+    debug "HUSKY env variable is set to 0, skipping hook"
+    exit 0
+  fi
+
+  if [ -f ~/.huskyrc ]; then
+    debug "sourcing ~/.huskyrc"
+    . ~/.huskyrc
+  fi
+
+  export readonly husky_skip_init=1
+  sh -e "$0" "$@"
+  exitCode="$?"
+
+  if [ $exitCode != 0 ]; then
+    echo "husky - $hook_name hook exited with code $exitCode (error)"
+  fi
+
+  exit $exitCode
+fi

.husky/pre-commit

@@ -0,0 +1,5 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+npm run lint
+git add
+

CHANGELOG.md

@@ -12,6 +12,7 @@
 - Add CI check to add changelog entry (Manuel Trezza) [#1764](https://github.com/parse-community/parse-dashboard/pull/1764)
 - Refactor: uniform issue templates across repos (Manuel Trezza) [#1767](https://github.com/parse-community/parse-dashboard/pull/1767)
 - fix: date cell value not selected on double clicks (fn-faisal) [#1730](https://github.com/parse-community/parse-dashboard/pull/1730)
+- Adds `npm run lint:fix` and pre-commit hook (Daniel Blyth) [#1791](https://github.com/parse-community/parse-dashboard/pull/1730)
 
 ## Fixes
 - Fixed bug after creating new class, wrong CLP was shown for that class [#1784](https://github.com/parse-community/parse-dashboard/issues/1784)  (Prerna Mehra) [#1785](https://github.com/parse-community/parse-dashboard/pull/1785)

Parse-Dashboard/CLI/mfa.js

@@ -101,20 +101,20 @@ const showInstructions = ({ app, username, passwordCopied, secret, url, encrypt,
 
   if (secret) {
     console.log(
-      `\n${getOrder()}. Open the authenticator app to scan the QR code above or enter this secret code:` + 
-      `\n\n   ${secret}` + 
+      `\n${getOrder()}. Open the authenticator app to scan the QR code above or enter this secret code:` +
+      `\n\n   ${secret}` +
       '\n\n   If the secret code generates incorrect one-time passwords, try this alternative:' +
-      `\n\n   ${url}` + 
+      `\n\n   ${url}` +
       `\n\n${getOrder()}. Destroy any records of the QR code and the secret code to secure the account.`
     );
   }
-  
+
   if (encrypt) {
     console.log(
       `\n${getOrder()}. Make sure that "useEncryptedPasswords" is set to "true" in your dashboard configuration.` +
       '\n   You chose to generate an encrypted password for this user.' +
       '\n   Any existing users with non-encrypted passwords will require newly created, encrypted passwords.'
-      );
+    );
   }
   console.log(
     '\n------------------------------------------------------------------------------\n'
@@ -214,7 +214,7 @@ module.exports = {
 
     const { url, secret } = generateSecret({ app, username, algorithm, digits, period });
     showQR(url);
-    
+
     // Compose config
     const config = { mfa: secret };
     if (algorithm !== 'SHA1') {

Parse-Dashboard/app.js

@@ -33,16 +33,16 @@ function checkIfIconsExistForApps(apps, iconsFolder) {
 
     fs.stat(path, function(err) {
       if (err) {
-          if ('ENOENT' == err.code) {// file does not exist
-              console.warn('Icon with file name: ' + iconName +' couldn\'t be found in icons folder!');
-          } else {
-            console.log(
-              'An error occurd while checking for icons, please check permission!');
-          }
+        if ('ENOENT' == err.code) {// file does not exist
+          console.warn('Icon with file name: ' + iconName + ' couldn\'t be found in icons folder!');
+        } else {
+          console.log(
+            'An error occurd while checking for icons, please check permission!');
+        }
       } else {
-          //every thing was ok so for example you can read it and send it to client
+        //every thing was ok so for example you can read it and send it to client
       }
-  } );
+    });
   }
 }
 
@@ -203,7 +203,7 @@ module.exports = function(config, options) {
       if (users && (!req.user || !req.user.isAuthenticated)) {
         return res.redirect(`${mountPath}login`);
       }
-      if (users && req.user && req.user.matchingUsername ) {
+      if (users && req.user && req.user.matchingUsername) {
         res.append('username', req.user.matchingUsername);
       }
       res.send(`<!DOCTYPE html>

Parse-Dashboard/index.js

@@ -193,7 +193,7 @@ p.then(config => {
     process.exit(-1);
   }
 })
-.catch(error => {
-  console.log('There was a problem loading the dashboard. Exiting.', error);
-  process.exit(-1);
-});
+  .catch(error => {
+    console.log('There was a problem loading the dashboard. Exiting.', error);
+    process.exit(-1);
+  });

ci/nodeEngineCheck.js

@@ -46,7 +46,7 @@ class NodeEngineCheck {
       const dirents = await fs.readdir(basePath, { withFileTypes: true });
       const validFiles = dirents.filter(d => d.name.toLowerCase() == 'package.json').map(d => path.join(basePath, d.name));
       files.push(...validFiles);
-      
+
       // For each directory entry
       for (const dirent of dirents) {
         if (dirent.isDirectory()) {
@@ -80,7 +80,7 @@ class NodeEngineCheck {
       const contentString = await fs.readFile(file, 'utf-8');
       const contentJson = JSON.parse(contentString);
       const version = ((contentJson || {}).engines || {}).node;
-      
+
       // Add response
       response.push({
         file: file,
@@ -112,14 +112,14 @@ class NodeEngineCheck {
 
     // Sort by min version
     const sortedMinVersions = minVersions.sort((v1, v2) => semver.compare(v1.nodeMinVersion, v2.nodeMinVersion));
-    
+
     // Filter by higher versions
     const higherVersions = sortedMinVersions.filter(v => semver.gt(v.nodeMinVersion, baseVersion));
     // console.log(`getHigherVersions: ${JSON.stringify(higherVersions)}`);
     return higherVersions;
   }
 
-/**
+  /**
  * Returns the node version of the parent package.
  * @return {Object} The parent package info.
  */
@@ -153,7 +153,7 @@ async function check() {
 
   // Determine parent min version
   const parentMinVersion = semver.minVersion(parentVersion.nodeVersion);
-  
+
   // Get package.json files
   const files = await check.getPackageFiles();
   core.info(`Checking the minimum node version requirement of ${files.length} dependencies`);
@@ -170,13 +170,13 @@ async function check() {
   // If there are higher versions
   if (higherVersions.length > 0) {
     console.log(`\nThere are ${higherVersions.length} dependencies that require a higher node engine version than the parent package (${parentVersion.nodeVersion}):`);
-    
+
     // For each dependency
     for (const higherVersion of higherVersions) {
-      
+
       // Get package name
-      const package = higherVersion.file.split('node_modules/').pop().replace('/package.json', '');
-      console.log(`- ${package} requires at least node ${higherVersion.nodeMinVersion} (${higherVersion.nodeVersion})`);
+      const _package = higherVersion.file.split('node_modules/').pop().replace('/package.json', '');
+      console.log(`- ${_package} requires at least node ${higherVersion.nodeMinVersion} (${higherVersion.nodeVersion})`);
     }
     console.log('');
     core.setFailed(`❌ Upgrade the node engine version in package.json to at least '${highestVersion}' to satisfy the dependencies.`);

package.json

@@ -97,6 +97,7 @@
     "eslint-plugin-react": "7.19.0",
     "file-loader": "6.0.0",
     "http-server": "0.12.0",
+    "husky": "7.0.2",
     "jest": "24.8.0",
     "madge": "5.0.1",
     "marked": "0.8.2",
@@ -124,6 +125,7 @@
     "build": "cross-env NODE_ENV=production webpack --config webpack/production.config.js && webpack --config webpack/PIG.config.js",
     "test": "cross-env NODE_PATH=./node_modules jest",
     "lint": "eslint . --ignore-path .gitignore --cache",
+    "lint:fix": "eslint . --ignore-path .gitignore --cache --fix",
     "pretest": "npm run lint",
     "generate": "node scripts/generate.js",
     "prepare": "webpack --config webpack/publish.config.js --progress",
@@ -135,7 +137,7 @@
     "parse-dashboard": "./bin/parse-dashboard"
   },
   "engines": {
-    "node": ">=12"
+    "node": ">=12.20.0"
   },
   "main": "Parse-Dashboard/app.js",
   "jest": {

scripts/generate.js

@@ -26,7 +26,7 @@ function padding(length) {
 
 function generateReact(name) {
   return (
-`/*
+    `/*
  * Copyright (c) 2016-present, Parse, LLC
  * All rights reserved.
  *
@@ -49,15 +49,15 @@ ${name}.propTypes = {
 
 function generateExample(name) {
   return (
-`/*
+    `/*
  * Copyright (c) 2016-present, Parse, LLC
  * All rights reserved.
  *
  * This source code is licensed under the license found in the LICENSE file in
  * the root directory of this source tree.
  */
 import React${padding(name.length - 5)} from 'react';
-import ${name}${padding(5 - name.length)} f`+ 'rom' +` 'components/${name}/${name}.react';
+import ${name}${padding(5 - name.length)} f` + 'rom' + ` 'components/${name}/${name}.react';
 
 export const component = ${name};
 
@@ -74,7 +74,7 @@ export const demos = [
 
 function generateTest(name) {
   return (
-`/*
+    `/*
  * Copyright (c) 2016-present, Parse, LLC
  * All rights reserved.
  *
@@ -109,12 +109,12 @@ function updateComponentMap(name) {
   }
 
   let spaces = '';
-  for (let i = 0; i<numSpace; i++) {
+  for (let i = 0; i < numSpace; i++) {
     spaces += ' ';
   }
 
   return (
-`export let ${name}${spaces}= require('components/${name}/${name}.example');\n`
+    `export let ${name}${spaces}= require('components/${name}/${name}.example');\n`
   );
 }
 

src/components/Autocomplete/Autocomplete.react.js

@@ -93,9 +93,9 @@ export default class Autocomplete extends Component {
     const filteredSuggestions = buildSuggestions
       ? buildSuggestions(userInput)
       : suggestions.filter(
-          suggestion =>
-            suggestion.toLowerCase().indexOf(userInput.toLowerCase()) > -1
-        );
+        suggestion =>
+          suggestion.toLowerCase().indexOf(userInput.toLowerCase()) > -1
+      );
     return filteredSuggestions;
   }
 
@@ -226,15 +226,15 @@ export default class Autocomplete extends Component {
     // Enter
     const { userInput } = this.state;
 
-      if (e.keyCode === 13) {
-            if (userInput && userInput.length > 0) {
+    if (e.keyCode === 13) {
+      if (userInput && userInput.length > 0) {
         this.props.onSubmit(userInput);
       }
     } else if (e.keyCode === 9) {
       // Tab
       // do not type it
       e.preventDefault();
-      
+
       e.stopPropagation();
       // move focus to input
       this.inputRef.current.focus();
@@ -317,7 +317,7 @@ export default class Autocomplete extends Component {
           onClick={onClick}
         />
       );
-    } 
+    }
 
     return (
       <React.Fragment>
@@ -371,5 +371,5 @@ Autocomplete.propTypes = {
   ),
   error: PropTypes.string.describe(
     'Error to be rendered in place of label if defined'
-  ) 
-} 
+  )
+}