Moved from tslint to eslint

.eslintrc.js

@@ -0,0 +1,37 @@
+/* I prefer to use JavaScript file because i can write comment and other can understand it.
+if you wish to use .eslintrc without js extension,then you need to remove all the comments and
+its looks just like { ..eslint config as below} without module.export 
+*/
+
+module.exports={
+  "root": true,
+  "parser": "@typescript-eslint/parser", // we are changing default parser
+  "parserOptions": {
+    "ecmaVersion": 2018,
+    "sourceType": "module",
+    "project": "./tsconfig.json" // path to tsconfig
+  },
+
+/* A plugin provides you with a set of rules that you can 
+individually apply depending on your need.
+Just having a plugin does not enforce any rule.
+You have to choose which rules you need. 
+A plugin may provide you with zero, one, or more configuration files.
+If the plugin provides a configuration file, then you can load
+that in your extends section after adding the plugin in the plugins section.
+*/
+  "plugins": ["@typescript-eslint"], 
+
+/* extends uses a config file which applies set of rules 
+when you add that to the extends options. */
+ "extends": [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/eslint-recommended",
+    "plugin:@typescript-eslint/recommended",
+  ],
+  "rules": {
+  },
+  "overrides": [
+  ]
+}
+

.eslintrc.json

@@ -0,0 +1,67 @@
+{
+  "root": true,
+  "ignorePatterns": [
+    "projects/**/*"
+  ],
+  "overrides": [
+    {
+      "files": [
+        "*.ts"
+      ],
+      "parserOptions": {
+        "project": [
+          "tsconfig.json",
+          "e2e/tsconfig.json"
+        ],
+        "createDefaultProgram": true
+      },
+      "extends": [
+        "plugin:@angular-eslint/ng-cli-compat",
+        "plugin:@angular-eslint/ng-cli-compat--formatting-add-on",
+        "plugin:@angular-eslint/template/process-inline-templates"
+      ],
+      "rules": {
+        "@angular-eslint/component-selector": [
+          "error",
+          {
+            "type": "element",
+            "prefix": "uds",
+            "style": "kebab-case"
+          }
+        ],
+        "@angular-eslint/directive-selector": [
+          "error",
+          {
+            "type": "attribute",
+            "prefix": "uds",
+            "style": "camelCase"
+          }
+        ],
+        "@typescript-eslint/consistent-type-definitions": "error",
+        "@typescript-eslint/dot-notation": "off",
+        "@typescript-eslint/explicit-member-accessibility": [
+          "off",
+          {
+            "accessibility": "explicit"
+          }
+        ],
+        "brace-style": [
+          "error",
+          "1tbs"
+        ],
+        "id-blacklist": "off",
+        "id-match": "off",
+        "no-underscore-dangle": "off"
+      }
+    },
+    {
+      "files": [
+        "*.html"
+      ],
+      "extends": [
+        "plugin:@angular-eslint/template/recommended"
+      ],
+      "rules": {}
+    }
+  ]
+}

angular.json

@@ -1,5 +1,8 @@
 {
   "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "cli": {
+    "analytics": "a21f6880-5986-43de-9ca2-f1e4923f9ac8"
+  },
   "version": 1,
   "newProjectRoot": "projects",
   "projects": {
@@ -100,14 +103,11 @@
           }
         },
         "lint": {
-          "builder": "@angular-devkit/build-angular:tslint",
+          "builder": "@angular-eslint/builder:lint",
           "options": {
-            "tsConfig": [
+            "lintFilePatterns": [
-              "src/tsconfig.app.json",
+              "src/**/*.ts",
-              "src/tsconfig.spec.json"
+              "src/**/*.html"
-            ],
-            "exclude": [
-              "**/node_modules/**"
             ]
           }
         }
@@ -166,4 +166,4 @@
       "skipTests": true
     }
   }
-}
+}

package.json

