Refactors using eslint

Author: Aadv1k

.husky/pre-commit

@@ -1,4 +1,4 @@
 #!/usr/bin/env sh
 . "$(dirname -- "$0")/_/husky.sh"
 
-npm run lint
+npm run lint:ws

config/.eslintrc.js

@@ -1,5 +1,12 @@
 module.exports = {
   extends: ["airbnb", "eslint-config-prettier"],
+  parserOptions: {
+    parser: '@babel/eslint-parser',
+    requireConfigFile: false, // <== ADD THIS
+    ecmaVersion: 2018, // Allows for the parsing of modern ECMAScript features
+    sourceType: 'module' // Allows for the use of imports
+  },
+  
   plugins: ["prettier", "jest"],
   env: {
     browser: true,
@@ -12,7 +19,6 @@ module.exports = {
     "prettier/allowParens": "off",
     sourceType: 0,
     "no-restricted-syntax": ["off"],
-    // why? just why is this even a thing? to make Js code look cool?
     "react/destructuring-assignment": ["off"],
     "react/jsx-filename-extension": ["off"],
     radix: "off",

package-lock.json

@@ -11,6 +11,7 @@
     "build": "npm run build --ws && npm exec --ws -c ../../../scripts/deploy.sh && ./scripts/deployStatic.sh",
     "femFetch": "./scripts/femfetch.sh",
     "lint": "eslint .",
+    "lint:ws": "npm exec --ws -c 'eslint --ext=.js,.jsx .'",
     "lint:fix": "eslint . --fix",
     "test:ws": "npm run test --if-present --ws",
     "format": "prettier --write ."
@@ -26,6 +27,7 @@
   },
   "homepage": "https://github.com/aadv1k/frontend-projects#readme",
   "devDependencies": {
+    "@babel/eslint-parser": "^7.18.9",
     "@parcel/transformer-sass": "^2.6.2",
     "eslint": "^8.21.0",
     "eslint-config-airbnb": "^19.0.4",

package.json

@@ -10,7 +10,7 @@ import DocumentContext from "./contexts/DocumentContext";
 
 import "./App.css";
 
-// Works ¯\_(ツ)_/¯heigh
+// Works ¯\_(ツ)_/¯
 // After refactoring the Navbar component to use DocumentContext I have come to
 // realize that there isn't much point using contexts in this case, the main
 // "issue" was the AppDrawer component, which required passing down props to a
@@ -68,7 +68,10 @@ export default class extends Component {
   }
 
   setDrawerState() {
-    this.setState({ drawer: !this.state.drawer });
+    const { drawer } = this.state;
+    this.setState({
+      drawer: !drawer,
+    });
   }
 
   saveDocumentToLocalStorage(content, id, name, lastOpened = true) {

packages/frontendmentor/fem-inbrowser-markdown-editor/src/App.jsx

@@ -17,7 +17,8 @@ import style from "./Navbar.module.css";
 import Modal from "./Modal.jsx";
 import DocumentContext from "../contexts/DocumentContext";
 
-export default class extends Component {
+export default class Navbar extends Component {
+  static contextType = DocumentContext; // eslint-disable-line
   constructor(props) {
     super(props);
     this.inputRef = createRef();
@@ -27,8 +28,6 @@ export default class extends Component {
     };
   }
 
-  static contextType = DocumentContext;
-
   setModalState() {
     this.setState({ modal: !this.state.modal });
   }