chore(eslint + jest setup): new eslint rules and jest setup

.eslintignore

+next.config.js
+tailwind.config.js
+prettier.config.js
+postcss.config.js
+jest.config.mjs
\ No newline at end of file

.eslintrc.json

@@ -8,7 +8,9 @@
     "airbnb/hooks",
     "plugin:@typescript-eslint/recommended",
     "plugin:react/recommended",
-    "plugin:jsx-a11y/recommended"
+    "plugin:jsx-a11y/recommended",
+    "plugin:@next/next/recommended",
+    "prettier"
   ],
   "parserOptions": {
     "ecmaVersion": 2015,
@@ -18,14 +20,15 @@
       "tsx": true
     }
   },
-  "plugins": [
-    "import",
-    "jsx-a11y",
-    "react",
-    "react-hooks",
-    "@typescript-eslint"
-  ],
+  "plugins": ["import", "jsx-a11y", "react", "react-hooks", "@typescript-eslint"],
   "rules": {
+    "react/function-component-definition": [
+      2,
+      {
+        "namedComponents": "arrow-function",
+        "unnamedComponents": "arrow-function"
+      }
+    ],
     "no-console": "error",
     "no-magic-numbers": ["error", {}],
     "react/require-default-props": "off",
@@ -50,19 +53,19 @@
     "react-hooks/exhaustive-deps": "warn",
     "import/prefer-default-export": "off",
     "react/no-multi-comp": "error",
-    "jest/expect-expect": [
+    "import/no-extraneous-dependencies": [
       "error",
       {
-        "assertFunctionNames": [
-          "expect",
-          "expectToThrow",
-          "expectEmptyFragment"
-        ]
+        "devDependencies": [
+          "test.{ts,tsx}", // repos with a single test file
+          "test-*.{ts,tsx}", // repos with multiple top-level test files
+          "**/*{.,_}{test,spec}.{ts,tsx}", // tests where the extension or filename suffix denotes that it is a test
+          "**/jest.config.ts", // jest config
+          "**/jest.setup.ts" // jest setup
+        ],
+        "optionalDependencies": false
       }
-    ],
-    "tailwindcss/no-contradicting-classname": "error",
-    "testing-library/prefer-find-by": "error",
-    "testing-library/prefer-screen-queries": "error"
+    ]
   },
   "overrides": [
     {

.next/cache/eslint/.cache_1j5ja0v

+[{"/Users/Tadeusz/Documents/GitHub/minerva-frontend/src/components/[DomainName]/ExampleDomain.component.tsx":"1","/Users/Tadeusz/Documents/GitHub/minerva-frontend/src/components/[DomainName]/ExampleDomain.test.tsx":"2","/Users/Tadeusz/Documents/GitHub/minerva-frontend/src/components/[OtherDomainName]/OtherExampleDomain.component.ts":"3"},{"size":131,"mtime":1695066716603,"results":"4","hashOfConfig":"5"},{"size":101,"mtime":1695062400512,"results":"6","hashOfConfig":"5"},{"size":0,"mtime":1695028170381,"results":"7","hashOfConfig":"5"},{"filePath":"8","messages":"9","suppressedMessages":"10","errorCount":2,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":2,"fixableWarningCount":0,"source":null},"a46fgr",{"filePath":"11","messages":"12","suppressedMessages":"13","errorCount":3,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":2,"fixableWarningCount":0,"source":null},{"filePath":"14","messages":"15","suppressedMessages":"16","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/Tadeusz/Documents/GitHub/minerva-frontend/src/components/[DomainName]/ExampleDomain.component.tsx",["17","18"],[],"/Users/Tadeusz/Documents/GitHub/minerva-frontend/src/components/[DomainName]/ExampleDomain.test.tsx",["19","20","21"],[],"/Users/Tadeusz/Documents/GitHub/minerva-frontend/src/components/[OtherDomainName]/OtherExampleDomain.component.ts",[],[],{"ruleId":"22","severity":2,"message":"23","line":3,"column":23,"nodeType":"24","messageId":"25","endLine":5,"endColumn":2,"fix":"26"},{"ruleId":"27","severity":2,"message":"28","line":3,"column":45,"nodeType":"24","messageId":"29","endLine":5,"endColumn":2,"fix":"30"},{"ruleId":"31","severity":2,"message":"32","line":3,"column":7,"nodeType":"33","messageId":"34","endLine":3,"endColumn":20},{"ruleId":"22","severity":2,"message":"23","line":3,"column":23,"nodeType":"24","messageId":"25","endLine":7,"endColumn":2,"fix":"35"},{"ruleId":"27","severity":2,"message":"28","line":3,"column":41,"nodeType":"24","messageId":"29","endLine":7,"endColumn":2,"fix":"36"},"react/function-component-definition","Function component is not a function declaration","ArrowFunctionExpression","function-declaration",{"range":"37","text":"38"},"arrow-body-style","Unexpected block statement surrounding arrow body; move the returned value immediately after the `=>`.","unexpectedSingleBlock",{"range":"39","text":"40"},"@typescript-eslint/no-unused-vars","'TestComponent' is assigned a value but never used.","Identifier","unusedVar",{"range":"41","text":"42"},{"range":"43","text":"44"},[28,100],"function ExampleDomain(): JSX.Element {\n    return (<p>test</p>)\n}",[72,100],"(<p>test</p>)",[28,101],"function TestComponent():JSX.Element {\n    \n return(   <p>test</p>)\n\n}",[68,101],"(   <p>test</p>)"]
\ No newline at end of file

jest.config.mjs

+import nextJest from 'next/jest.js';
+
+const createJestConfig = nextJest({
+  // Provide the path to your Next.js app to load next.config.js and .env files in your test environment
+  dir: './',
+});
+
+// Add any custom config to be passed to Jest
+/** @type {import('jest').Config} */
+const config = {
+  // Add more setup options before each test is run
+  // setupFilesAfterEnv: ['<rootDir>/jest.setup.js'],
+
+  testEnvironment: 'jest-environment-jsdom',
+  rootDir: '../',
+  testMatch: [
+    '<rootDir>/src/**/__tests__/**/*.{js,jsx,ts,tsx}',
+    '<rootDir>/src/**/*.{spec,test}.{js,jsx,ts,tsx}',
+  ],
+};
+
+// createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
+export default createJestConfig(config);

package.json

@@ -8,7 +8,8 @@
     "start": "next start",
     "lint": "next lint",
     "prepare": "husky install",
-    "postinstall": "husky install"
+    "postinstall": "husky install",
+    "test": "jest --watch --config ./jest.config.mjs"
   },
   "lint-staged": {
     "**/*.{js,jsx,ts,tsx}": [
@@ -34,11 +35,14 @@
   "devDependencies": {
     "@commitlint/cli": "^17.7.1",
     "@commitlint/config-conventional": "^17.7.0",
+    "@testing-library/jest-dom": "^6.1.3",
+    "@testing-library/react": "^14.0.0",
     "@typescript-eslint/eslint-plugin": "^6.7.0",
     "@typescript-eslint/parser": "^6.7.0",
     "cz-conventional-changelog": "^3.3.0",
     "eslint": "^8.49.0",
     "eslint-config-airbnb": "^19.0.4",
+    "eslint-config-prettier": "^9.0.0",
     "eslint-config-standard-with-typescript": "^39.0.0",
     "eslint-plugin-import": "^2.28.1",
     "eslint-plugin-jsx-a11y": "^6.7.1",
@@ -48,6 +52,8 @@
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-testing-library": "^6.0.1",
     "husky": "^8.0.3",
+    "jest": "^29.7.0",
+    "jest-environment-jsdom": "^29.7.0",
     "lint-staged": "^14.0.1",
     "prettier": "^3.0.3",
     "typescript": "^5.2.2"

prettier.config.js

-module.exports = {
+const config = {
   singleQuote: true,
   trailingComma: 'all',
   printWidth: 100,
   'color-hex-case': 'upper',
   arrowParens: 'avoid',
-  plugins: [require('prettier-plugin-tailwindcss')],
 };
+
+module.exports = config;

src/components/[DomainName]/ExampleDomain.component.tsx

+import React from 'react';
+
+const ExampleDomain = (): JSX.Element => <p>test</p>;
+
+export default ExampleDomain;

src/components/[DomainName]/ExampleDomain.test.tsx

+import React from 'react';
+import { render, screen } from '@testing-library/react';
+
+import ExampleDomain from './ExampleDomain.component';
+
+describe('ExampleDomain - component', () => {
+  it('should return true', () => {
+    render(<ExampleDomain />);
+    expect(screen.getByText('test'));
+  });
+});