@@ -34,13 +34,26 @@
   },
   "devDependencies": {
     "@angular-devkit/build-angular": "~0.1100.7",
+    "@angular-eslint/builder": "1.2.0",
+    "@angular-eslint/eslint-plugin": "1.2.0",
+    "@angular-eslint/eslint-plugin-template": "1.2.0",
+    "@angular-eslint/schematics": "1.2.0",
+    "@angular-eslint/template-parser": "1.2.0",
     "@angular/cli": "^11.0.7",
     "@angular/compiler-cli": "^11.0.9",
     "@angular/language-service": "^11.0.9",
     "@types/jasmine": "~3.6.0",
     "@types/jasminewd2": "~2.0.6",
     "@types/node": "^12.11.1",
+    "@typescript-eslint/eslint-plugin": "4.3.0",
+    "@typescript-eslint/parser": "4.3.0",
     "codelyzer": "^6.0.0",
+    "eslint": "^7.6.0",
+    "eslint-config-prettier": "^8.1.0",
+    "eslint-plugin-import": "2.22.1",
+    "eslint-plugin-jsdoc": "30.7.6",
+    "eslint-plugin-prefer-arrow": "1.2.2",
+    "eslint-plugin-prettier": "^3.3.1",
     "jasmine-core": "~3.6.0",
     "jasmine-spec-reporter": "~5.0.0",
     "karma": "~5.1.1",
@@ -48,9 +61,10 @@
     "karma-coverage-istanbul-reporter": "~3.0.2",
     "karma-jasmine": "~4.0.0",
     "karma-jasmine-html-reporter": "^1.5.0",
+    "prettier": "^2.2.1",
+    "prettier-eslint": "^12.0.0",
     "protractor": "~7.0.0",
     "ts-node": "~8.4.1",
-    "tslint": "~6.1.0",
     "typescript": "~4.0.5"
   }
 }

src/app/gui/navbar/navbar.component.ts

