fix(console): update dependencies, use prettier as default linter, refresh on policy change (#4375)

* privatelabeling refresh, org context color * chore(deps): bump @grpc/grpc-js from 1.6.10 to 1.7.0 in /console (#4358) Bumps [@grpc/grpc-js](https://github.com/grpc/grpc-node) from 1.6.10 to 1.7.0. - [Release notes](https://github.com/grpc/grpc-node/releases) - [Commits](https://github.com/grpc/grpc-node/compare/@grpc/[email protected]...@grpc/[email protected]) --- updated-dependencies: - dependency-name: "@grpc/grpc-js" dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <[email protected]> Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * chore(deps): bump ngx-color from 8.0.2 to 8.0.3 in /console (#4357) Bumps [ngx-color](https://github.com/scttcper/ngx-color) from 8.0.2 to 8.0.3. - [Release notes](https://github.com/scttcper/ngx-color/releases) - [Commits](https://github.com/scttcper/ngx-color/compare/v8.0.2...v8.0.3) --- updated-dependencies: - dependency-name: ngx-color dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <[email protected]> Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * chore(deps-dev): bump @types/node from 17.0.45 to 18.7.16 in /console (#4341) Bumps [@types/node](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/HEAD/types/node) from 17.0.45 to 18.7.16. - [Release notes](https://github.com/DefinitelyTyped/DefinitelyTyped/releases) - [Commits](https://github.com/DefinitelyTyped/DefinitelyTyped/commits/HEAD/types/node) --- updated-dependencies: - dependency-name: "@types/node" dependency-type: direct:development update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] <[email protected]> Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * chore(deps-dev): bump jasmine-core from 4.2.0 to 4.4.0 in /console (#4317) Bumps [jasmine-core](https://github.com/jasmine/jasmine) from 4.2.0 to 4.4.0. - [Release notes](https://github.com/jasmine/jasmine/releases) - [Changelog](https://github.com/jasmine/jasmine/blob/main/RELEASE.md) - [Commits](https://github.com/jasmine/jasmine/compare/v4.2.0...v4.4.0) --- updated-dependencies: - dependency-name: jasmine-core dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <[email protected]> Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * chore(deps-dev): bump @types/jasmine from 4.0.3 to 4.3.0 in /console (#4279) Bumps [@types/jasmine](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/HEAD/types/jasmine) from 4.0.3 to 4.3.0. - [Release notes](https://github.com/DefinitelyTyped/DefinitelyTyped/releases) - [Commits](https://github.com/DefinitelyTyped/DefinitelyTyped/commits/HEAD/types/jasmine) --- updated-dependencies: - dependency-name: "@types/jasmine" dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <[email protected]> Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * quicklink * cli core * material cdk * eslint * add grantid * show oidc config error * use prettier config, linter * rm stylelint, fix lint * prettier - ignore proto output * labelling * update contribution guide Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Elio Bischof <[email protected]>
2026-11-09 15:45:12 +00:00 · 2022-09-19 13:35:52 +02:00
parent 49396c4678
commit c0f8f4e5f2
302 changed files with 14497 additions and 8691 deletions
@@ -1,28 +1,32 @@
 <form class="form" (ngSubmit)="add(originInput)">
-    <cnsl-form-field class="formfield">
-        <cnsl-label>{{ title }}</cnsl-label>
+  <cnsl-form-field class="formfield">
+    <cnsl-label>{{ title }}</cnsl-label>

-        <input #originInput cnslInput [placeholder]="placeholder" [formControl]="redirectControl">
-    </cnsl-form-field>
-    <button matTooltip="{{'ACTIONS.ADD' | translate}}" type="submit" mat-icon-button
-        [disabled]="redirectControl.invalid || !canWrite">
-        <mat-icon>add</mat-icon>
-    </button>
+    <input #originInput cnslInput [placeholder]="placeholder" [formControl]="redirectControl" />
+  </cnsl-form-field>
+  <button
+    matTooltip="{{ 'ACTIONS.ADD' | translate }}"
+    type="submit"
+    mat-icon-button
+    [disabled]="redirectControl.invalid || !canWrite"
+  >
+    <mat-icon>add</mat-icon>
+  </button>
 </form>

 <div class="uri-list">
-    <div *ngFor="let uri of urisList" class="uri-line">
-        <span class="uri"
-            [ngClass]="{'green': uri?.startsWith('https://'), 'red': !uri?.startsWith('https://')}">{{uri}}</span>
-        <span class="fill-space"></span>
-        <!-- TODO add regex later -->
-        <!-- <i *ngIf="!(uri | origin)" class="las la-exclamation red" [matTooltip]="'APP.NOTANORIGIN' | translate"></i> -->
+  <div *ngFor="let uri of urisList" class="uri-line">
+    <span class="uri" [ngClass]="{ green: uri?.startsWith('https://'), red: !uri?.startsWith('https://') }">{{ uri }}</span>
+    <span class="fill-space"></span>
+    <!-- TODO add regex later -->
+    <!-- <i *ngIf="!(uri | origin)" class="las la-exclamation red" [matTooltip]="'APP.NOTANORIGIN' | translate"></i> -->

-        <button matTooltip="{{'ACTIONS.DELETE' | translate}}" mat-icon-button (click)="remove(uri)" class="icon-button">
-            <mat-icon class="icon">cancel</mat-icon>
-        </button>
-    </div>
+    <button matTooltip="{{ 'ACTIONS.DELETE' | translate }}" mat-icon-button (click)="remove(uri)" class="icon-button">
+      <mat-icon class="icon">cancel</mat-icon>
+    </button>
+  </div>
 </div>

 <p *ngIf="redirectControl.value && redirectControl.invalid" class="error">
-    {{'APP.OIDC.REDIRECTNOTVALID' | translate}}</p>
+  {{ 'APP.OIDC.REDIRECTNOTVALID' | translate }}
+</p>
@@ -3,23 +3,22 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { AdditionalOriginsComponent } from './additional-origins.component';

 describe('AdditionalOriginsComponent', () => {
-    let component: AdditionalOriginsComponent;
-    let fixture: ComponentFixture<AdditionalOriginsComponent>;
+  let component: AdditionalOriginsComponent;
+  let fixture: ComponentFixture<AdditionalOriginsComponent>;

-    beforeEach(async () => {
-        await TestBed.configureTestingModule({
-            declarations: [AdditionalOriginsComponent],
-        })
-            .compileComponents();
-    });
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [AdditionalOriginsComponent],
+    }).compileComponents();
+  });

