Merge pull request #22 from texttree/fix-foxprogs-linter

Fix foxprogs linter

Author: foxprogs

.eslintrc.json

@@ -0,0 +1,40 @@
+{
+  "env": {
+    "browser": true
+  },
+  "parser": "@babel/eslint-parser",
+  "extends": [
+    "plugin:react/recommended",
+    "plugin:jsx-a11y/recommended",
+    "plugin:prettier/recommended"
+  ],
+  "settings": {
+    "react": {
+      "version": "detect"
+    },
+    "linkComponents": [
+      "Hyperlink",
+      {
+        "name": "Link",
+        "linkAttribute": "to"
+      }
+    ]
+  },
+  "parserOptions": {
+    "ecmaFeatures": {
+      "jsx": true
+    },
+    "ecmaVersion": 11,
+    "sourceType": "module"
+  },
+  "plugins": [],
+  "rules": {
+    "prettier/prettier": [
+      "error",
+      {
+        "endOfLine": "auto"
+      }
+    ],
+    "react/prop-types": 0
+  }
+}

.husky/.gitignore

@@ -0,0 +1 @@
+_

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npx lint-staged

.prettierignore

@@ -0,0 +1,3 @@
+dist/
+node_modules/
+.*

.prettierrc.json

@@ -0,0 +1,9 @@
+{
+  "useTabs": false,
+  "printWidth": 90,
+  "tabWidth": 2,
+  "trailingComma": "es5",
+  "singleQuote": true,
+  "jsxBracketSameLine": false,
+  "semi": true
+}

.vscode/extensions.json

@@ -0,0 +1,6 @@
+{
+  "recommendations": [
+    "dbaeumer.vscode-eslint",
+    "esbenp.prettier-vscode"
+  ]
+}

.vscode/settings.json

@@ -0,0 +1,26 @@
+{
+  "[json]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[jsonc]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[md]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "eslint.format.enable": true,
+  "[javascript]": {
+    "editor.defaultFormatter": "dbaeumer.vscode-eslint"
+  },
+  "[javascriptreact]": {
+    "editor.defaultFormatter": "dbaeumer.vscode-eslint"
+  },
+  "eslint.alwaysShowStatus": true,
+  "editor.formatOnSave": true,
+  "editor.detectIndentation": false,
+  "editor.formatOnPaste": true,
+  "files.insertFinalNewline": true,
+  "files.eol": "\n",
+  "files.trimTrailingWhitespace": true,
+  "editor.tabSize": 2,
+}

package.json

@@ -1,14 +1,40 @@
 {
   "name": "@texttree/tt-reference-rcl",
+  "author": "TextTree.org",
   "version": "1.0.1",
+  "description": "This library of components was made as part of the development of the Bible Study App and helps to display books and chapters from the books of the Bible.",
+  "keywords": [
+    "bible",
+    "reference"
+  ],
+  "license": "MIT",
   "private": false,
   "main": "dist/index.js",
-  "license": "MIT",
   "url": "https://github.com/texttree/tt-reference-rcl",
+  "homepage": "https://github.com/texttree/tt-reference-rcl#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/texttree/tt-reference-rcl.git"
+  },
+  "bugs": {
+    "url": "https://github.com/texttree/tt-reference-rcl/issues"
+  },
+  "lint-staged": {
+    "src/**/*.js": [
+      "eslint --fix"
+    ],
+    "*.+(json|md)": [
+      "prettier --write"
+    ]
+  },
   "scripts": {
+    "prepare": "husky install",
     "start": "styleguidist server",
     "build": "styleguidist build",
-    "prepublishOnly": "rm -fr ./dist & babel ./src --out-dir ./dist -s inline"
+    "lint": "eslint --fix .",
+    "prettier": "prettier --write .",
+    "prepublishOnly": "rm -fr ./dist & babel ./src --out-dir ./dist -s inline",
+    "precommit": "lint-staged"
   },
   "peerDependencies": {
     "@material-ui/core": "^4.x",
@@ -18,29 +44,25 @@
   },
   "devDependencies": {
     "@babel/cli": "^7.13.14",
-    "@babel/core": "^7.13.15",
+    "@babel/core": "^7.14.3",
+    "@babel/eslint-parser": "^7.14.4",
     "@babel/preset-env": "^7.13.15",
     "@babel/preset-react": "^7.13.13",
     "@material-ui/core": "^4.11.3",
     "babel-loader": "^8.2.2",
+    "eslint": "^7.28.0",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-jsx-a11y": "^6.4.1",
+    "eslint-plugin-prettier": "^3.4.0",
+    "eslint-plugin-react": "^7.24.0",
+    "eslint-plugin-react-hooks": "^4.2.0",
+    "husky": "^6.0.0",
+    "lint-staged": "^11.0.0",
+    "prettier": "^2.3.1",
     "prop-types": "^15.7.2",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "react-styleguidist": "^11.1.6",
-    "webpack": "^5.32.0"
-  },
-  "description": "This library of components was made as part of the development of the Bible Study App and helps to display books and chapters from the books of the Bible.",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/texttree/tt-reference-rcl.git"
-  },
-  "author": "texttree",
-  "bugs": {
-    "url": "https://github.com/texttree/tt-reference-rcl/issues"
-  },
-  "homepage": "https://github.com/texttree/tt-reference-rcl#readme",
-  "keywords": [
-    "bible",
-    "reference"
-  ]
+    "react-styleguidist": "^11.1.7",
+    "webpack": "^5.38.1"
+  }
 }