@@ -27,6 +27,7 @@ export class NavbarComponent implements OnInit {
   }
 
   ngOnInit(): void {
+    return;
   }
 
   changeLang(to: Lang): boolean {
@@ -34,15 +35,15 @@ export class NavbarComponent implements OnInit {
     this.lang = to;
     document.getElementById('id_language').attributes['value'].value = to.id;
     // alert(document.getElementById('id_language').attributes['value'].value);
-    (<any>document.getElementById('form_language')).submit();
+    (document.getElementById('form_language') as HTMLFormElement).submit();
     return false;
   }
 
-  admin() {
+  admin(): void {
     this.api.gotoAdmin();
   }
 
-  logout() {
+  logout(): void {
     this.api.logout();
   }
 

src/app/helpers/plugin.ts

@@ -1,16 +1,10 @@
 import { UDSApiServiceType } from '../uds-api.service-type';
 
-declare var django: any;
+declare const django: { gettext: (arg0: string) => string; };
 
 /**
  * Plugin manipulation class
  */
-enum BrowserType {
-    chrome = 0,
-    safari,
-    ie,
-    firefox
-}
 
 export class Plugin {
     static transportsWindow = {};
@@ -35,15 +29,15 @@ export class Plugin {
      *
      */
     private doLaunch(url: string) {
-        let elem = document.getElementById('hiddenUdsLauncherIFrame');
+        let elem: HTMLIFrameElement = document.getElementById('hiddenUdsLauncherIFrame') as HTMLIFrameElement;
         if (elem === null) {
             const i = document.createElement('div');
             i.id = 'testID';
             i.innerHTML = '<iframe id="hiddenUdsLauncherIFrame" src="about:blank" style="display:none"></iframe>';
             document.body.appendChild(i);
-            elem = document.getElementById('hiddenUdsLauncherIFrame');
+            elem = document.getElementById('hiddenUdsLauncherIFrame') as HTMLIFrameElement;
         }
-        (<any>elem).contentWindow.location.href = url;
+        elem.contentWindow.location.href = url;
     }
 
     launchURL(url: string): void {

src/app/pages/login/login.component.ts

@@ -47,7 +47,7 @@ export class LoginComponent implements OnInit {
     this.auth.value = auth;
     // Ejecuted when custom auth selected
     const doCustomAuth = (data: string) => {
-      // tslint:disable-next-line:no-eval
+      // eslint-disable-next-line no-eval
       eval(data);
     };
 

src/app/translate.directive.ts

@@ -3,7 +3,7 @@ import { Directive, OnInit, ElementRef } from '@angular/core';
 declare var django: any;
 
 @Directive({
-  // tslint:disable-next-line:directive-selector
+  // eslint-disable-next-line @angular-eslint/directive-selector
   selector: 'uds-translate'
 })
 export class TranslateDirective implements OnInit {

src/app/uds-api.service.ts

@@ -112,7 +112,7 @@ export class UDSApiService implements UDSApiServiceType {
     // Executes a defined JS on launch servic event if defined
     // this is in fact a hook
     if (udsData.customJSForServiceLaunch !== undefined) {
-      // tslint:disable-next-line:no-eval
+      // eslint-disable-next-line no-eval
       eval(udsData.customJSForServiceLaunch);
     }
   }

tslint.json

@@ -1,141 +0,0 @@
-{
-  "rulesDirectory": [
-    "node_modules/codelyzer"
-  ],
-  "rules": {
-    "arrow-return-shorthand": true,
-    "callable-types": true,
-    "class-name": true,
-    "comment-format": [
-      true,
-      "check-space"
-    ],
-    "curly": true,
-    "deprecation": {
-      "severity": "warn"
-    },
-    "eofline": true,
-    "forin": true,
-    "import-blacklist": [
-      true,
-      "rxjs/Rx"
-    ],
-    "import-spacing": true,
-    "indent": [
-      true,
-      "spaces"
-    ],
-    "interface-over-type-literal": true,
-    "label-position": true,
-    "max-line-length": [
-      true,
-      140
-    ],
-    "member-access": false,
-    "member-ordering": [
-      true,
-      {
-        "order": [
-          "static-field",
-          "instance-field",
-          "static-method",
-          "instance-method"
-        ]
-      }
-    ],
-    "no-arg": true,
-    "no-bitwise": true,
-    "no-console": [
-      true,
-      "debug",
-      "info",
-      "time",
-      "timeEnd",
-      "trace"
-    ],
-    "no-construct": true,
-    "no-debugger": true,
-    "no-duplicate-super": true,
-    "no-empty": false,
-    "no-empty-interface": true,
-    "no-eval": true,
-    "no-inferrable-types": [
-      true,
-      "ignore-params"
-    ],
-    "no-misused-new": true,
-    "no-non-null-assertion": true,
-    "no-shadowed-variable": true,
-    "no-string-literal": false,
-    "no-string-throw": true,
-    "no-switch-case-fall-through": true,
-    "no-trailing-whitespace": true,
-    "no-unnecessary-initializer": true,
-    "no-unused-expression": true,
-    "no-var-keyword": true,
-    "object-literal-sort-keys": false,
-    "one-line": [
-      true,
-      "check-open-brace",
-      "check-catch",
-      "check-else",
-      "check-whitespace"
-    ],
-    "prefer-const": true,
-    "quotemark": [
-      true,
-      "single"
-    ],
-    "radix": true,
-    "semicolon": [
-      true,
-      "always"
-    ],
-    "triple-equals": [
-      true,
-      "allow-null-check"
-    ],
-    "typedef-whitespace": [
-      true,
-      {
-        "call-signature": "nospace",
-        "index-signature": "nospace",
-        "parameter": "nospace",
-        "property-declaration": "nospace",
-        "variable-declaration": "nospace"
-      }
-    ],
-    "unified-signatures": true,
-    "variable-name": false,
-    "whitespace": [
-      true,
-      "check-branch",
-      "check-decl",
-      "check-operator",
-      "check-separator",
-      "check-type"
-    ],
-    "directive-selector": [
-      true,
-      "attribute",
-      "uds",
-      "camelCase"
-    ],
-    "component-selector": [
-      true,
-      "element",
-      "uds",
-      "kebab-case"
-    ],
-    "no-output-on-prefix": true,
-    "no-inputs-metadata-property": true,
-    "no-outputs-metadata-property": true,
-    "no-host-metadata-property": true,
-    "no-input-rename": true,
-    "no-output-rename": true,
-    "use-lifecycle-interface": true,
-    "use-pipe-transform-interface": true,
-    "component-class-suffix": true,
-    "directive-class-suffix": true
-  }
-}