-    beforeEach(() => {
-        fixture = TestBed.createComponent(AdditionalOriginsComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AdditionalOriginsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });

-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });
@@ -9,8 +9,7 @@ describe('AppCreateComponent', () => {
  beforeEach(waitForAsync(() => {
    TestBed.configureTestingModule({
      declarations: [AppCreateComponent],
-    })
-      .compileComponents();
+    }).compileComponents();
  }));

  beforeEach(() => {
@@ -9,8 +9,7 @@ describe('AppDetailComponent', () => {
  beforeEach(waitForAsync(() => {
    TestBed.configureTestingModule({
      declarations: [AppDetailComponent],
-    })
-      .compileComponents();
+    }).compileComponents();
  }));

  beforeEach(() => {
@@ -3,23 +3,22 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { AppSecretDialogComponent } from './app-secret-dialog.component';

 describe('AppSecretDialogComponent', () => {
-    let component: AppSecretDialogComponent;
-    let fixture: ComponentFixture<AppSecretDialogComponent>;
+  let component: AppSecretDialogComponent;
+  let fixture: ComponentFixture<AppSecretDialogComponent>;

-    beforeEach(waitForAsync(() => {
-        TestBed.configureTestingModule({
-            declarations: [AppSecretDialogComponent],
-        })
-            .compileComponents();
-    }));
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [AppSecretDialogComponent],
+    }).compileComponents();
+  }));

-    beforeEach(() => {
-        fixture = TestBed.createComponent(AppSecretDialogComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AppSecretDialogComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });

-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });
@@ -8,8 +8,7 @@ import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 })
 export class AppSecretDialogComponent {
  public copied: string = '';
-  constructor(public dialogRef: MatDialogRef<AppSecretDialogComponent>,
-    @Inject(MAT_DIALOG_DATA) public data: any) { }
+  constructor(public dialogRef: MatDialogRef<AppSecretDialogComponent>, @Inject(MAT_DIALOG_DATA) public data: any) {}

  public closeDialog(): void {
    this.dialogRef.close(false);
@@ -1,32 +1,32 @@
 import { FormControl } from '@angular/forms';

 export function nativeValidator(c: FormControl): any {
-    const REGEXP = /([a-zA-Z0-9]*:\/\/)\w+/g;
+  const REGEXP = /([a-zA-Z0-9]*:\/\/)\w+/g;

-    if (c.value.startsWith('http://localhost')) {
-        return null;
-    } else if (c.value.startsWith('https://') || c.value.startsWith('http://')) {
-        return {
-            invalid: true,
-            nativeValidator: {
-                valid: false,
-            },
-        };
-    } else if (REGEXP.test(c.value)) {
-        return null;
-    }
+  if (c.value.startsWith('http://localhost')) {
+    return null;
+  } else if (c.value.startsWith('https://') || c.value.startsWith('http://')) {
+    return {
+      invalid: true,
+      nativeValidator: {
+        valid: false,
+      },
+    };
+  } else if (REGEXP.test(c.value)) {
+    return null;
+  }
 }

 export function webValidator(c: FormControl): any {
-    if (c.value.startsWith('https://')) {
-        return null;
-    } else if (c.value.startsWith('http://')) {
-        return {
-            invalid: false,
-            webValidator: {
-                valid: true,
-                error: 'LOCALHOSTALLOWEDFORTESTING',
-            },
-        };
-    }
+  if (c.value.startsWith('https://')) {
+    return null;
+  } else if (c.value.startsWith('http://')) {
+    return {
+      invalid: false,
+      webValidator: {
+        valid: true,
+        error: 'LOCALHOSTALLOWEDFORTESTING',
+      },
+    };
+  }
 }
@@ -8,9 +8,8 @@ describe('RedirectUrisComponent', () => {

  beforeEach(async () => {
    await TestBed.configureTestingModule({
-      declarations: [ RedirectUrisComponent ],
-    })
-    .compileComponents();
+      declarations: [RedirectUrisComponent],
+    }).compileComponents();
  });

  beforeEach(() => {
@@ -3,23 +3,22 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { GrantedProjectDetailComponent } from './granted-project-detail.component';

 describe('GrantedProjectDetailComponent', () => {
-    let component: GrantedProjectDetailComponent;
-    let fixture: ComponentFixture<GrantedProjectDetailComponent>;
+  let component: GrantedProjectDetailComponent;
+  let fixture: ComponentFixture<GrantedProjectDetailComponent>;

-    beforeEach(waitForAsync(() => {
-        TestBed.configureTestingModule({
-            declarations: [GrantedProjectDetailComponent],
-        })
-            .compileComponents();
-    }));
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [GrantedProjectDetailComponent],
+    }).compileComponents();
+  }));

-    beforeEach(() => {
-        fixture = TestBed.createComponent(GrantedProjectDetailComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(GrantedProjectDetailComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });

-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });
@@ -3,23 +3,22 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { ApplicationGridComponent } from './application-grid.component';

 describe('AppGridComponent', () => {
-    let component: ApplicationGridComponent;
-    let fixture: ComponentFixture<ApplicationGridComponent>;
+  let component: ApplicationGridComponent;
+  let fixture: ComponentFixture<ApplicationGridComponent>;

-    beforeEach(waitForAsync(() => {
-        TestBed.configureTestingModule({
-            declarations: [ApplicationGridComponent],
-        })
-            .compileComponents();
-    }));
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ApplicationGridComponent],
+    }).compileComponents();
+  }));

