React: Routing and Hooks

.editorconfig

@@ -0,0 +1,7 @@
+#editorconfig.org
+#root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+insert_final_newline = true

.gitignore

@@ -43,4 +43,3 @@ out/
 
 # tests
 coverage/
-

.husky/pre-push

@@ -1,9 +1,15 @@
 #!/bin/sh
+set -e
 
-branch=$(git rev-parse --abbrev-ref HEAD)
+blocked=0
+while read -r local_ref local_sha remote_ref remote_sha; do
+  if [ "$remote_ref" = "refs/heads/main" ]; then
+    echo "❌ Push to main is blocked!"
+    blocked=1
+  fi
+done
 
-if [ "$branch" = "main" ]; then
-  echo "❌ Push to main is blocked!"
+if [ $blocked -ne 0 ]; then
   exit 1
 fi
 

.prettierignore

@@ -0,0 +1,5 @@
+node_modules
+dist
+build
+coverage
+routeTree.gen.ts

.prettierrc

@@ -1,6 +1,8 @@
 {
-  "trailingComma": "es5",
+  "trailingComma": "all",
   "tabWidth": 2,
   "semi": true,
-  "singleQuote": true
+  "singleQuote": true,
+  "endOfLine": "lf",
+  "insertFinalNewline": true
 }

eslint.config.js

@@ -1,48 +1,57 @@
 import js from '@eslint/js';
-import globals from 'globals';
+import { defineConfig } from 'eslint/config';
+import reactPlugin from 'eslint-plugin-react';
 import reactHooks from 'eslint-plugin-react-hooks';
 import reactRefresh from 'eslint-plugin-react-refresh';
-import reactPlugin from 'eslint-plugin-react';
-import eslintConfigPrettier from 'eslint-config-prettier/flat';
 import eslintPluginUnicorn from 'eslint-plugin-unicorn';
+import eslintPluginPrettier from 'eslint-plugin-prettier/recommended';
+import globals from 'globals';
 import tseslint from 'typescript-eslint';
-import { defineConfig, globalIgnores } from 'eslint/config';
 
 export default defineConfig([
   js.configs.recommended,
-  ...tseslint.configs.strictTypeChecked,
-  ...tseslint.configs.stylisticTypeChecked,
+  tseslint.configs.strictTypeChecked,
+  tseslint.configs.stylisticTypeChecked,
+  reactPlugin.configs.flat.recommended,
   reactHooks.configs.flat.recommended,
   reactRefresh.configs.vite,
-  reactPlugin.configs.flat.recommended,
-  reactPlugin.configs.flat['jsx-runtime'],
   eslintPluginUnicorn.configs.recommended,
-  eslintConfigPrettier,
+  eslintPluginPrettier,
   {
     files: ['**/*.{ts,tsx}'],
+    plugins: {},
     languageOptions: {
       globals: {
         ...globals.browser,
         ...globals.es2021,
         ...globals.node,
       },
+      ecmaVersion: 'latest',
+      sourceType: 'module',
       parserOptions: {
         projectService: true,
         tsconfigRootDir: import.meta.dirname,
+        ecmaFeatures: {
+          globalReturn: false,
+          jsx: true,
+        },
       },
     },
     settings: {
       react: {
         version: 'detect',
       },
+      'import/resolver': {
+        typescript: {
+          project: './tsconfig.json',
+        },
+      },
     },
     linterOptions: {
       noInlineConfig: true,
     },
     rules: {
       // 🔴 Mandatory
-      ...reactPlugin.configs.recommended.rules,
-      ...reactHooks.configs.recommended.rules,
       '@typescript-eslint/no-unused-vars': [
         'error',
         {
@@ -60,8 +69,11 @@ export default defineConfig([
       '@typescript-eslint/no-unsafe-argument': 'error',
       '@typescript-eslint/no-unsafe-member-access': 'error',
       '@typescript-eslint/no-unsafe-return': 'error',
-      '@typescript-eslint/no-unsafe-assignment': 'off', //* switched off for now
-      '@typescript-eslint/no-unsafe-call': 'off', //* switched off for now
+      '@typescript-eslint/no-unsafe-call': 'error',
+      '@typescript-eslint/no-confusing-void-expression': [
+        'error',
+        { ignoreArrowShorthand: true },
+      ],
 
       'react-hooks/exhaustive-deps': 'warn',
 
@@ -118,7 +130,7 @@ export default defineConfig([
       semi: ['error', 'always'],
       curly: ['error', 'all'],
       indent: ['error', 2, { SwitchCase: 1 }],
-      'comma-dangle': ['off'],
+      'comma-dangle': ['error', 'always-multiline'],
       'object-curly-spacing': ['error', 'always'],
       'brace-style': [
         'error',
@@ -131,15 +143,10 @@ export default defineConfig([
       'max-len': ['warn', { code: 120, ignoreComments: true }],
 
       // 🔧 Switched off
-      'boundaries/element-types': 'off',
       'no-undef': 'off',
       'no-restricted-exports': 'off',
       'react/prop-types': 'off',
       'react/react-in-jsx-scope': 'off',
-      'react-refresh/only-export-components': [
-        'off',
-        { allowConstantExport: true },
-      ],
 
       'unicorn/no-array-reduce': 'off',
       'unicorn/no-array-for-each': 'off',
@@ -148,6 +155,7 @@ export default defineConfig([
       'unicorn/filename-case': 'off',
       'unicorn/number-literal-case': 'off',
       'unicorn/prefer-query-selector': 'off',
+      'unicorn/explicit-length-check': 'off',
     },
   },
   {
@@ -163,15 +171,14 @@ export default defineConfig([
   {
     files: ['**/*.test.ts', '**/*.test.tsx', '**/*.spec.ts', '**/*.spec.tsx'],
     rules: {
-      '@typescript-eslint/no-unsafe-member-access': 'off',
-      '@typescript-eslint/no-unsafe-assignment': 'off',
-      '@typescript-eslint/no-unsafe-argument': 'off',
-      '@typescript-eslint/no-unsafe-return': 'off',
-      '@typescript-eslint/await-thenable': 'off',
-      'max-lines-per-function': [
-        'off',
-        { max: 80, skipBlankLines: true, skipComments: true },
-      ],
+      'max-lines-per-function': 'off',
+      '@typescript-eslint/consistent-type-assertions': 'off',
+    },
+  },
+  {
+    files: ['**/store/**/*.ts', '**/store/**/*.tsx'],
+    rules: {
+      'unicorn/prefer-spread': 'off',
     },
   },
   {
@@ -183,6 +190,8 @@ export default defineConfig([
       '**/coverage/**',
       'eslint.config.js',
       'lint-staged.config.js',
+      'stylelint.config.js',
+      '**/routeTree.gen.ts',
     ],
   },
 ]);

index.html

@@ -2,7 +2,7 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/favicon.ico" />
+    <link rel="icon" type="image/x-icon" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>RS React App</title>
   </head>