fix: eslint, prettier, stylelint setup and use yarn berry

.editorconfig

@@ -0,0 +1,10 @@
+root = true
+
+[*]
+end_of_line = lf
+insert_final_newline = true
+
+[*.{js,json,yml}]
+charset = utf-8
+indent_style = space
+indent_size = 2

.eslintignore

@@ -1 +1,4 @@
-src/serviceWorker.ts
+vite.config.mts
+.eslintrc.cjs
+dist
+stylelint.config.cjs

.eslintrc.js → .eslintrc.cjs

@@ -1,19 +1,41 @@
 module.exports = {
-  extends: ["airbnb-typescript-prettier"], // if you're using typescript,
+  root: true,
+  extends: [
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:@typescript-eslint/recommended-type-checked",
+    "plugin:@typescript-eslint/stylistic-type-checked",
+    "plugin:react-hooks/recommended",
+    "plugin:import/recommended",
+    "plugin:import/typescript",
+  ],
+  parser: "@typescript-eslint/parser",
   parserOptions: {
-    project: "./tsconfig.json",
-    sourceType: "module",
+    project: true,
+    tsconfigRootDir: __dirname,
   },
-  ignorePatterns: ['.eslintrc.js'], // !!! new and important part !!!
+  settings: {
+    react: {
+      version: "detect", // React version. "detect" automatically picks the version you have installed.
+    },
+  },
+  plugins: ["@typescript-eslint"],
   rules: {
     // I prefer to use named export
-    // See: https://github.com/benmosher/eslint-plugin-import/blob/master/docs/rules/no-named-as-default.md#importno-named-as-default
+    // See: https://github.com/import-js/eslint-plugin-import/blob/master/docs/rules/no-named-as-default.md#importno-named-as-default
     "import/prefer-default-export": 0,
 
     // Ignore test files per the docs
-    // See: https://github.com/benmosher/eslint-plugin-import/blob/master/docs/rules/no-extraneous-dependencies.md#options
+    // See: https://github.com/import-js/eslint-plugin-import/blob/master/docs/rules/no-extraneous-dependencies.md#options
     "import/no-extraneous-dependencies": [
-      "error", {"devDependencies": ["**/*.test.+(ts|tsx|js|jsx)", "**/*.spec.+(ts|tsx|js|jsx)"]}],
+      "error",
+      {
+        devDependencies: [
+          "**/*.test.+(ts|tsx|js|jsx)",
+          "**/*.spec.+(ts|tsx|js|jsx)",
+        ],
+      },
+    ],
     "import/no-named-as-default": 0,
 
     // See: https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/no-non-null-assertion.md
@@ -23,7 +45,7 @@ module.exports = {
     "@typescript-eslint/explicit-function-return-type": 0,
 
     // See: https://eslint.org/docs/rules/no-unused-expressions
-    "no-unused-expressions": ["error", { "allowShortCircuit": true }],
+    "no-unused-expressions": ["error", { allowShortCircuit: true }],
 
     // First import is the React package, just to follow the standard convention.
     // See: https://github.com/benmosher/eslint-plugin-import/blob/master/docs/rules/order.md
@@ -52,6 +74,8 @@ module.exports = {
         },
       },
     ],
+    // In React v17.0, a new JSX transform was introduced, which automatically imports special functions from the React package’s new entry points, removing the need to import React in every file that uses JSX explicitly.
+    "react/react-in-jsx-scope": "off",
+    "react/jsx-uses-react": "off",
   },
-  // plugins: ['prettier'],
 };

.gitattributes

@@ -0,0 +1,4 @@
+/.yarn/**            linguist-vendored
+/.yarn/releases/*    binary
+/.yarn/plugins/**/*  binary
+/.pnp.*              binary linguist-generated

.gitignore

@@ -28,4 +28,12 @@ yarn-error.log*
 
 # yarn
 yarn.lock
+.yarn/*
+!.yarn/cache
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
+
 .vercel