-    beforeEach(() => {
-        fixture = TestBed.createComponent(ApplicationGridComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ApplicationGridComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });

-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });
@@ -11,55 +11,56 @@ import { ManagementService } from 'src/app/services/mgmt.service';
 * (including sorting, pagination, and filtering).
 */
 export class ProjectApplicationsDataSource extends DataSource<App.AsObject> {
-    public totalResult: number = 0;
-    public viewTimestamp!: Timestamp.AsObject;
+  public totalResult: number = 0;
+  public viewTimestamp!: Timestamp.AsObject;

-    public appsSubject: BehaviorSubject<App.AsObject[]> = new BehaviorSubject<App.AsObject[]>([]);
-    private loadingSubject: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
-    public loading$: Observable<boolean> = this.loadingSubject.asObservable();
+  public appsSubject: BehaviorSubject<App.AsObject[]> = new BehaviorSubject<App.AsObject[]>([]);
+  private loadingSubject: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
+  public loading$: Observable<boolean> = this.loadingSubject.asObservable();

-    constructor(private mgmtService: ManagementService) {
-        super();
-    }
+  constructor(private mgmtService: ManagementService) {
+    super();
+  }

-    public loadApps(projectId: string, pageIndex: number, pageSize: number): void {
-        const offset = pageIndex * pageSize;
+  public loadApps(projectId: string, pageIndex: number, pageSize: number): void {
+    const offset = pageIndex * pageSize;

-        this.loadingSubject.next(true);
-        from(this.mgmtService.listApps(projectId, pageSize, offset)).pipe(
-            map(resp => {
-                const response = resp;
-                if (response.details?.totalResult) {
-                    this.totalResult = response.details.totalResult;
-                }
-                if (response.details?.viewTimestamp) {
-                    this.viewTimestamp = response.details.viewTimestamp;
-                }
-                return response.resultList;
-            }),
-            catchError(() => of([])),
-            finalize(() => this.loadingSubject.next(false)),
-        ).subscribe(apps => {
-            this.appsSubject.next(apps);
-        });
-    }
+    this.loadingSubject.next(true);
+    from(this.mgmtService.listApps(projectId, pageSize, offset))
+      .pipe(
+        map((resp) => {
+          const response = resp;
+          if (response.details?.totalResult) {
+            this.totalResult = response.details.totalResult;
+          }
+          if (response.details?.viewTimestamp) {
+            this.viewTimestamp = response.details.viewTimestamp;
+          }
+          return response.resultList;
+        }),
+        catchError(() => of([])),
+        finalize(() => this.loadingSubject.next(false)),
+      )
+      .subscribe((apps) => {
+        this.appsSubject.next(apps);
+      });
+  }

+  /**
+   * Connect this data source to the table. The table will only update when
+   * the returned stream emits new items.
+   * @returns A stream of the items to be rendered.
+   */
+  public connect(): Observable<App.AsObject[]> {
+    return this.appsSubject.asObservable();
+  }

-    /**
-     * Connect this data source to the table. The table will only update when
-     * the returned stream emits new items.
-     * @returns A stream of the items to be rendered.
-     */
-    public connect(): Observable<App.AsObject[]> {
-        return this.appsSubject.asObservable();
-    }
-
-    /**
-     *  Called when the table is being destroyed. Use this function, to clean up
-     * any open connections or free any held resources that were set up during connect.
-     */
-    public disconnect(): void {
-        this.appsSubject.complete();
-        this.loadingSubject.complete();
-    }
+  /**
+   *  Called when the table is being destroyed. Use this function, to clean up
+   * any open connections or free any held resources that were set up during connect.
+   */
+  public disconnect(): void {
+    this.appsSubject.complete();
+    this.loadingSubject.complete();
+  }
 }
