Merge pull request #2 from atlp-rwanda/ch-eslint-precommit-#187419115

#187419115 Configure ESLint and Git Pre commit hook to run tests and ESlint format

Author: teerenzo

Diff for: .eslintignore

@@ -0,0 +1,2 @@
+# jest
+jest.config.*

Diff for: .eslintrc.cjs

@@ -1,18 +1,72 @@
 module.exports = {
   root: true,
-  env: { browser: true, es2020: true },
+  env: {
+    browser: true,
+    es2020: true,
+    node: true,
+  },
   extends: [
-    "eslint:recommended",
+    "airbnb",
+    "airbnb-typescript",
+    "airbnb/hooks",
     "plugin:@typescript-eslint/recommended",
     "plugin:react-hooks/recommended",
   ],
   ignorePatterns: ["dist", ".eslintrc.cjs"],
   parser: "@typescript-eslint/parser",
+  parserOptions: {
+    project: "./tsconfig.eslint.json",
+    tsconfigRootDir: __dirname,
+  },
   plugins: ["react-refresh"],
   rules: {
+    "react/react-in-jsx-scope": "off",
+    "react/function-component-definition": [
+      "warn",
+      {
+        namedComponents: "arrow-function",
+        unnamedComponents: "arrow-function",
+      },
+    ],
+    "no-undef": "off",
     "react-refresh/only-export-components": [
       "warn",
       { allowConstantExport: true },
     ],
+    "@typescript-eslint/quotes": ["off"],
+    "arrow-body-style": ["warn", "as-needed"],
+    "import/order": [
+      "warn",
+      {
+        groups: [
+          "builtin",
+          "external",
+          "internal",
+          "parent",
+          "sibling",
+          "index",
+        ],
+        "newlines-between": "always",
+      },
+    ],
+    "@typescript-eslint/comma-dangle": ["warn", "always-multiline"],
+    "import/no-extraneous-dependencies": [
+      "error",
+      {
+        devDependencies: [
+          "vite.config.ts",
+          "postcss.config.js",
+          "tailwind.config.js",
+        ],
+      },
+    ],
+    "import/extensions": ["off"],
+  },
+  settings: {
+    "import/resolver": {
+      node: {
+        extensions: [".js", ".jsx", ".ts", ".tsx"],
+      },
+    },
   },
 };

Diff for: .github/workflows/deploy.yml

@@ -1,4 +1,3 @@
-
 name: Eagle e-commerce CI/CD
 
 on:
@@ -33,7 +32,7 @@ jobs:
 
       - name: Running test
         run: npm run test --coverage
-      
+
       - name: Build application
         run: npm run build
 

Diff for: .husky/.gitignore

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

Diff for: .husky/pre-commit

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

Diff for: .prettierrc.json

@@ -0,0 +1,10 @@
+{
+  "tabWidth": 2,
+  "useTabs": false,
+  "singleQuote": false,
+  "semi": true,
+  "bracketSpacing": true,
+  "arrowParens": "always",
+  "bracketSameLine": true,
+  "endOfLine": "auto"
+}

Diff for: README.md

@@ -1,5 +1,7 @@
 # EAGLE E-commerce
 
+<img alt="Static Badge" src="https://img.shields.io/badge/Reviewed_By-HoundCI-blue?style=flat-square">
+
 The front-end of Eagle E-commerce utilizes React for a modern, user-friendly interface, while Node.js powers its backend, ensuring a seamless shopping experience
 
 [![Maintainability](https://api.codeclimate.com/v1/badges/81fa30232b27b1482f4f/maintainability)](https://codeclimate.com/github/atlp-rwanda/eagles-ec-fe/maintainability)
@@ -15,33 +17,51 @@ This project was built using the PERN (PostgreSQL, Express.js, React.js, Node.js
 To run the app locally, follow these steps:
 
 1. **Clone the repository:**
+
 ```bash
    git clone https://github.com/atlp-rwanda/eagles-ec-fe.git
-   ```
+```
+
 2. **Change working dir to cloned repo:**
+
 ```bash
 cd eagle-ec-fe
 ```
+
 3. **Install dependencies:**
+
 ```bash
 npm install
 ```
+
 4. **Run developmnt server:**
+
 ```bash
    npm run dev
-   ```
+```
+
 ## How to run test
 
 1. **Run unit test:**
-```bash 
+
+```bash
    npm run test
-   ```
-2. **Tun test in watch mode
- ```bash 
-   npm run test:watch
-   ```
-3. **Generate test coverage
-```bash 
+```
+
+2. \*\*Tun test in watch mode
+
+```bash
+  npm run test:watch
+```
+
+3. \*\*Generate test coverage
+
+```bash
    npm run test:coverage
-   ```
-Write your test by creating a file with .test.tsx extetion under __test__ directory.
+```
+
+Write your test by creating a file with .test.tsx extetion under **test** directory.
+
+```
+
+```

Diff for: hound.yml

@@ -0,0 +1,9 @@
+eslint:
+  enabled: true
+  file_patterns:
+    - "*.js"
+    - "*.ts"
+  enabled_plugins:
+    - eslint-plugin-import
+    - eslint-plugin-prettier
+    - eslint-plugin:@typescript-eslint

Diff for: jest.config.ts

@@ -1,10 +1,10 @@
 export default {
-  preset: 'ts-jest',
-  testEnvironment: 'jest-environment-jsdom',
+  preset: "ts-jest",
+  testEnvironment: "jest-environment-jsdom",
   transform: {
-      "^.+\\.tsx?$": "ts-jest" 
+    "^.+\\.tsx?$": "ts-jest",
   },
   moduleNameMapper: {
-      '\\.(gif|ttf|eot|svg|png)$': '<rootDir>/test/__ mocks __/fileMock.js',
+    "\\.(gif|ttf|eot|svg|png)$": "<rootDir>/test/__ mocks __/fileMock.js",
   },
-}
+};