Add angular eslint rules

AngularRules.md

@@ -0,0 +1,15 @@
+# Angular Rules
+
+## Plugins
+
+* Angular defualt eslint plugin: <https://github.com/angular-eslint/angular-eslint#readme>
+
+Additional rules are turned on in order to align with Angular coding style guide. <https://angular.io/guide/styleguide>
+
+* rxjs: <https://github.com/cartant/eslint-plugin-rxjs>
+
+Applied recommended rules and also enforced finnish notation and banned exposing subjects.
+
+* jasmine: <https://github.com/tlvince/eslint-plugin-jasmine>
+
+Applied recommended rules.

README.md

@@ -1,4 +1,5 @@
 # eslint-config-agile-digital
+
 Agile Digital's standard ESLint config
 
 [![Build Status](https://github.com/agiledigital-labs/eslint-config-agile-digital/actions/workflows/node.js.yml/badge.svg)](https://github.com/agiledigital-labs/eslint-config-agile-digital/actions/workflows/node.js.yml)
@@ -24,6 +25,8 @@ yarn add --dev eslint-config-agile-digital \
   eslint-plugin-react \
   eslint-plugin-react-hooks \
   eslint-plugin-jsx-a11y \
+  eslint-plugin-rxjs \
+  eslint-plugin-jasmine
   typescript
 ```
 
@@ -43,7 +46,7 @@ module.exports = {
   },
   extends: [
 +  "agile-digital",
-+  "agile-digital/react", // In addition to the above if this is a React project 
++  "agile-digital/react", // In addition to the above if this is a React project
   ...
   ],
   plugins: [
@@ -66,3 +69,37 @@ module.exports = {
 };
 
 ```
+
+## Usage in Angular
+
+Angular customised plugin. It is not compatible with `agile-digital` because `agile-digital` has functional plugins which do not fit Angular.
+
+1. Run `ng add @angular-eslint/schematics`
+2. Update `.eslintrc.json`
+
+```diff
+  "overrides": [
+    {
+      "files": ["*.ts"],
++     parser: "@typescript-eslint/parser",
++     parserOptions: {
++       project: "./tsconfig.json",
++       ecmaVersion: 2018,
++       sourceType: "module",
++     },
+      "extends": [
++       "agile-digital/angular"
+      ],
+     "plugins": [
++      "prettier", "rxjs", "sonarjs", "jasmine", "import"
+      ]
+    },
+    ...
+    {
+      "files": ["*.html"],
+      "extends": [
++       "agile-digital/angular-template"
+      ]
+    }
+  ]
+```

angular-template.js

@@ -0,0 +1,20 @@
+"use strict";
+const config = {
+    globals: {},
+    env: {
+        es6: true,
+        browser: true,
+    },
+    overrides: [],
+    extends: ["plugin:@angular-eslint/template/recommended"],
+    rules: {
+        "@angular-eslint/template/eqeqeq": "error",
+        "@angular-eslint/template/conditional-complexity": [
+            "error",
+            { maxComplexity: 2 },
+        ],
+        "@angular-eslint/template/no-any": "error",
+        "@angular-eslint/template/use-track-by-function": "error",
+    },
+};
+module.exports = config;

angular-template.ts

@@ -0,0 +1,22 @@
+import type { TSESLint } from "@typescript-eslint/experimental-utils";
+
+const config: TSESLint.Linter.Config = {
+  globals: {},
+  env: {
+    es6: true,
+    browser: true,
+  },
+  overrides: [],
+  extends: ["plugin:@angular-eslint/template/recommended"],
+  rules: {
+    "@angular-eslint/template/eqeqeq": "error",
+    "@angular-eslint/template/conditional-complexity": [
+      "error",
+      { maxComplexity: 2 },
+    ],
+    "@angular-eslint/template/no-any": "error",
+    "@angular-eslint/template/use-track-by-function": "error",
+  },
+};
+
+export = config;

angular.js

@@ -0,0 +1,88 @@
+"use strict";
+const config = {
+    globals: {},
+    env: {
+        es6: true,
+        browser: true,
+    },
+    overrides: [],
+    plugins: ["prettier", "rxjs", "sonarjs", "jasmine", "import"],
+    parser: "@typescript-eslint/parser",
+    parserOptions: {
+        project: "./tsconfig.json",
+        ecmaVersion: 2018,
+        sourceType: "module",
+    },
+    extends: [
+        "eslint:recommended",
+        "plugin:@typescript-eslint/recommended",
+        "plugin:@typescript-eslint/strict",
+        "plugin:@angular-eslint/recommended",
+        "plugin:@angular-eslint/recommended--extra",
+        "plugin:@angular-eslint/template/process-inline-templates",
+        "plugin:prettier/recommended",
+        "plugin:rxjs/recommended",
+        "plugin:sonarjs/recommended",
+        "plugin:jasmine/recommended",
+        "plugin:import/recommended",
+    ],
+    rules: {
+        eqeqeq: "error",
+        "@typescript-eslint/no-explicit-any": "error",
+        // rules from angular-eslint plugin
+        "@angular-eslint/directive-selector": [
+            "error",
+            {
+                type: "attribute",
+                prefix: "app",
+                style: "camelCase",
+            },
+        ],
+        "@angular-eslint/component-selector": [
+            "error",
+            {
+                type: "element",
+                prefix: "app",
+                style: "kebab-case",
+            },
+        ],
+        // Style 02-03
+        "@angular-eslint/component-class-suffix": "error",
+        "@angular-eslint/contextual-decorator": "error",
+        "@angular-eslint/contextual-lifecycle": "error",
+        "@angular-eslint/directive-class-suffix": "error",
+        "@angular-eslint/no-empty-lifecycle-method": "error",
+        "@angular-eslint/no-input-rename": "error",
+        // Style 05-12
+        "@angular-eslint/no-inputs-metadata-property": "error",
+        // TODO: allow for tests
+        "@angular-eslint/no-lifecycle-call": "error",
+        "@angular-eslint/no-output-native": "error",
+        // Style 05-16
+        "@angular-eslint/no-output-on-prefix": "error",
+        "@angular-eslint/no-output-rename": "error",
+        // Style 05-12
+        "@angular-eslint/no-outputs-metadata-property": "error",
+        "@angular-eslint/sort-ngmodule-metadata-arrays": "error",
+        "@angular-eslint/use-component-selector": "error",
+        "@angular-eslint/use-lifecycle-interface": "error",
+        "@angular-eslint/use-pipe-transform-interface": "error",
+        "rxjs/finnish": "error",
+        "rxjs/no-exposed-subjects": "error",
+        "import/no-cycle": "error",
+        "import/no-useless-path-segments": "warn",
+        "import/order": "error",
+    },
+    settings: {
+        "import/parsers": {
+            "@typescript-eslint/parser": [".ts"],
+        },
+        "import/resolver": {
+            typescript: {
+                alwaysTryTypes: true,
+                project: ["./tsconfig.app.json", "./tsconfig.spec.json"],
+            },
+        },
+    },
+};
+module.exports = config;

angular.ts

@@ -0,0 +1,90 @@
+import type { TSESLint } from "@typescript-eslint/experimental-utils";
+
+const config: TSESLint.Linter.Config = {
+  globals: {},
+  env: {
+    es6: true,
+    browser: true,
+  },
+  overrides: [],
+  plugins: ["prettier", "rxjs", "sonarjs", "jasmine", "import"],
+  parser: "@typescript-eslint/parser",
+  parserOptions: {
+    project: "./tsconfig.json",
+    ecmaVersion: 2018,
+    sourceType: "module",
+  },
+  extends: [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:@typescript-eslint/strict",
+    "plugin:@angular-eslint/recommended",
+    "plugin:@angular-eslint/recommended--extra",
+    "plugin:@angular-eslint/template/process-inline-templates",
+    "plugin:prettier/recommended",
+    "plugin:rxjs/recommended",
+    "plugin:sonarjs/recommended",
+    "plugin:jasmine/recommended",
+    "plugin:import/recommended",
+  ],
+  rules: {
+    eqeqeq: "error",
+    "@typescript-eslint/no-explicit-any": "error",
+    // rules from angular-eslint plugin
+    "@angular-eslint/directive-selector": [
+      "error",
+      {
+        type: "attribute",
+        prefix: "app",
+        style: "camelCase",
+      },
+    ],
+    "@angular-eslint/component-selector": [
+      "error",
+      {
+        type: "element",
+        prefix: "app",
+        style: "kebab-case",
+      },
+    ],
+    // Style 02-03
+    "@angular-eslint/component-class-suffix": "error",
+    "@angular-eslint/contextual-decorator": "error",
+    "@angular-eslint/contextual-lifecycle": "error",
+    "@angular-eslint/directive-class-suffix": "error",
+    "@angular-eslint/no-empty-lifecycle-method": "error",
+    "@angular-eslint/no-input-rename": "error",
+    // Style 05-12
+    "@angular-eslint/no-inputs-metadata-property": "error",
+    // TODO: allow for tests
+    "@angular-eslint/no-lifecycle-call": "error",
+    "@angular-eslint/no-output-native": "error",
+    // Style 05-16
+    "@angular-eslint/no-output-on-prefix": "error",
+    "@angular-eslint/no-output-rename": "error",
+    // Style 05-12
+    "@angular-eslint/no-outputs-metadata-property": "error",
+    "@angular-eslint/sort-ngmodule-metadata-arrays": "error",
+    "@angular-eslint/use-component-selector": "error",
+    "@angular-eslint/use-lifecycle-interface": "error",
+    "@angular-eslint/use-pipe-transform-interface": "error",
+    "rxjs/finnish": "error",
+    "rxjs/no-exposed-subjects": "error",
+    "import/no-cycle": "error",
+    "import/no-useless-path-segments": "warn",
+    "import/order": "error",
+  },
+  settings: {
+    "import/parsers": {
+      "@typescript-eslint/parser": [".ts"],
+    },
+    "import/resolver": {
+      typescript: {
+        alwaysTryTypes: true,
+        project: ["./tsconfig.app.json", "./tsconfig.spec.json"],
+      },
+    },
+  },
+};
+
+export = config;

package.json

@@ -6,18 +6,21 @@
   "author": "Daniel Nixon <dan.nixon@gmail.com>",
   "license": "MIT",
   "peerDependencies": {
+    "@angular-eslint/schematics": ">= 12",
     "@typescript-eslint/eslint-plugin": "^5.36.1",
     "@typescript-eslint/parser": "^5.36.1",
     "eslint": "^8.23.0",
     "eslint-config-prettier": "^8.5.0",
     "eslint-config-typed-fp": "^3.3.0",
     "eslint-plugin-functional": "^4.2.2",
     "eslint-plugin-import": "^2.26.0",
+    "eslint-plugin-jasmine": "^4.1.3",
     "eslint-plugin-jest": "^27.0.1",
     "eslint-plugin-jsx-a11y": "^6.6.1",
     "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-react": "^7.31.4",
     "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-rxjs": "^5.0.2",
     "eslint-plugin-sonarjs": "^0.17.0",
     "eslint-plugin-spellcheck": "^0.0.20",
     "eslint-plugin-total-functions": "^6.0.0",
@@ -32,11 +35,13 @@
     "eslint-config-typed-fp": "^3.3.0",
     "eslint-plugin-functional": "^4.2.2",
     "eslint-plugin-import": "^2.26.0",
+    "eslint-plugin-jasmine": "^4.1.3",
     "eslint-plugin-jest": "^27.0.1",
     "eslint-plugin-jsx-a11y": "^6.6.1",
     "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-react": "^7.31.4",
     "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-rxjs": "^5.0.2",
     "eslint-plugin-sonarjs": "^0.17.0",
     "eslint-plugin-spellcheck": "^0.0.20",
     "eslint-plugin-total-functions": "^6.0.0",