@@ -9,14 +9,12 @@ describe('ProjectApplicationsComponent', () => {
  let component: ApplicationsComponent;
  let fixture: ComponentFixture<ApplicationsComponent>;

-  beforeEach(
-    waitForAsync(() => {
-      TestBed.configureTestingModule({
-        declarations: [ApplicationsComponent],
-        imports: [NoopAnimationsModule, MatSortModule, MatTableModule],
-      }).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ApplicationsComponent],
+      imports: [NoopAnimationsModule, MatSortModule, MatTableModule],
+    }).compileComponents();
+  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(ApplicationsComponent);
@@ -5,19 +5,19 @@ import { RoleGuard } from 'src/app/guards/role.guard';
 import { OwnedProjectDetailComponent } from './owned-project-detail.component';

 const routes: Routes = [
-    {
-        path: '',
-        component: OwnedProjectDetailComponent,
-        data: {
-            animation: 'HomePage',
-            roles: ['project.read'],
-        },
-        canActivate: [RoleGuard],
+  {
+    path: '',
+    component: OwnedProjectDetailComponent,
+    data: {
+      animation: 'HomePage',
+      roles: ['project.read'],
    },
+    canActivate: [RoleGuard],
+  },
 ];

@NgModule({
-    imports: [RouterModule.forChild(routes)],
-    exports: [RouterModule],
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
 })
-export class OwnedProjectDetailRoutingModule { }
+export class OwnedProjectDetailRoutingModule {}
@@ -2,25 +2,23 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';

 import { OwnedProjectDetailComponent } from './owned-project-detail.component';

-
 describe('ProjectDetailComponent', () => {
-    let component: OwnedProjectDetailComponent;
-    let fixture: ComponentFixture<OwnedProjectDetailComponent>;
+  let component: OwnedProjectDetailComponent;
+  let fixture: ComponentFixture<OwnedProjectDetailComponent>;

-    beforeEach(waitForAsync(() => {
-        TestBed.configureTestingModule({
-            declarations: [OwnedProjectDetailComponent],
-        })
-            .compileComponents();
-    }));
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [OwnedProjectDetailComponent],
+    }).compileComponents();
+  }));

