chore(console): angular 16 (#5870)

* ng 16

* material cdk

* module imports, rmn @accounts

* deps

* lint

* buf

---------

Co-authored-by: Elio Bischof <elio@zitadel.com>

console/src/app/guards/auth.guard.ts

@@ -1,5 +1,5 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
 import { AuthConfig } from 'angular-oauth2-oidc';
 import { Observable } from 'rxjs';
 
@@ -8,7 +8,7 @@ import { AuthenticationService } from '../services/authentication.service';
 @Injectable({
   providedIn: 'root',
 })
-export class AuthGuard implements CanActivate {
+export class AuthGuard {
   constructor(private auth: AuthenticationService) {}
 
   public canActivate(

console/src/app/guards/role.guard.ts

@@ -1,5 +1,5 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
 import { Observable } from 'rxjs';
 
 import { GrpcAuthService } from '../services/grpc-auth.service';
@@ -7,7 +7,7 @@ import { GrpcAuthService } from '../services/grpc-auth.service';
 @Injectable({
   providedIn: 'root',
 })
-export class RoleGuard implements CanActivate {
+export class RoleGuard {
   constructor(private authService: GrpcAuthService) {}
 
   public canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> {

console/src/app/guards/user.guard.ts

@@ -1,5 +1,5 @@
 import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot } from '@angular/router';
+import { ActivatedRouteSnapshot, Router, RouterStateSnapshot } from '@angular/router';
 import { Observable } from 'rxjs';
 import { map, tap } from 'rxjs/operators';
 
@@ -8,7 +8,7 @@ import { GrpcAuthService } from '../services/grpc-auth.service';
 @Injectable({
   providedIn: 'root',
 })
-export class UserGuard implements CanActivate {
+export class UserGuard {
   constructor(private authService: GrpcAuthService, private router: Router) {}
 
   public canActivate(

console/src/app/modules/header/header.component.html

@@ -228,7 +228,6 @@
         (detach)="showAccount = false"
       >
         <cnsl-accounts-card
-          @accounts
           class="a_card"
           *ngIf="showAccount"
           (closedCard)="showAccount = false"

console/src/app/modules/metadata/metadata.module.ts

@@ -5,13 +5,13 @@ import { MatIconModule } from '@angular/material/icon';
 import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
 import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
 import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table';
 import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
 import { TranslateModule } from '@ngx-translate/core';
 import { LocalizedDatePipeModule } from 'src/app/pipes/localized-date-pipe/localized-date-pipe.module';
 import { TimestampToDatePipeModule } from 'src/app/pipes/timestamp-to-date-pipe/timestamp-to-date-pipe.module';
 import { CardModule } from '../card/card.module';
 
+import { MatLegacyTableModule } from '@angular/material/legacy-table';
 import { InputModule } from '../input/input.module';
 import { RefreshTableModule } from '../refresh-table/refresh-table.module';
 import { MetadataDialogComponent } from './metadata-dialog/metadata-dialog.component';
@@ -33,7 +33,7 @@ import { MetadataComponent } from './metadata/metadata.component';
     LocalizedDatePipeModule,
     TimestampToDatePipeModule,
     RefreshTableModule,
-    MatTableModule,
+    MatLegacyTableModule,
   ],
   exports: [MetadataComponent, MetadataDialogComponent],
 })

console/src/app/pages/orgs/org.module.ts

@@ -6,7 +6,6 @@ import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/lega
 import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
 import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu';
 import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacyTabsModule as MatTabsModule } from '@angular/material/legacy-tabs';
 import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
 import { TranslateModule } from '@ngx-translate/core';
 import { CopyToClipboardModule } from 'src/app/directives/copy-to-clipboard/copy-to-clipboard.module';
@@ -47,7 +46,6 @@ import { OrgRoutingModule } from './org-routing.module';
     MatIconModule,
     ReactiveFormsModule,
     MetaLayoutModule,
-    MatTabsModule,
     MatTooltipModule,
     WarnDialogModule,
     MemberCreateDialogModule,

console/src/app/pages/projects/granted-projects/granted-projects.module.ts

@@ -9,7 +9,6 @@ import { MatLegacyProgressBarModule as MatProgressBarModule } from '@angular/mat
 import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
 import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
 import { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table';
-import { MatLegacyTabsModule as MatTabsModule } from '@angular/material/legacy-tabs';
 import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
 import { MatSortModule } from '@angular/material/sort';
 import { TranslateModule } from '@ngx-translate/core';
@@ -51,7 +50,6 @@ import { GrantedProjectsRoutingModule } from './granted-projects-routing.module'
     MatIconModule,
     MatSelectModule,
     MatButtonModule,
-    MatTabsModule,
     MatProgressSpinnerModule,
     MetaLayoutModule,
     MatProgressBarModule,

console/src/app/pages/projects/owned-projects/owned-project-detail/owned-project-detail.module.ts

@@ -9,7 +9,6 @@ import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-m
 import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
 import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
 import { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table';
-import { MatLegacyTabsModule as MatTabsModule } from '@angular/material/legacy-tabs';
 import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
 import { TranslateModule } from '@ngx-translate/core';
 import { HasRoleModule } from 'src/app/directives/has-role/has-role.module';
@@ -53,7 +52,6 @@ import { OwnedProjectDetailComponent } from './owned-project-detail.component';
     MatIconModule,
     InfoRowModule,
     ContributorsModule,
-    MatTabsModule,
     WarnDialogModule,
     MatTooltipModule,
     ProjectRolesTableModule,

console/src/app/pages/projects/projects.module.ts

@@ -6,7 +6,7 @@ import { MatIconModule } from '@angular/material/icon';
 import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
 import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
 import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
-import { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table';
+import { MatLegacyTableModule } from '@angular/material/legacy-table';
 import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
 import { MatSortModule } from '@angular/material/sort';
 import { TranslateModule } from '@ngx-translate/core';
@@ -36,7 +36,7 @@ import { ProjectsComponent } from './projects.component';
     TranslateModule,
     FormsModule,
     HasRoleModule,
-    MatTableModule,
+    MatLegacyTableModule,
     PaginatorModule,
     InputModule,
     MatIconModule,

console/src/app/pages/users/user-detail/user-detail.module.ts

@@ -8,7 +8,6 @@ import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/lega
 import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu';
 import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
 import { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table';
-import { MatLegacyTabsModule as MatTabsModule } from '@angular/material/legacy-tabs';
 import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
 import { RouterModule } from '@angular/router';
 import { TranslateModule } from '@ngx-translate/core';
@@ -87,7 +86,6 @@ import { UserMfaComponent } from './user-detail/user-mfa/user-mfa.component';
     ChangesModule,
     CommonModule,
     SidenavModule,
-    MatTabsModule,
     FormsModule,
     ReactiveFormsModule,
     MembershipsTableModule,