refactor: add recommended linting rules again (#1323)

.eslintrc-angular.json

@@ -13,6 +13,8 @@
         "plugin:@angular-eslint/template/process-inline-templates"
       ],
       "rules": {
+        // rules that need to be removed later on
+        "@angular-eslint/template/no-negated-async": "off",
         "@typescript-eslint/adjacent-overload-signatures": "warn",
 
         "@angular-eslint/directive-selector": [

.eslintrc.json

@@ -7,7 +7,6 @@
     "@nrwl/nx",
     "ban",
     "unused-imports",
-    "simple-import-sort",
     "import",
     "prettier"
   ],
@@ -61,70 +60,42 @@
         "eslint:recommended"
       ],
       "rules": {
-        // ESLint rules
-        "array-bracket-spacing": "off",
-        "array-callback-return": "off",
+        // rules that need to be off for other configuration to work
         "arrow-body-style": "off",
         "arrow-parens": "off",
-        "curly": "off",
+        "implicit-arrow-linebreak": "off",
+        "operator-linebreak": "off",
+        "max-len": "off",
+        "@typescript-eslint/comma-dangle": "off",
+        "@typescript-eslint/indent": "off",
+        "@typescript-eslint/lines-between-class-members": "off",
+        // rules to work on later on
+        "class-methods-use-this": "off",
         "default-case": "off",
         "eqeqeq": "off",
-        "eol-last": "off",
         "consistent-return": "off",
-        "function-paren-newline": "off",
         "grouped-accessor-pairs": "off",
         "import/prefer-default-export": "off",
-        "import/first": "off",
-        "import/newline-after-import": "off",
         "import/no-cycle": "off",
         "import/order": ["error", { "alphabetize": { "order": "asc" } }],
-        "implicit-arrow-linebreak": "off",
-        "key-spacing": "off",
-        "linebreak-style": "off",
         "max-classes-per-file": "off",
-        "max-len": "off",
-        "new-parens": "off",
-        "no-confusing-arrow": "off",
-        "no-case-declarations": "warn",
+        "no-case-declarations": "off",
         "no-console": "off",
         "no-else-return": "off",
-        "no-floating-decimal": "off",
-        "no-lonely-if": "off",
-        "no-multiple-empty-lines": "off",
-        "no-multi-spaces": "off",
         "no-nested-ternary": "off",
-        "no-new": "off",
         "no-param-reassign": "off",
         "no-plusplus": "off",
         "no-prototype-builtins": "off",
         "no-redeclare": "off",
-        "no-restricted-globals": "off",
-        "no-restricted-properties": "off",
         "no-restricted-syntax": "off",
-        "no-return-assign": "off",
         "no-undef": "off",
-        "no-undef-init": "off",
         "no-underscore-dangle": "off",
-        "no-unneeded-ternary": "off",
         "no-unsafe-optional-chaining": "off",
         "no-unused-vars": "off",
-        "no-useless-rename": "off",
-        "no-useless-escape": "warn",
-        "nonblock-statement-body-position": "off",
-        "object-curly-newline": "off",
-        "object-shorthand": "off",
-        "operator-assignment": "off",
-        "operator-linebreak": "off",
-        "padded-blocks": "off",
-        "prefer-arrow-callback": "off",
-        "prefer-exponentiation-operator": "off",
+        "no-useless-escape": "off",
         "prefer-regex-literals": "off",
-        "prefer-template": "off",
         "prefer-destructuring": "off",
         "radix": "off",
-        "simple-import-sort/exports": "off",
-        "space-unary-ops": "off",
-        // eslint-plugin-unused-imports rules
         "unused-imports/no-unused-vars": [
           "off",
           {
@@ -134,22 +105,10 @@
             "argsIgnorePattern": "^_"
           }
         ],
-        // TypeScript Eslint rules
-        "class-methods-use-this": "off",
-        "@typescript-eslint/comma-dangle": "off",
-        "@typescript-eslint/comma-spacing": "off",
         "@typescript-eslint/dot-notation": "off",
-        "@typescript-eslint/brace-style": "off",
-        "@typescript-eslint/lines-between-class-members": "off",
         "@typescript-eslint/naming-convention": "off",
-        "@typescript-eslint/no-shadow": "off",
         "@typescript-eslint/no-explicit-any": "off",
-        "@typescript-eslint/no-namespace": "off",
-        "@typescript-eslint/no-redeclare": "off",
-        "@typescript-eslint/no-throw-literal": "off",
-        "@typescript-eslint/no-unused-vars": "off",
-        "@typescript-eslint/no-unused-expressions": "off",
-        "@typescript-eslint/no-use-before-define": "off"
+        "@typescript-eslint/no-unused-vars": "off"
       },
       "parserOptions": {
         "project": "./tsconfig.eslint.json"

apps/dateAdapter/src/app/app.component.ts

@@ -25,6 +25,7 @@ export class AppComponent {
   form3: UntypedFormGroup;
   form4: UntypedFormGroup;
 
+  // eslint-disable-next-line @typescript-eslint/no-use-before-define
   headerComponent = HeaderComponent;
 
   // October 13 1729 (Julian calendar)

apps/dsp-app/src/app/main/action/sort-button/sort-button.component.ts

@@ -66,7 +66,7 @@ export class SortButtonComponent implements OnInit {
    * @param key a string to sort by
    */
   sortBy(key: string) {
-    this.activeKey = key ? key : this.sortProps[0].key;
+    this.activeKey = key || this.sortProps[0].key;
     this.sortKeyChange.emit(this.activeKey);
   }
 }

apps/dsp-app/src/app/main/directive/admin-image/admin-image.directive.ts

@@ -1,3 +1,4 @@
+import { Location } from '@angular/common';
 import { Directive, OnChanges, Input, Renderer2, ElementRef } from '@angular/core';
 import { Md5 } from 'ts-md5';
 import { AdminImageConfig } from './admin-image.config';
@@ -49,7 +50,9 @@ export class AdminImageDirective implements OnChanges {
         if (this.image === null || this.image === undefined) {
           this.source = AdminImageConfig.defaultUser;
         } else {
-          this.source = location.protocol + '//www.gravatar.com/avatar/' + Md5.hashStr(this.image) + '?d=mp&s=256';
+          // TODO
+          // eslint-disable-next-line no-restricted-globals
+          this.source = `${location.protocol}//www.gravatar.com/avatar/${Md5.hashStr(this.image)}?d=mp&s=256`;
         }
 
         break;
@@ -68,6 +71,6 @@ export class AdminImageDirective implements OnChanges {
     }
 
     this._renderer.setAttribute(this._ele.nativeElement, 'src', this.source);
-    this._renderer.setAttribute(this._ele.nativeElement, 'onError', "this.src='" + this.onError + "'");
+    this._renderer.setAttribute(this._ele.nativeElement, 'onError', `this.src='${this.onError}'`);
   }
 }

apps/dsp-app/src/app/main/directive/base-value.directive.ts

@@ -116,6 +116,7 @@ export abstract class BaseValueDirective implements OnInit, OnDestroy {
    * @param initComment Initially given comment.
    * @param commentFormControl FormControl of the current comment.
    */
+
   standardValidatorFunc: (val: any, comment: string, commentCtrl: FormControl) => ValidatorFn =
     (initValue: any, initComment: string, commentFormControl: FormControl): ValidatorFn =>
     (control: AbstractControl): { [key: string]: any } | null => {
@@ -162,13 +163,10 @@ export abstract class BaseValueDirective implements OnInit, OnDestroy {
             this.standardValidatorFunc(initialValue, initialComment, this.commentFormControl),
           ].concat(this.customValidators)
         );
+      } else if (this.valueRequiredValidator) {
+        this.valueFormControl.setValidators([Validators.required].concat(this.customValidators));
       } else {
-        // console.log('reset read/create validators');
-        if (this.valueRequiredValidator) {
-          this.valueFormControl.setValidators([Validators.required].concat(this.customValidators));
-        } else {
-          this.valueFormControl.setValidators(this.customValidators);
-        }
+        this.valueFormControl.setValidators(this.customValidators);
       }
 
       this.valueFormControl.updateValueAndValidity();

apps/dsp-app/src/app/main/directive/external-links.directive.ts

@@ -17,7 +17,8 @@ export class ExternalLinksDirective implements OnChanges {
   // to check if we are running on the server, give a token value
   constructor(
     @Inject(PLATFORM_ID) private platformId: string,
-    private _sanitizer: DomSanitizer
+    private _sanitizer: DomSanitizer,
+    private location: Location
   ) {}
 
   ngOnChanges() {
@@ -37,7 +38,7 @@ export class ExternalLinksDirective implements OnChanges {
   private _isLinkExternal() {
     return (
       // get a token value from platformId to run the code only on the client and prevents errors
-      isPlatformBrowser(this.platformId) && !this.href.includes(location.hostname)
+      isPlatformBrowser(this.platformId) && !this.href.includes(this.location.hostname)
     );
   }
 }

apps/dsp-app/src/app/main/header/header.component.ts

@@ -82,7 +82,7 @@ export class HeaderComponent implements OnInit, OnDestroy {
       )}`;
 
       if (this.searchParams.filter && this.searchParams.filter.limitToProject) {
-        doSearchRoute += '/' + encodeURIComponent(this.searchParams.filter.limitToProject);
+        doSearchRoute += `/${encodeURIComponent(this.searchParams.filter.limitToProject)}`;
       }
 
       this._router.navigate([doSearchRoute]);
@@ -96,7 +96,7 @@ export class HeaderComponent implements OnInit, OnDestroy {
       position: {
         top: '112px',
       },
-      data: { mode: mode, title: name, id: iri },
+      data: { mode, title: name, id: iri },
     };
 
     this._dialog.open(DialogComponent, dialogConfig);

apps/dsp-app/src/app/main/help/help.component.ts

@@ -102,9 +102,9 @@ export class HelpComponent implements OnInit {
   ngOnInit() {
     this.dsp = this._appConfigService.dspConfig;
 
-    this.support[0].url += this.dsp.environment + ': ' + this.dsp.release;
+    this.support[0].url += `${this.dsp.environment}: ${this.dsp.release}`;
 
-    this.releaseNotesUrl = 'https://github.com/dasch-swiss/dsp-das/releases/tag/v' + this.appVersion;
+    this.releaseNotesUrl = `https://github.com/dasch-swiss/dsp-das/releases/tag/v${this.appVersion}`;
 
     this._dspApiConnection.system.versionEndpoint.getVersion().subscribe(
       (response: ApiResponseData<VersionResponse>) => {

apps/dsp-app/src/app/main/pipes/formatting/knoradate.pipe.ts

@@ -23,7 +23,7 @@ export class KnoraDatePipe implements PipeTransform {
   // ensures that day and month are always two digits
   leftPadding(value: number): string {
     if (value !== undefined) {
-      return ('0' + value).slice(-2);
+      return `0${value}`.slice(-2);
     } else {
       return null;
     }
@@ -34,21 +34,18 @@ export class KnoraDatePipe implements PipeTransform {
     switch (options) {
       case 'era':
         // displays date with era; era only in case of BCE
-        return value + (date.era === 'noEra' ? '' : date.era === 'BCE' || date.era === 'AD' ? ' ' + date.era : '');
+        return value + (date.era === 'noEra' ? '' : date.era === 'BCE' || date.era === 'AD' ? ` ${date.era}` : '');
       case 'calendar':
         // displays date without era but with calendar type
-        return value + ' ' + this._titleCase(date.calendar);
+        return `${value} ${this._titleCase(date.calendar)}`;
       case 'calendarOnly':
         // displays only the selected calendar type without any data
         return this._titleCase(date.calendar);
       case 'all':
         // displays date with era (only as BCE) and selected calendar type
-        return (
-          value +
-          (date.era === 'noEra' ? '' : date.era === 'BCE' ? ' ' + date.era : '') +
-          ' ' +
-          this._titleCase(date.calendar)
-        );
+        return `${value + (date.era === 'noEra' ? '' : date.era === 'BCE' ? ` ${date.era}` : '')} ${this._titleCase(
+          date.calendar
+        )}`;
     }
   }
 

apps/dsp-app/src/app/main/pipes/isFalsy.piipe.ts

@@ -6,6 +6,6 @@ import { Pipe, PipeTransform } from '@angular/core';
 })
 export class IsFalsyPipe implements PipeTransform {
   transform(value: any): any {
-    return value ? false : true;
+    return !value;
   }
 }

apps/dsp-app/src/app/main/pipes/string-transformation/linkify.pipe.ts

@@ -13,7 +13,7 @@ export class LinkifyPipe implements PipeTransform {
       const match = value.match(/(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/gi);
       let final = value;
       if (match) {
-        match.map(url => {
+        match.forEach(url => {
           final = final.replace(url, `<a href="${url}" target="_blank">${url}</a>`);
         });
       }

apps/dsp-app/src/app/main/pipes/string-transformation/stringify-string-literal.pipe.ts

@@ -32,7 +32,7 @@ export class StringifyStringLiteralPipe implements PipeTransform {
       let i = 0;
       for (const sl of value) {
         const delimiter = i > 0 ? ' / ' : '';
-        stringified += delimiter + sl.value + ' (' + sl.language + ')';
+        stringified += `${delimiter + sl.value} (${sl.language})`;
 
         i++;
       }

apps/dsp-app/src/app/main/pipes/time.pipe.ts

@@ -15,15 +15,11 @@ export class TimePipe implements PipeTransform {
     const seconds = dateObj.getSeconds();
 
     if (hours === 0) {
-      return minutes.toString().padStart(2, '0') + ':' + seconds.toString().padStart(2, '0');
+      return `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
     } else {
-      return (
-        hours.toString().padStart(2, '0') +
-        ':' +
-        minutes.toString().padStart(2, '0') +
-        ':' +
-        seconds.toString().padStart(2, '0')
-      );
+      return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds
+        .toString()
+        .padStart(2, '0')}`;
     }
   }
 }

apps/dsp-app/src/app/project/collaboration/add-user/add-user.component.ts

@@ -152,19 +152,19 @@ export class AddUserComponent implements OnInit {
 
             // if the user is already member of the project
             // add the email to the list of existing
-            this.existingEmailInProject.push(new RegExp('(?:^|W)' + m.email.toLowerCase() + '(?:$|W)'));
+            this.existingEmailInProject.push(new RegExp(`(?:^|W)${m.email.toLowerCase()}(?:$|W)`));
             // add username to the list of existing
-            this.existingUsernameInProject.push(new RegExp('(?:^|W)' + m.username.toLowerCase() + '(?:$|W)'));
+            this.existingUsernameInProject.push(new RegExp(`(?:^|W)${m.username.toLowerCase()}(?:$|W)`));
           }
         }
 
         let i = 0;
         for (const u of response.body.users) {
           // if the user is already member of the project
           // add the email to the list of existing
-          this.existingEmails.push(new RegExp('(?:^|W)' + u.email.toLowerCase() + '(?:$|W)'));
+          this.existingEmails.push(new RegExp(`(?:^|W)${u.email.toLowerCase()}(?:$|W)`));
           // add username to the list of existing
-          this.existingUsernames.push(new RegExp('(?:^|W)' + u.username.toLowerCase() + '(?:$|W)'));
+          this.existingUsernames.push(new RegExp(`(?:^|W)${u.username.toLowerCase()}(?:$|W)`));
 
           let existsInProject = '';
 
@@ -175,12 +175,12 @@ export class AddUserComponent implements OnInit {
           this.users[i] = {
             iri: u.id,
             name: u.username,
-            label: existsInProject + u.username + ' | ' + u.email + ' | ' + u.givenName + ' ' + u.familyName,
+            label: `${existsInProject + u.username} | ${u.email} | ${u.givenName} ${u.familyName}`,
           };
           i++;
         }
 
-        this.users.sort(function (u1: AutocompleteItem, u2: AutocompleteItem) {
+        this.users.sort((u1: AutocompleteItem, u2: AutocompleteItem) => {
           if (u1.label < u2.label) {
             return -1;
           } else if (u1.label > u2.label) {
@@ -245,14 +245,14 @@ export class AddUserComponent implements OnInit {
     this.selectedUser = undefined;
 
     // check if the form is valid
-    Object.keys(this.selectUserErrors).map(field => {
+    Object.keys(this.selectUserErrors).forEach(field => {
       this.selectUserErrors[field] = '';
       const control = this.selectUserForm.get(field);
       if (control.value.length >= 2) {
         if (control && control.dirty && !control.valid) {
           const messages = this.validationMessages[field];
-          Object.keys(control.errors).map(key => {
-            this.selectUserErrors[field] += messages[key] + ' ';
+          Object.keys(control.errors).forEach(key => {
+            this.selectUserErrors[field] += `${messages[key]} `;
           });
         }
       }
@@ -321,7 +321,7 @@ export class AddUserComponent implements OnInit {
       data: {
         project: this.projectUuid,
         name: this.selectUserForm.controls['username'].value,
-        mode: mode,
+        mode,
       },
     };
 

apps/dsp-app/src/app/project/list/list-info-form/list-info-form.component.ts

@@ -165,7 +165,7 @@ export class ListInfoFormComponent implements OnInit {
   resetLists(ev: Event, list?: ListNodeInfo) {
     ev.preventDefault();
 
-    list = list ? list : new ListNodeInfo();
+    list = list || new ListNodeInfo();
 
     this.buildLists(list);
   }