-    beforeEach(() => {
-        fixture = TestBed.createComponent(OwnedProjectDetailComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(OwnedProjectDetailComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });

-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });
@@ -26,9 +26,7 @@ import { LocalizedDatePipeModule } from 'src/app/pipes/localized-date-pipe/local
 import { TimestampToDatePipeModule } from 'src/app/pipes/timestamp-to-date-pipe/timestamp-to-date-pipe.module';

 import { NameDialogModule } from '../../../modules/name-dialog/name-dialog.module';
-import {
-  ProjectPrivateLabelingDialogModule,
-} from '../../../modules/project-private-labeling-dialog/project-private-labeling-dialog.module';
+import { ProjectPrivateLabelingDialogModule } from '../../../modules/project-private-labeling-dialog/project-private-labeling-dialog.module';
 import { OwnedProjectsRoutingModule } from './owned-projects-routing.module';

@NgModule({
@@ -4,15 +4,15 @@ import { RouterModule, Routes } from '@angular/router';
 import { ProjectGrantCreateComponent } from './project-grant-create.component';

 const routes: Routes = [
-    {
-        path: '',
-        component: ProjectGrantCreateComponent,
-        data: { animation: 'AddPage' },
-    },
+  {
+    path: '',
+    component: ProjectGrantCreateComponent,
+    data: { animation: 'AddPage' },
+  },
 ];

@NgModule({
-    imports: [RouterModule.forChild(routes)],
-    exports: [RouterModule],
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
 })
-export class ProjectGrantCreateRoutingModule { }
+export class ProjectGrantCreateRoutingModule {}
@@ -3,23 +3,22 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { ProjectGrantCreateComponent } from './project-grant-create.component';

 describe('GrantCreateComponent', () => {
-    let component: ProjectGrantCreateComponent;
-    let fixture: ComponentFixture<ProjectGrantCreateComponent>;
+  let component: ProjectGrantCreateComponent;
+  let fixture: ComponentFixture<ProjectGrantCreateComponent>;

-    beforeEach(waitForAsync(() => {
-        TestBed.configureTestingModule({
-            declarations: [ProjectGrantCreateComponent],
-        })
-            .compileComponents();
-    }));
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ProjectGrantCreateComponent],
+    }).compileComponents();
+  }));

-    beforeEach(() => {
-        fixture = TestBed.createComponent(ProjectGrantCreateComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ProjectGrantCreateComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });

-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });
@@ -4,15 +4,15 @@ import { RouterModule, Routes } from '@angular/router';
 import { ProjectGrantDetailComponent } from './project-grant-detail.component';

 const routes: Routes = [
-    {
-        path: '',
-        component: ProjectGrantDetailComponent,
-        data: { animation: 'AddPage' },
-    },
+  {
+    path: '',
+    component: ProjectGrantDetailComponent,
+    data: { animation: 'AddPage' },
+  },
 ];

@NgModule({
-    imports: [RouterModule.forChild(routes)],
-    exports: [RouterModule],
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
 })
-export class ProjectGrantDetailRoutingModule { }
+export class ProjectGrantDetailRoutingModule {}
@@ -3,23 +3,22 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { ProjectGrantDetailComponent } from './project-grant-detail.component';

 describe('GrantComponent', () => {
-    let component: ProjectGrantDetailComponent;
-    let fixture: ComponentFixture<ProjectGrantDetailComponent>;
+  let component: ProjectGrantDetailComponent;
+  let fixture: ComponentFixture<ProjectGrantDetailComponent>;

-    beforeEach(waitForAsync(() => {
-        TestBed.configureTestingModule({
-            declarations: [ProjectGrantDetailComponent],
-        })
-            .compileComponents();
-    }));
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ProjectGrantDetailComponent],
+    }).compileComponents();
+  }));