src/components/BibleBookList/BibleBookList.js

@@ -29,13 +29,9 @@ function BibleBookList({
     };
   });
 
-  const currentBookListOT = currentBookList.filter(
-    (el) => el.categories === "bible-ot"
-  );
+  const currentBookListOT = currentBookList.filter((el) => el.categories === 'bible-ot');
 
-  const currentBookListNT = currentBookList.filter(
-    (el) => el.categories === "bible-nt"
-  );
+  const currentBookListNT = currentBookList.filter((el) => el.categories === 'bible-nt');
   const handleChange = () => {
     setCheckState((prev) => !prev);
   };
@@ -48,7 +44,7 @@ function BibleBookList({
   let testamentList = [];
 
   switch (testaments) {
-    case "nt":
+    case 'nt':
       testamentList = [
         {
           title: titleNT,
@@ -60,7 +56,7 @@ function BibleBookList({
       }
       break;
 
-    case "ot":
+    case 'ot':
       testamentList = [
         {
           title: titleOT,
@@ -71,7 +67,7 @@ function BibleBookList({
         showCheckbox = allBooksIsSet(currentBookListOT);
       }
       break;
-    case "all":
+    case 'all':
       testamentList = [
         { title: titleOT, bookList: currentBookListOT },
         { title: titleNT, bookList: currentBookListNT },
@@ -94,17 +90,11 @@ function BibleBookList({
       classes={{
         label: BibleBookListClasses?.label,
       }}
-      control={
-        <Checkbox
-          checked={checkState}
-          onChange={handleChange}
-          color="primary"
-        />
-      }
+      control={<Checkbox checked={checkState} color="primary" onChange={handleChange} />}
       label={labelForCheckbox}
     />
   ) : (
-    ""
+    ''
   );
 
   return (
@@ -113,18 +103,18 @@ function BibleBookList({
       {testamentList.map((el, index) => {
         return (
           <BookList
-            title={el.title}
+            bookClasses={bookClasses}
             bookList={el.bookList}
-            showInactive={!checkState}
-            onClickBook={onClickBook}
-            selectedBookId={selectedBookId}
             bookListClasses={{
               title: BibleBookListClasses?.title,
               book: BibleBookListClasses?.book,
               bookList: BibleBookListClasses?.bookList,
             }}
-            bookClasses={bookClasses}
             key={index}
+            onClickBook={onClickBook}
+            selectedBookId={selectedBookId}
+            showInactive={!checkState}
+            title={el.title}
           />
         );
       })}
@@ -135,18 +125,18 @@ function BibleBookList({
 BibleBookList.defaultProps = {
   showCheckbox: true,
   sortFirstNT: false,
-  testaments: "all",
-  titleOT: "",
-  titleNT: "",
+  testaments: 'all',
+  titleOT: '',
+  titleNT: '',
   showInactive: true,
   onClickBook: (bookId) => {},
-  labelForCheckbox: "Show only existing books",
+  labelForCheckbox: 'Show only existing books',
   titleBooks: {},
   availableBookList: [],
 };
 
 BibleBookList.propTypes = {
-  testaments: PropTypes.oneOf(["all", "nt", "ot"]),
+  testaments: PropTypes.oneOf(['all', 'nt', 'ot']),
   /** block header of "New Testament" */
   titleNT: PropTypes.string,
   /** block header of "Old Testament" */