[SUGGESTION]: Use src/ folder on frontend (#219)

* feat: suggestion of src folder structure

* fix: update tsconfig

* fix: eslint config and require

* fix: eslint config and require

* fix: jest tests

* fix: solve merge conflits

* fix: package.json versions

backend/package.json

@@ -72,7 +72,6 @@
 		"@nestjs/testing": "^8.4.4",
 		"@types/express": "^4.17.13",
 		"@types/jest": "^27.4.1",
-		"@types/mongodb": "^4.0.7",
 		"@types/node": "^17.0.23",
 		"@types/supertest": "^2.0.12",
 		"@typescript-eslint/eslint-plugin": "^5.18.0",

backend/src/modules/users/dto/create.user.dto.ts

@@ -15,13 +15,13 @@ export default class CreateUserDto {
 
   @IsString()
   @IsNotEmpty()
-  @MinLength(2)
+  @MinLength(3)
   @Transform(({ value }: TransformFnParams) => value.trim())
   firstName!: string;
 
   @IsString()
   @IsNotEmpty()
-  @MinLength(2)
+  @MinLength(3)
   @Transform(({ value }: TransformFnParams) => value.trim())
   lastName!: string;
 

frontend/.eslintignore

@@ -1,3 +1,5 @@
+# .eslintrc.js
+
 # dependencies
 /node_modules
 /.pnp

frontend/.eslintrc.js

@@ -0,0 +1,101 @@
+// eslint-disable-next-line @typescript-eslint/no-var-requires
+const fs = require('fs');
+
+const folders = fs
+	.readdirSync('src', { withFileTypes: true })
+	.filter((dirent) => dirent.isDirectory())
+	.map((dirent) => !['styles'].includes(dirent.name) && dirent.name);
+
+module.exports = {
+	env: {
+		browser: true,
+		es2021: true
+	},
+	extends: [
+		'plugin:react/recommended',
+		'airbnb',
+		'airbnb-typescript',
+		'prettier',
+		'airbnb-typescript-prettier'
+	],
+	parser: '@typescript-eslint/parser',
+	parserOptions: {
+		ecmaFeatures: {
+			jsx: true
+		},
+		ecmaVersion: 12,
+		sourceType: 'module',
+		extraFileExtensions: ['.css'],
+		project: './tsconfig.json'
+	},
+	plugins: [
+		'react',
+		'@typescript-eslint',
+		'simple-import-sort',
+		'import',
+		'unused-imports',
+		'prettier'
+	],
+	rules: {
+		'react/react-in-jsx-scope': 'off',
+		'react/jsx-filename-extension': [
+			1,
+			{
+				extensions: ['.ts', '.tsx']
+			}
+		],
+		'react/jsx-props-no-spreading': 'off',
+		'no-underscore-dangle': 'off',
+		'no-param-reassign': 'off',
+		'react/function-component-definition': 'off',
+		'@typescript-eslint/no-empty-interface': 'off',
+		'import/prefer-default-export': 'off',
+		'import/no-cycle': 'off',
+		'no-plusplus': 'off',
+		'no-useless-escape': 'off',
+		'no-restricted-exports': 'off',
+		'jsx-a11y/anchor-is-valid': [
+			'error',
+			{
+				components: ['Link'],
+				specialLink: ['hrefLeft', 'hrefRight'],
+				aspects: ['invalidHref', 'preferButton']
+			}
+		],
+		'simple-import-sort/imports': 'error',
+		'simple-import-sort/exports': 'error',
+		'import/first': 'error',
+		'import/newline-after-import': 'error',
+		'import/no-duplicates': 'error',
+		'unused-imports/no-unused-imports': 'error',
+		'prettier/prettier': ['error', { usePrettierrc: true }]
+	},
+	settings: {
+		'import/resolver': {
+			node: {
+				extensions: ['.js', '.jsx', '.ts', '.tsx'],
+				moduleDirectory: ['node_modules', 'src/']
+			}
+		}
+	},
+	overrides: [
+		{
+			files: ['**/*.ts?(x)'],
+			rules: {
+				'simple-import-sort/imports': [
+					'error',
+					{
+						groups: [
+							// Packages. `react` related packages come first.
+							// Things that start with a letter (or digit or underscore), or `@` followed by a letter.
+							['^react', '^next', '^recoil', '^@?\\w'], // Absolute imports and Relative imports.
+							['^styles'],
+							[`^(${folders.join('|')})(/.*|$)`, '^\\.'], // for scss imports.
+							['^[^.]']
+						]
+					}
+				]
+			}
+		}
+	]
+};

frontend/.gitignore

@@ -37,5 +37,5 @@ yarn-error.log*
 .vercel
 
 #cypress
-/cypress/screenshots/
-/cypress/videos/
+/src/cypress/screenshots/
+/src/cypress/videos/

frontend/.prettierrc

@@ -1,22 +1,22 @@
 {
-	"tabWidth": 4,
-	"useTabs": true,
-	"singleQuote": true,
-	"printWidth": 100,
-	"semi": true,
-	"trailingComma": "none",
-	"overrides": [
-		{
-			"files": [
-				"*.yml",
-				"*.yaml",
-				"**/*.yml",
-				"**/*.yaml"
-			],
-			"options": {
-				"tabWidth": 2,
-				"useTabs": false
-			}
-		}
-	]
+  "tabWidth": 4,
+  "useTabs": true,
+  "singleQuote": true,
+  "printWidth": 100,
+  "semi": true,
+  "trailingComma": "none",
+  "overrides": [
+    {
+      "files": [
+        "*.yml",
+        "*.yaml",
+        "**/*.yml",
+        "**/*.yaml"
+      ],
+      "options": {
+        "tabWidth": 2,
+        "useTabs": false
+      }
+    }
+  ]
 }

frontend/jest.config.js

@@ -1,22 +1,22 @@
 // jest.config.js
 // eslint-disable-next-line @typescript-eslint/no-var-requires
-const nextJest = require("next/jest");
+const nextJest = require('next/jest');
 
 const createJestConfig = nextJest({
-  // Provide the path to your Next.js app to load next.config.js and .env files in your test environment
-  dir: "./",
+	// 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
 const customJestConfig = {
-  // Add more setup options before each test is run
-  setupFilesAfterEnv: ["<rootDir>/jest.setup.js"],
-  // if using TypeScript with a baseUrl set to the root directory then you need the below for alias' to work
-  moduleDirectories: ["node_modules", "<rootDir>/"],
-  testEnvironment: "jest-environment-jsdom",
-  moduleNameMapper: {
-    "\\.svg$": "<rootDir>/public/icons/",
-  },
+	// Add more setup options before each test is run
+	setupFilesAfterEnv: ['<rootDir>/jest.setup.js'],
+	// if using TypeScript with a baseUrl set to the root directory then you need the below for alias' to work
+	moduleDirectories: ['node_modules', '<rootDir>/src'],
+	testEnvironment: 'jest-environment-jsdom',
+	moduleNameMapper: {
+		'\\.svg$': '<rootDir>/public/icons/'
+	}
 };
 
 // createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async

frontend/jest.setup.js

@@ -1 +1 @@
-import "@testing-library/jest-dom/extend-expect";
+import '@testing-library/jest-dom/extend-expect';