-    beforeEach(() => {
-        fixture = TestBed.createComponent(ProjectGrantDetailComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ProjectGrantDetailComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });

-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });
@@ -1,11 +1,12 @@
 <div class="pgi" *ngIf="grantedProject">
  <div class="pgi-org-wrapper first-org">
-    <span class="pgi-label">{{grantedProject.projectOwnerName}}</span>
+    <span class="pgi-label">{{ grantedProject.projectOwnerName }}</span>
    <div class="pgi-project-wrapper fill-space">
-      <span class="pgi-label">{{grantedProject.projectName}}</span>
+      <span class="pgi-label">{{ grantedProject.projectName }}</span>
      <div class="pgi-role-wrapper fill-space">
        <div class="pgi-role-row">
-          <cnsl-project-role-chip [roleName]="role.key" *ngFor="let role of projectRoleOptions">{{role.key}}
+          <cnsl-project-role-chip [roleName]="role.key" *ngFor="let role of projectRoleOptions"
+            >{{ role.key }}
          </cnsl-project-role-chip>
        </div>
        <span class="fill-space"></span>
@@ -19,22 +20,31 @@
  <i class="pgi-arrow las la-long-arrow-alt-right"></i>

  <div class="pgi-org-wrapper">
-    <span class="pgi-label italic">{{grantedProject.grantedOrgName}}</span>
+    <span class="pgi-label italic">{{ grantedProject.grantedOrgName }}</span>
    <div class="pgi-project-wrapper fill-space">
      <div class="pgi-label-wrapper">
-        <span class="pgi-label">{{grantedProject.projectName}}</span>
-        <div class="pgi-state-dot" *ngIf="grantedProject && grantedProject.state !== undefined"
-          matTooltip="{{'PROJECT.STATE.'+grantedProject.state | translate}}"
-          [ngClass]="{'active': grantedProject.state === ProjectGrantState.PROJECT_GRANT_STATE_ACTIVE, 'inactive': grantedProject.state === ProjectGrantState.PROJECT_GRANT_STATE_INACTIVE }">
-        </div>
+        <span class="pgi-label">{{ grantedProject.projectName }}</span>
+        <div
+          class="pgi-state-dot"
+          *ngIf="grantedProject && grantedProject.state !== undefined"
+          matTooltip="{{ 'PROJECT.STATE.' + grantedProject.state | translate }}"
+          [ngClass]="{
+            active: grantedProject.state === ProjectGrantState.PROJECT_GRANT_STATE_ACTIVE,
+            inactive: grantedProject.state === ProjectGrantState.PROJECT_GRANT_STATE_INACTIVE
+          }"
+        ></div>
      </div>
      <div class="pgi-role-wrapper fill-space">
        <div class="pgi-role-row">
-          <cnsl-project-role-chip [showRemove]="true" (removed)="removeRole(role)" [roleName]="role"
-            *ngFor="let role of grantedProject.grantedRoleKeysList">{{role}}
+          <cnsl-project-role-chip
+            [showRemove]="true"
+            (removed)="removeRole(role)"
+            [roleName]="role"
+            *ngFor="let role of grantedProject.grantedRoleKeysList"
+            >{{ role }}
          </cnsl-project-role-chip>
        </div>
-        <button matTooltip="{{'ACTIONS.EDIT' | translate}}" mat-icon-button (click)="editRoleClicked.emit()">
+        <button matTooltip="{{ 'ACTIONS.EDIT' | translate }}" mat-icon-button (click)="editRoleClicked.emit()">
          <i class="las la-pen"></i>
        </button>
        <span class="fill-space"></span>
@@ -44,4 +54,4 @@
    </div>
    <span class="pgi-label-sec cnsl-secondary-text">granted org</span>
  </div>
