🎨 install simple-import-sort

- apply simple-import-sort
- react-hooks error fix with @13.4.8
vercel/next.js#52365

.eslintrc.json

@@ -1,16 +1,31 @@
 {
-  "parser": "@typescript-eslint/parser",
+  "env": { "browser": true, "es6": true, "node": true },
   "parserOptions": {
+    "sourceType": "module",
     "project": "./tsconfig.json"
   },
+  "parser": "@typescript-eslint/parser",
   "extends": [
     "next/core-web-vitals",
     "eslint:recommended",
     "plugin:react/recommended",
     "plugin:prettier/recommended",
-    "airbnb",
     "plugin:@typescript-eslint/recommended",
-    "prettier/@typescript-eslint"
+    "airbnb",
+    "airbnb-typescript"
+  ],
+  "plugins": [
+    "prettier",
+    "react",
+    "react-hooks",
+    "import",
+    "simple-import-sort"
   ],
-  "plugins": ["prettier", "react", "react-hooks"]
+  "rules": {
+    "simple-import-sort/imports": "error",
+    "simple-import-sort/exports": "error",
+    "import/first": "error",
+    "import/newline-after-import": "error",
+    "import/no-duplicates": "error"
+  }
 }

package.json

@@ -12,7 +12,7 @@
     "@types/node": "20.4.5",
     "@types/react": "18.2.17",
     "@types/react-dom": "18.2.7",
-    "eslint-config-next": "13.4.12",
+    "eslint-config-next": "13.4.8",
     "next": "13.4.12",
     "react": "18.2.0",
     "react-dom": "18.2.0"
@@ -22,12 +22,14 @@
     "@typescript-eslint/parser": "^6.2.0",
     "eslint": "8.46.0",
     "eslint-config-airbnb": "^19.0.4",
+    "eslint-config-airbnb-typescript": "^17.1.0",
     "eslint-config-prettier": "^8.9.0",
     "eslint-plugin-import": "^2.28.0",
     "eslint-plugin-jsx-a11y": "^6.7.1",
     "eslint-plugin-prettier": "^5.0.0",
     "eslint-plugin-react": "^7.33.0",
     "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-simple-import-sort": "^10.0.0",
     "prettier": "^3.0.0",
     "typescript": "5.1.6"
   }

src/app/layout.tsx

@@ -1,4 +1,5 @@
 import type { Metadata } from 'next';
+import React from 'react';
 
 export const metadata: Metadata = {
   title: 'synuns blog',

src/app/page.tsx

@@ -1,3 +1,5 @@
+import React from 'react';
+
 export default function Home() {
-  return <div>Hello synuns!</div>;
+  return <div>hello synuns!</div>;
 }