add eslint rule to disable relative import outside of same folder

.eslintrc.json

@@ -10,7 +10,8 @@
   },
   "plugins": [
     "@typescript-eslint",
-    "import"
+    "import",
+    "no-relative-import-paths"
   ],
   "extends": [
     "plugin:import/recommended",
@@ -49,6 +50,12 @@
     "react/button-has-type": 2,
     "react/no-array-index-key": 2,
     "import/order": 2,
+    "no-relative-import-paths/no-relative-import-paths": [
+      "error",
+      {
+        "allowSameFolder": true
+      }
+    ],
     "semi": [
       2,
       "always"

package.json

@@ -38,6 +38,7 @@
     "eslint-config-prettier": "^8.10.0",
     "eslint-import-resolver-typescript": "^3.5.5",
     "eslint-plugin-import": "^2.28.0",
+    "eslint-plugin-no-relative-import-paths": "^1.5.2",
     "husky": "^8.0.0",
     "jest": "^29.6.2",
     "jest-environment-jsdom": "^29.6.2",
@@ -46,4 +47,4 @@
     "tailwindcss": "3.3.3",
     "typescript": "5.1.6"
   }
-}
+}

src/app/layout.tsx

@@ -1,7 +1,8 @@
 import "./globals.css";
 import type { Metadata } from "next";
 import { Inter } from "next/font/google";
-import { StoreProvider, Navbar } from "@/components";
+import { StoreProvider } from "@/components";
+import  Navbar  from '../components/navbar/Navbar'
 
 export const metadata: Metadata = {
   title: "Create Next App",

yarn.lock

@@ -2409,6 +2409,11 @@ eslint-plugin-jsx-a11y@^6.5.1:
     object.fromentries "^2.0.6"
     semver "^6.3.0"
 
+eslint-plugin-no-relative-import-paths@^1.5.2:
+  version "1.5.2"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-no-relative-import-paths/-/eslint-plugin-no-relative-import-paths-1.5.2.tgz#c35f2fd0bf2a6a57b268193ed7df63ff7000134e"
+  integrity sha512-wMlL+TVuDhKk1plP+w3L4Hc7+u89vUkrOYq6/0ARjcYqwc9/YaS9uEXNzaqAk+WLoEgakzNL5JgJJw6m4qd5zw==
+
 [email protected]:
   version "5.0.0-canary-7118f5dd7-20230705"
   resolved "https://registry.yarnpkg.com/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-5.0.0-canary-7118f5dd7-20230705.tgz#4d55c50e186f1a2b0636433d2b0b2f592ddbccfd"