-</div>
+</div>
@@ -8,9 +8,8 @@ describe('ProjectGrantIllustrationComponent', () => {

  beforeEach(async () => {
    await TestBed.configureTestingModule({
-      declarations: [ ProjectGrantIllustrationComponent ]
-    })
-    .compileComponents();
+      declarations: [ProjectGrantIllustrationComponent],
+    }).compileComponents();
  });

  beforeEach(() => {
@@ -27,9 +27,9 @@ export class ProjectGrantMembersDataSource extends DataSource<Member.AsObject> {

    this.loadingSubject.next(true);

-    from(this.service.listProjectGrantMembers(projectId,
-      grantId, pageSize, offset)).pipe(
-        map(resp => {
+    from(this.service.listProjectGrantMembers(projectId, grantId, pageSize, offset))
+      .pipe(
+        map((resp) => {
          this.totalResult = resp.details?.totalResult || 0;
          if (resp.details?.viewTimestamp) {
            this.viewTimestamp = resp.details?.viewTimestamp;
@@ -38,7 +38,8 @@ export class ProjectGrantMembersDataSource extends DataSource<Member.AsObject> {
        }),
        catchError(() => of([])),
        finalize(() => this.loadingSubject.next(false)),
-      ).subscribe(members => {
+      )
+      .subscribe((members) => {
        this.membersSubject.next(members);
      });
  }
@@ -3,23 +3,22 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { ProjectGrantsComponent } from './project-grants.component';

 describe('ProjectGrantsComponent', () => {
-    let component: ProjectGrantsComponent;
-    let fixture: ComponentFixture<ProjectGrantsComponent>;
+  let component: ProjectGrantsComponent;
+  let fixture: ComponentFixture<ProjectGrantsComponent>;

-    beforeEach(waitForAsync(() => {
-        TestBed.configureTestingModule({
-            declarations: [ProjectGrantsComponent],
-        })
-            .compileComponents();
-    }));
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ProjectGrantsComponent],
+    }).compileComponents();
+  }));

-    beforeEach(() => {
-        fixture = TestBed.createComponent(ProjectGrantsComponent);
-        component = fixture.componentInstance;
-        fixture.detectChanges();
-    });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ProjectGrantsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });

-    it('should create', () => {
-        expect(component).toBeTruthy();
-    });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
 });
@@ -9,8 +9,7 @@ describe('ProjectRoleCreateComponent', () => {
  beforeEach(waitForAsync(() => {
    TestBed.configureTestingModule({
      declarations: [ProjectRoleCreateComponent],
-    })
-      .compileComponents();
+    }).compileComponents();
  }));

  beforeEach(() => {
@@ -8,9 +8,8 @@ describe('ProjectRolesComponent', () => {

  beforeEach(async () => {
    await TestBed.configureTestingModule({
-      declarations: [ ProjectRolesComponent ]
-    })
-    .compileComponents();
+      declarations: [ProjectRolesComponent],
+    }).compileComponents();
  });

  beforeEach(() => {
@@ -4,15 +4,15 @@ import { RouterModule, Routes } from '@angular/router';
 import { ProjectCreateComponent } from './project-create.component';

 const routes: Routes = [
-    {
-        path: '',
-        component: ProjectCreateComponent,
-        data: { animation: 'AddPage' },
-    },
+  {
+    path: '',
+    component: ProjectCreateComponent,
+    data: { animation: 'AddPage' },
+  },
 ];

@NgModule({
-    imports: [RouterModule.forChild(routes)],
-    exports: [RouterModule],
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
 })
-export class ProjectCreateRoutingModule { }
+export class ProjectCreateRoutingModule {}
@@ -9,8 +9,7 @@ describe('ProjectCreateComponent', () => {
  beforeEach(waitForAsync(() => {
    TestBed.configureTestingModule({
      declarations: [ProjectCreateComponent],
-    })
-      .compileComponents();
+    }).compileComponents();
  }));

  beforeEach(() => {
@@ -6,13 +6,11 @@ describe('GridComponent', () => {
  let component: ProjectGridComponent;
  let fixture: ComponentFixture<ProjectGridComponent>;

-  beforeEach(
-    waitForAsync(() => {
-      TestBed.configureTestingModule({
-        declarations: [ProjectGridComponent],
-      }).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ProjectGridComponent],
+    }).compileComponents();
+  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(ProjectGridComponent);
@@ -6,13 +6,11 @@ describe('ProjectListComponent', () => {
  let component: ProjectListComponent;
  let fixture: ComponentFixture<ProjectListComponent>;

-  beforeEach(
-    waitForAsync(() => {
-      TestBed.configureTestingModule({
-        declarations: [ProjectListComponent],
-      }).compileComponents();
-    }),
-  );
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [ProjectListComponent],
+    }).compileComponents();
+  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(ProjectListComponent);
@@ -8,9 +8,8 @@ describe('ProjectsComponent', () => {

  beforeEach(async () => {
    await TestBed.configureTestingModule({
-      declarations: [ ProjectsComponent ]
-    })
-    .compileComponents();
+      declarations: [ProjectsComponent],
+    }).compileComponents();
  });

  beforeEach(() => {