Moved from tslint to eslint as tslint was depreciated.

Added prettier and also prettied all the typescript files using prettier

ESLint is using the AirBnB rules which are the most strict to lint the files.

overlord/src/app/role/role-list/role-list-datasource.ts

@@ -1,33 +1,29 @@
-import {DataSource} from '@angular/cdk/collections';
+import { DataSource } from '@angular/cdk/collections';
 import { MatPaginator } from '@angular/material/paginator';
 import { MatSort } from '@angular/material/sort';
-import {map} from 'rxjs/operators';
-import {merge, Observable, of as observableOf} from 'rxjs';
-import {Role} from '../role';
+import { map } from 'rxjs/operators';
+import { merge, Observable, of as observableOf } from 'rxjs';
+import { Role } from '../role';
 
 export class RoleListDatasource extends DataSource<Role> {
-
   constructor(private paginator: MatPaginator, private sort: MatSort, public data: Role[]) {
     super();
   }
 
   connect(): Observable<Role[]> {
-    const dataMutations = [
-      observableOf(this.data),
-      this.paginator.page,
-      this.sort.sortChange
-    ];
+    const dataMutations = [observableOf(this.data), this.paginator.page, this.sort.sortChange];
 
     // Set the paginators length
     this.paginator.length = this.data.length;
 
-    return merge(...dataMutations).pipe(map(() => {
-      return this.getPagedData(this.getSortedData([...this.data]));
-    }));
+    return merge(...dataMutations).pipe(
+      map(() => {
+        return this.getPagedData(this.getSortedData([...this.data]));
+      }),
+    );
   }
 
-  disconnect() {
-  }
+  disconnect() {}
 
   private getPagedData(data: Role[]) {
     const startIndex = this.paginator.pageIndex * this.paginator.pageSize;

overlord/src/app/role/role-list/role-list.component.html

@@ -8,11 +8,12 @@
   </mat-card-title-group>
   <mat-card-content>
     <mat-table #table [dataSource]="dataSource" matSort aria-label="Elements">
-
       <!-- Name Column -->
       <ng-container matColumnDef="name">
         <mat-header-cell *matHeaderCellDef mat-sort-header>Name</mat-header-cell>
-        <mat-cell *matCellDef="let row"><a [routerLink]="['/roles', row.id]">{{row.name}}</a></mat-cell>
+        <mat-cell *matCellDef="let row"
+          ><a [routerLink]="['/roles', row.id]">{{ row.name }}</a></mat-cell
+        >
       </ng-container>
 
       <!-- Permissions Column -->
@@ -20,20 +21,22 @@
         <mat-header-cell *matHeaderCellDef mat-sort-header>Permissions</mat-header-cell>
         <mat-cell *matCellDef="let row">
           <ul>
-            <li *ngFor="let permission of row.permissions">{{permission}}</li>
+            <li *ngFor="let permission of row.permissions">{{ permission }}</li>
           </ul>
         </mat-cell>
       </ng-container>
 
       <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
-      <mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
+      <mat-row *matRowDef="let row; columns: displayedColumns"></mat-row>
     </mat-table>
 
-    <mat-paginator #paginator
-                   [length]="dataSource.data.length"
-                   [pageIndex]="0"
-                   [pageSize]="50"
-                   [pageSizeOptions]="[25, 50, 100, 250]">
+    <mat-paginator
+      #paginator
+      [length]="dataSource.data.length"
+      [pageIndex]="0"
+      [pageSize]="50"
+      [pageSizeOptions]="[25, 50, 100, 250]"
+    >
     </mat-paginator>
   </mat-card-content>
 </mat-card>

overlord/src/app/role/role-list/role-list.component.spec.ts

@@ -1,6 +1,6 @@
-import {ComponentFixture, fakeAsync, TestBed} from '@angular/core/testing';
+import { ComponentFixture, fakeAsync, TestBed } from '@angular/core/testing';
 
-import {RoleListComponent} from './role-list.component';
+import { RoleListComponent } from './role-list.component';
 
 describe('RoleListComponent', () => {
   let component: RoleListComponent;
@@ -8,9 +8,8 @@ describe('RoleListComponent', () => {
 
   beforeEach(fakeAsync(() => {
     TestBed.configureTestingModule({
-      declarations: [RoleListComponent]
-    })
-      .compileComponents();
+      declarations: [RoleListComponent],
+    }).compileComponents();
 
     fixture = TestBed.createComponent(RoleListComponent);
     component = fixture.componentInstance;

overlord/src/app/role/role-list/role-list.component.ts

@@ -1,14 +1,14 @@
-import {Component, OnInit, ViewChild} from '@angular/core';
+import { Component, OnInit, ViewChild } from '@angular/core';
 import { MatPaginator } from '@angular/material/paginator';
 import { MatSort } from '@angular/material/sort';
-import {RoleListDatasource} from './role-list-datasource';
-import {Role} from '../role';
-import {ActivatedRoute} from '@angular/router';
+import { RoleListDatasource } from './role-list-datasource';
+import { Role } from '../role';
+import { ActivatedRoute } from '@angular/router';
 
 @Component({
   selector: 'app-role-list',
   templateUrl: './role-list.component.html',
-  styleUrls: ['./role-list.component.css']
+  styleUrls: ['./role-list.component.css'],
 })
 export class RoleListComponent implements OnInit {
   @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
@@ -18,14 +18,12 @@ export class RoleListComponent implements OnInit {
   /** Columns displayed in the table. Columns IDs can be added, removed, or reordered. */
   displayedColumns = ['name', 'permissions'];
 
-  constructor(private route: ActivatedRoute) {
-  }
+  constructor(private route: ActivatedRoute) {}
 
   ngOnInit() {
-    this.route.data
-      .subscribe((data: { list: Role[] }) => {
-        this.list = data.list;
-      });
+    this.route.data.subscribe((data: { list: Role[] }) => {
+      this.list = data.list;
+    });
     this.dataSource = new RoleListDatasource(this.paginator, this.sort, this.list);
   }
 }