v3 - organize imports with eslint (#657)

* chore: extend eslint with import organization++

* chore: npm run fix

* chore(eslint): fix errors

* ci: add eslint to github code quality workflow

* docs(README): npm run fix

.eslintrc.cjs

@@ -0,0 +1,71 @@
+module.exports = {
+  parser: "@typescript-eslint/parser",
+  parserOptions: {
+    projectService: true,
+    tsconfigRootDir: __dirname,
+  },
+  extends: [
+    "eslint:recommended",
+    "plugin:storybook/recommended",
+    "plugin:@typescript-eslint/recommended",
+    // "plugin:@typescript-eslint/recommended-type-checked",  // TODO
+    // "plugin:@typescript-eslint/stylistic-type-checked",  // TODO
+    "plugin:import/recommended",
+    "plugin:import/typescript",
+    "plugin:prettier/recommended",
+    "next/core-web-vitals",
+  ],
+  plugins: [
+    "@typescript-eslint",
+    "unused-imports",
+    "no-relative-import-paths",
+    "import",
+    "prettier",
+  ],
+  ignorePatterns: ["dist", "node_modules", ".sanity"],
+  settings: {
+    "import/resolver": {
+      typescript: {
+        project: "./tsconfig.json",
+      },
+    },
+  },
+  rules: {
+    "@typescript-eslint/no-explicit-any": "off", // TODO
+    "unused-imports/no-unused-imports": "error",
+    "import/no-named-as-default": "off",
+    "import/no-unresolved": "error",
+    "no-relative-import-paths/no-relative-import-paths": [
+      "warn",
+      { allowSameFolder: true },
+    ],
+    "import/order": [
+      "error",
+      {
+        groups: [
+          "builtin", // from NodeJS native
+          "external",
+          "internal",
+          ["sibling", "parent"], // sibling and parent types they can be mingled together
+          "index",
+          "unknown",
+        ],
+        "newlines-between": "always",
+        alphabetize: {
+          order: "asc",
+          caseInsensitive: true,
+        },
+      },
+    ],
+    "sort-imports": [
+      "error",
+      {
+        ignoreCase: false,
+        ignoreDeclarationSort: true, // handled by eslint-plugin-import
+        ignoreMemberSort: false,
+        memberSyntaxSortOrder: ["none", "all", "multiple", "single"],
+        allowSeparatedGroups: true,
+      },
+    ],
+  },
+};

.github/workflows/prettier.yml → .github/workflows/code-quality.yml

@@ -1,11 +1,11 @@
-name: Prettier Check
+name: Code Quality Checks
 
 on:
   pull_request:
     branches: [main, v3]
 
 jobs:
-  prettier:
+  code_quality:
     runs-on: ubuntu-latest
 
     steps:
@@ -16,9 +16,15 @@ jobs:
         uses: actions/cache@v4
         with:
           path: ~/.npm
-          key: ${{ runner.os }}-npm-${{ hashFiles('**/workflows/prettier.yml') }}
+          key: ${{ runner.os }}-npm-${{ hashFiles('**/workflows/code-quality.yml') }}
           restore-keys: |
             ${{ runner.os }}-npm-
 
+      - name: Install dependencies
+        run: npm ci
+
       - name: Prettier Check
         run: npx prettier --check .
+
+      - name: ESLint Check
+        run: npx eslint .

README.md

@@ -82,6 +82,7 @@ To get started with Sankitty, follow these steps:
 - `npm run start`: Start the Next.js application in production mode.
 - `npm run format`: Format the codebase using Prettier to ensure consistent code style across the project.
 - `npm run lint`: Lint the project using ESLint.
+- `npm run fix`: Format and lint in one command.
 
 ## Project Structure