.eslintrc

{
  "root": true,
  "parser": "@typescript-eslint/parser",
  "plugins": ["@typescript-eslint", "prettier", "simple-import-sort"],
  "extends": [
    "eslint:recommended",
    "plugin:@typescript-eslint/recommended",
    "plugin:import/recommended",
    "plugin:import/typescript",
    "react-app"
  ],
  "env": { "browser": true, "node": true },
  "overrides": [
    {
      // enable the rule specifically for TypeScript files
      "files": ["*.ts", "*.js"],
      "rules": {
        "@typescript-eslint/explicit-module-boundary-types": [0],
        "@typescript-eslint/ban-ts-comment": 0,
        "@typescript-eslint/no-var-requires": 0,
        "@typescript-eslint/no-empty-function": 0,
        "@typescript-eslint/no-non-null-assertion": 0,
        "@typescript-eslint/no-non-null-asserted-optional-chain": 0,
        "complexity": ["error", 6], // if a function is getting too complex it should be broken down
        "curly": ["error", "all"], // use curly brace even for single line functions
        "comma-dangle": ["error", "always-multiline"], // easier to see git diff
        "prefer-template": ["error"], // easier to read code when variables are used,
        "prettier/prettier": [
          "error",
          {
            "endOfLine": "auto" // This is need to handle different end-of-line in windows/mac
          }
        ],
        "no-case-declarations": "warn",
        "no-empty": ["error", { "allowEmptyCatch": true }],
        "@typescript-eslint/no-unused-vars": [
          "error",
          { "vars": "all", "args": "after-used", "ignoreRestSiblings": false, "argsIgnorePattern": "^_" }
        ],
        "@typescript-eslint/no-explicit-any": 0,
        "react/jsx-curly-brace-presence": [
          2,
          {
            "props": "never"
          }
        ],
        "react/self-closing-comp": [
          "error",
          {
            "component": true,
            "html": false
          }
        ]
      }
    },
    {
      // https://stackoverflow.com/questions/37558795/nice-way-to-get-rid-of-no-unused-expressions-linter-error-with-chai
      "files": ["*.spec.ts"],
      "rules": {
        "no-unused-expressions": "off",
        "@typescript-eslint/no-unused-expressions": ["off"]
      }
    },
    {
      "files": ["*.ts", "*.js", "*.tsx", "*.jsx"],
      "rules": {
        "import/first": "error",
        "import/no-duplicates": "error",
        "import/no-cycle": [2, { "maxDepth": 2 }],
        "import/namespace": [2, { "allowComputed": true }],
        "simple-import-sort/imports": [
          "error",
          {
            "groups": [
              [
                // Packages `react` related packages come first.
                "^react",
                "^@?\\w",
                // Internal packages.
                // Internal packages.
                "^@100mslive/hms-video-store",
                "^@100mslive/react-sdk",
                "^@100mslive/react-icons",
                "^@100mslive/roomkit-react",
                // Side effect imports.
                "^\\u0000",
                // Other relative imports. Put same-folder imports and `.` last.
                "^\\./(?=.*/)(?!/?$)",
                "^\\.(?!/?$)",
                "^\\./?$",
                // Parent imports. Put `..` last.
                "^\\.\\.(?!/?$)",
                "^\\.\\./?$",
                // Style imports.
                "^.+\\.?(css)$"
              ]
            ]
          }
        ]
      }
    }
  ],
  "ignorePatterns": ["**/dist/**", "playwright/**"]
}