Light up an additional typescript template check (#3518)

components/automate-ui/src/app/modules/infra-proxy/chef-server-details/chef-server-details.component.ts

@@ -1,5 +1,6 @@
 import { Component, OnInit, OnDestroy, EventEmitter } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { MatOptionSelectionChange } from '@angular/material/core/option';
 import { Router } from '@angular/router';
 import { Store } from '@ngrx/store';
 import { Subject, combineLatest } from 'rxjs';
@@ -10,7 +11,6 @@ import { NgrxStateAtom } from 'app/ngrx.reducers';
 import { routeParams, routeURL } from 'app/route.selectors';
 import { Regex } from 'app/helpers/auth/regex';
 import { LayoutFacadeService, Sidebar } from 'app/entities/layout/layout.facade';
-
 import { pending, EntityStatus, allLoaded } from 'app/entities/entities';
 import {
   getStatus, serverFromRoute, updateStatus
@@ -25,7 +25,6 @@ import {
   getAllStatus as getAllOrgsForServerStatus,
   deleteStatus as deleteOrgStatus
 } from 'app/entities/orgs/org.selectors';
-import { ChefKeyboardEvent } from 'app/types/material-types';
 
 export type ChefServerTabName = 'orgs' | 'details';
 
@@ -188,7 +187,7 @@ export class ChefServerDetailsComponent implements OnInit, OnDestroy {
     this.conflictErrorEvent.emit(false);
   }
 
-  public startOrgDelete($event: ChefKeyboardEvent, org: Org): void {
+  public startOrgDelete($event: MatOptionSelectionChange, org: Org): void {
     if ($event.isUserInput) {
       this.orgToDelete = org;
       this.deleteModalVisible = true;

components/automate-ui/src/app/modules/policy/details/policy-details.component.ts

@@ -1,5 +1,6 @@
 import { Component, OnInit, OnDestroy } from '@angular/core';
 import { Router } from '@angular/router';
+import { MatOptionSelectionChange } from '@angular/material/core/option';
 import { Store } from '@ngrx/store';
 import { filter, map, takeUntil, distinctUntilChanged } from 'rxjs/operators';
 import { isNil } from 'lodash/fp';
@@ -15,7 +16,6 @@ import {
   Policy, Member, Type, stringToMember
 } from 'app/entities/policies/policy.model';
 import { RemovePolicyMembers } from 'app/entities/policies/policy.actions';
-import { ChefKeyboardEvent } from 'app/types/material-types';
 
 export type PolicyTabName = 'definition' | 'members';
 
@@ -114,7 +114,7 @@ export class PolicyDetailsComponent implements OnInit, OnDestroy {
     return JSON.stringify(policy, null, '  ');
   }
 
-  removeMember($event: ChefKeyboardEvent, member: Member): void {
+  removeMember($event: MatOptionSelectionChange, member: Member): void {
     if ($event.isUserInput) {
       this.store.dispatch(new RemovePolicyMembers({
         id: this.policy.id,

components/automate-ui/src/app/modules/policy/list/policy-list.component.ts

@@ -1,4 +1,5 @@
 import { Component, OnInit, OnDestroy } from '@angular/core';
+import { MatOptionSelectionChange } from '@angular/material/core/option';
 import { Store, select } from '@ngrx/store';
 import { Observable, Subject } from 'rxjs';
 import { map, takeUntil } from 'rxjs/operators';
@@ -10,7 +11,6 @@ import { DeletePolicy, GetPolicies } from 'app/entities/policies/policy.actions'
 import { allPolicies, getAllStatus } from 'app/entities/policies/policy.selectors';
 import { Policy } from 'app/entities/policies/policy.model';
 import { LayoutFacadeService, Sidebar } from 'app/entities/layout/layout.facade';
-import { ChefKeyboardEvent } from 'app/types/material-types';
 
 @Component({
   selector: 'app-policy-list',
@@ -58,7 +58,7 @@ export class PolicyListComponent implements OnInit, OnDestroy {
     this.deleteModalVisible = false;
   }
 
-  public startPolicyDelete($event: ChefKeyboardEvent, policy: Policy): void {
+  public startPolicyDelete($event: MatOptionSelectionChange, policy: Policy): void {
     if ($event.isUserInput) {
       this.deleteModalVisible = true;
       this.policyToDelete = policy;

components/automate-ui/src/app/modules/roles/list/roles-list.component.ts

@@ -1,5 +1,6 @@
 import { Component, OnInit, OnDestroy } from '@angular/core';
 import { Store } from '@ngrx/store';
+import { MatOptionSelectionChange } from '@angular/material/core/option';
 import { Observable, Subject } from 'rxjs';
 import { map, takeUntil } from 'rxjs/operators';
 
@@ -10,7 +11,6 @@ import { loading } from 'app/entities/entities';
 import { GetRoles, DeleteRole } from 'app/entities/roles/role.actions';
 import { allRoles, getAllStatus } from 'app/entities/roles/role.selectors';
 import { Role } from 'app/entities/roles/role.model';
-import { ChefKeyboardEvent } from 'app/types/material-types';
 
 @Component({
   selector: 'app-roles-list',
@@ -48,7 +48,7 @@ export class RolesListComponent implements OnInit, OnDestroy {
     this.isDestroyed.complete();
   }
 
-  public startRoleDelete($event: ChefKeyboardEvent, role: Role): void {
+  public startRoleDelete($event: MatOptionSelectionChange, role: Role): void {
     if ($event.isUserInput) {
       this.roleToDelete = role;
       this.deleteModalVisible = true;

components/automate-ui/src/app/modules/team/team-management/team-management.component.spec.ts

@@ -1,4 +1,5 @@
 import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { MatOptionSelectionChange } from '@angular/material/core/option';
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { RouterTestingModule } from '@angular/router/testing';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
@@ -14,7 +15,6 @@ import {
 } from 'app/entities/teams/team.actions';
 import { TeamManagementComponent } from './team-management.component';
 import { FeatureFlagsService } from 'app/services/feature-flags/feature-flags.service';
-import { ChefKeyboardEvent } from 'app/types/material-types';
 
 describe('TeamManagementComponent', () => {
   let component: TeamManagementComponent;
@@ -114,8 +114,7 @@ describe('TeamManagementComponent', () => {
 
   describe('delete team', () => {
     let store: Store<NgrxStateAtom>;
-    const mockChefKeyEvent = new KeyboardEvent('keypress') as ChefKeyboardEvent;
-    mockChefKeyEvent.isUserInput = true;
+    const mockEvent = { isUserInput: true } as MatOptionSelectionChange;
 
     const deleteTeam: Team = {
       guid: 'uuid-1',
@@ -134,7 +133,7 @@ describe('TeamManagementComponent', () => {
     });
 
     it('opens the delete modal', () => {
-      component.startTeamDelete(mockChefKeyEvent, deleteTeam);
+      component.startTeamDelete(mockEvent, deleteTeam);
       fixture.detectChanges();
 
       expect(component.deleteModalVisible).toBe(true);

components/automate-ui/src/app/modules/team/team-management/team-management.component.ts

@@ -1,5 +1,6 @@
 import { Component, OnInit, OnDestroy, EventEmitter } from '@angular/core';
 import { Validators, FormGroup, FormBuilder } from '@angular/forms';
+import { MatOptionSelectionChange } from '@angular/material/core/option';
 import { Store, select } from '@ngrx/store';
 import { Observable, Subject, combineLatest } from 'rxjs';
 import { map, filter, takeUntil } from 'rxjs/operators';
@@ -19,7 +20,6 @@ import { CreateTeam, DeleteTeam, GetTeams } from 'app/entities/teams/team.action
 import { Regex } from 'app/helpers/auth/regex';
 import { HttpStatus } from 'app/types/types';
 import { ProjectConstants } from 'app/entities/projects/project.model';
-import { ChefKeyboardEvent } from 'app/types/material-types';
 
 @Component({
   selector: 'app-team-management',
@@ -108,7 +108,7 @@ export class TeamManagementComponent implements OnInit, OnDestroy {
     this.deleteModalVisible = false;
   }
 
-  public startTeamDelete($event: ChefKeyboardEvent, team: Team): void {
+  public startTeamDelete($event: MatOptionSelectionChange, team: Team): void {
     if ($event.isUserInput) {
       this.teamToDelete = team;
       this.deleteModalVisible = true;

components/automate-ui/src/app/modules/token/token-list/api-token-list.component.ts

@@ -1,5 +1,6 @@
 import { Component, EventEmitter, OnInit, OnDestroy } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { MatOptionSelectionChange } from '@angular/material/core/option';
 import { Store, select } from '@ngrx/store';
 import { Observable, Subject, combineLatest } from 'rxjs';
 import { filter, takeUntil, map } from 'rxjs/operators';
@@ -10,7 +11,6 @@ import { DateTime } from 'app/helpers/datetime/datetime';
 import { NgrxStateAtom } from 'app/ngrx.reducers';
 import { Regex } from 'app/helpers/auth/regex';
 import { HttpStatus } from 'app/types/types';
-import { ChefKeyboardEvent } from 'app/types/material-types';
 import { loading, EntityStatus, pending } from 'app/entities/entities';
 import { ChefSorters } from 'app/helpers/auth/sorter';
 import { Type } from 'app/entities/notifications/notification.model';
@@ -118,7 +118,7 @@ export class ApiTokenListComponent implements OnInit, OnDestroy {
     this.deleteModalVisible = false;
   }
 
-  public startTokenDelete($event: ChefKeyboardEvent, token: ApiToken): void {
+  public startTokenDelete($event: MatOptionSelectionChange, token: ApiToken): void {
     if ($event.isUserInput) {
       this.tokenToDelete = token;
       this.deleteModalVisible = true;
@@ -149,7 +149,7 @@ export class ApiTokenListComponent implements OnInit, OnDestroy {
     })));
   }
 
-  public toggleActive($event: ChefKeyboardEvent, token: ApiToken): void {
+  public toggleActive($event: MatOptionSelectionChange, token: ApiToken): void {
     if ($event.isUserInput) {
       this.store.dispatch(new ToggleTokenActive(token));
     }
@@ -165,7 +165,7 @@ export class ApiTokenListComponent implements OnInit, OnDestroy {
     this.resetCreateModal();
   }
 
-  public notifyCopy($event: ChefKeyboardEvent): void {
+  public notifyCopy($event: MatOptionSelectionChange): void {
     if ($event.isUserInput) {
       this.store.dispatch(new CreateNotification({
         type: Type.info,

components/automate-ui/src/app/modules/user/user-table/user-table.component.ts

@@ -1,5 +1,5 @@
 import { Component, Input, Output, OnInit, EventEmitter } from '@angular/core';
-import { ChefKeyboardEvent } from 'app/types/material-types';
+import { MatOptionSelectionChange } from '@angular/material/core/option';
 import { User } from 'app/entities/users/user.model';
 
 @Component({
@@ -32,7 +32,7 @@ export class UserTableComponent implements OnInit {
     this.createPermissionsPath = [this.baseUrl, 'post'];
   }
 
-  deleteUser($event: ChefKeyboardEvent, user: User) {
+  deleteUser($event: MatOptionSelectionChange, user: User) {
     if ($event.isUserInput) {
       this.removeClicked.emit(user);
     }

components/automate-ui/src/app/pages/data-feed/data-feed.component.ts

@@ -1,16 +1,17 @@
 import { Component, OnInit, OnDestroy, EventEmitter } from '@angular/core';
-import { Store, select } from '@ngrx/store';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
-import { NgrxStateAtom } from 'app/ngrx.reducers';
-import { filter, takeUntil, map } from 'rxjs/operators';
-import { Regex } from 'app/helpers/auth/regex';
+import { MatOptionSelectionChange } from '@angular/material/core/option';
+import { Store, select } from '@ngrx/store';
 import { Observable, combineLatest, Subject } from 'rxjs';
+import { filter, takeUntil, map } from 'rxjs/operators';
 import { isNil } from 'lodash/fp';
+
+import { NgrxStateAtom } from 'app/ngrx.reducers';
+import { Regex } from 'app/helpers/auth/regex';
 import { HttpStatus } from 'app/types/types';
 import { loading, EntityStatus, pending } from 'app/entities/entities';
 import { LayoutFacadeService, Sidebar } from 'app/entities/layout/layout.facade';
-import { ChefKeyboardEvent } from 'app/types/material-types';
-import { Destination } from '../../entities/destinations/destination.model';
+import { Destination } from 'app/entities/destinations/destination.model';
 import {
   allDestinations,
   getStatus,
@@ -142,14 +143,14 @@ export class DataFeedComponent implements OnInit, OnDestroy {
     this.conflictErrorEvent.emit(false);
   }
 
-  public startDataFeedDelete($event: ChefKeyboardEvent, destination: Destination): void {
+  public startDataFeedDelete($event: MatOptionSelectionChange, destination: Destination): void {
     if ($event.isUserInput) {
       this.dataFeedToDelete = destination;
       this.deleteModalVisible = true;
     }
   }
 
-  public startDataFeedSendTest($event: ChefKeyboardEvent, destination: Destination) {
+  public startDataFeedSendTest($event: MatOptionSelectionChange, destination: Destination) {
     if ($event.isUserInput) {
       this.store.dispatch(new TestDestination({destination}));
     }

components/automate-ui/src/app/pages/integrations/list/integrations-list.component.ts

@@ -1,5 +1,6 @@
 import { Router } from '@angular/router';
 import { Component } from '@angular/core';
+import { MatOptionSelectionChange } from '@angular/material/core/option';
 import { Observable } from 'rxjs';
 import { Store } from '@ngrx/store';
 
@@ -13,7 +14,6 @@ import {
 } from '../../../entities/managers/manager.selectors';
 import { DeleteManager } from '../../../entities/managers/manager.actions';
 import { routeParams } from '../../../route.selectors';
-import { ChefKeyboardEvent } from 'app/types/material-types';
 
 @Component({
   selector: 'app-integrations',
@@ -48,7 +48,7 @@ export class IntegrationsListComponent {
     return status === 'loading';
   }
 
-  handleDelete($event: ChefKeyboardEvent, id: string) {
+  handleDelete($event: MatOptionSelectionChange, id: string) {
     if ($event.isUserInput) {
       this.store.dispatch(new DeleteManager({id}));
     }

components/automate-ui/src/app/pages/project/list/project-list.component.spec.ts

@@ -1,6 +1,7 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { RouterTestingModule } from '@angular/router/testing';
 import { ReactiveFormsModule } from '@angular/forms';
+import { MatOptionSelectionChange } from '@angular/material/core/option';
 import { StoreModule, Store } from '@ngrx/store';
 import { MockComponent } from 'ng2-mock-component';
 
@@ -16,7 +17,6 @@ import {
 } from 'app/entities/projects/project.actions';
 import { Project } from 'app/entities/projects/project.model';
 import { ProjectListComponent } from './project-list.component';
-import { ChefKeyboardEvent } from 'app/types/material-types';
 
 describe('ProjectListComponent', () => {
   let component: ProjectListComponent;
@@ -150,16 +150,15 @@ describe('ProjectListComponent', () => {
     });
 
     describe('delete modal', () => {
-      const mockChefKeyEvent = new KeyboardEvent('keypress') as ChefKeyboardEvent;
-      mockChefKeyEvent.isUserInput = true;
+      const mockEvent = { isUserInput: true } as MatOptionSelectionChange;
 
       using([
         ['NO_RULES'],
         ['PROJECT_RULES_STATUS_UNSET']
       ], function (status: ProjectStatus) {
         it(`upon selecting delete from control menu, opens with ${status}`, () => {
           expect(component.deleteModalVisible).toBe(false);
-          component.startProjectDelete(mockChefKeyEvent, genProject('uuid-111', status));
+          component.startProjectDelete(mockEvent, genProject('uuid-111', status));
           expect(component.deleteModalVisible).toBe(true);
         });
       });
@@ -170,13 +169,13 @@ describe('ProjectListComponent', () => {
       ], function (status: ProjectStatus) {
         it(`upon selecting delete from control menu, does not open with ${status}`, () => {
           expect(component.deleteModalVisible).toBe(false);
-          component.startProjectDelete(mockChefKeyEvent, genProject('uuid-111', status));
+          component.startProjectDelete(mockEvent, genProject('uuid-111', status));
           expect(component.deleteModalVisible).toBe(false);
         });
       });
 
      it('closes upon sending request to back-end', () => {
-       component.startProjectDelete(mockChefKeyEvent, genProject('uuid-111', 'NO_RULES'));
+       component.startProjectDelete(mockEvent, genProject('uuid-111', 'NO_RULES'));
         expect(component.deleteModalVisible).toBe(true);
         component.deleteProject();
         expect(component.deleteModalVisible).toBe(false);
@@ -185,16 +184,15 @@ describe('ProjectListComponent', () => {
     });
 
     describe('message modal', () => {
-      const mockChefKeyEvent = new KeyboardEvent('keypress') as ChefKeyboardEvent;
-      mockChefKeyEvent.isUserInput = true;
+      const mockEvent = { isUserInput: true } as MatOptionSelectionChange;
 
       using([
         ['RULES_APPLIED'],
         ['EDITS_PENDING']
       ], function (status: ProjectStatus) {
         it(`upon selecting delete from control menu, opens with ${status}`, () => {
           expect(component.messageModalVisible).toBe(false);
-          component.startProjectDelete(mockChefKeyEvent, genProject('uuid-111', status));
+          component.startProjectDelete(mockEvent, genProject('uuid-111', status));
           expect(component.messageModalVisible).toBe(true);
         });
       });
@@ -205,13 +203,13 @@ describe('ProjectListComponent', () => {
       ], function (status: ProjectStatus) {
         it(`upon selecting delete from control menu, does not open with ${status}`, () => {
           expect(component.messageModalVisible).toBe(false);
-          component.startProjectDelete(mockChefKeyEvent, genProject('uuid-111', status));
+          component.startProjectDelete(mockEvent, genProject('uuid-111', status));
           expect(component.messageModalVisible).toBe(false);
         });
       });
 
       it('closes upon request', () => {
-        component.startProjectDelete(mockChefKeyEvent, genProject('uuid-111', 'EDITS_PENDING'));
+        component.startProjectDelete(mockEvent, genProject('uuid-111', 'EDITS_PENDING'));
         expect(component.messageModalVisible).toBe(true);
         component.closeMessageModal();
         expect(component.messageModalVisible).toBe(false);

components/automate-ui/src/app/pages/project/list/project-list.component.ts

@@ -1,5 +1,6 @@
 import { Component, EventEmitter, OnInit, OnDestroy } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
+import { MatOptionSelectionChange } from '@angular/material/core/option';
 import { Store, select } from '@ngrx/store';
 import { Observable, Subject, combineLatest } from 'rxjs';
 import { map, takeUntil, filter } from 'rxjs/operators';
@@ -19,7 +20,6 @@ import {
 import { GetProjects, CreateProject, DeleteProject, ProjectPayload  } from 'app/entities/projects/project.actions';
 import { Project } from 'app/entities/projects/project.model';
 import { LoadOptions } from 'app/services/projects-filter/projects-filter.actions';
-import { ChefKeyboardEvent } from 'app/types/material-types';
 
 @Component({
   selector: 'app-project-list',
@@ -120,7 +120,7 @@ export class ProjectListComponent implements OnInit, OnDestroy {
     this.messageModalVisible = false;
   }
 
-  public startProjectDelete($event: ChefKeyboardEvent, p: Project): void {
+  public startProjectDelete($event: MatOptionSelectionChange, p: Project): void {
     if ($event.isUserInput) {
       const deletableStates: ProjectStatus[] = ['EDITS_PENDING', 'RULES_APPLIED'];
       if (deletableStates.includes(p.status)) {