From 2dc94ede97ddf6d6eec41bb03b849fa540cf9956 Mon Sep 17 00:00:00 2001 From: Oscar Hinton Date: Mon, 16 Oct 2023 15:43:38 +0200 Subject: [PATCH] [PM-3538] Migrate AddOrganizationComponent Web (#6275) Migrate add organization in provider portal to use component library. --- .../clients/add-organization.component.html | 72 +++++---------- .../clients/add-organization.component.ts | 91 ++++++++++--------- .../providers/clients/clients.component.html | 2 - .../providers/clients/clients.component.ts | 30 ++---- .../providers/providers.module.ts | 12 +-- libs/angular/src/services/modal.service.ts | 7 -- 6 files changed, 84 insertions(+), 130 deletions(-) diff --git a/bitwarden_license/bit-web/src/app/admin-console/providers/clients/add-organization.component.html b/bitwarden_license/bit-web/src/app/admin-console/providers/clients/add-organization.component.html index 01cbc3c0bc..0fa39f2f29 100644 --- a/bitwarden_license/bit-web/src/app/admin-console/providers/clients/add-organization.component.html +++ b/bitwarden_license/bit-web/src/app/admin-console/providers/clients/add-organization.component.html @@ -1,47 +1,25 @@ - + + {{ "addExistingOrganization" | i18n }} + + + + + + + + + {{ o.name }} + + + + + + + + + + + + diff --git a/bitwarden_license/bit-web/src/app/admin-console/providers/clients/add-organization.component.ts b/bitwarden_license/bit-web/src/app/admin-console/providers/clients/add-organization.component.ts index d3eff4bc53..0d61c264e2 100644 --- a/bitwarden_license/bit-web/src/app/admin-console/providers/clients/add-organization.component.ts +++ b/bitwarden_license/bit-web/src/app/admin-console/providers/clients/add-organization.component.ts @@ -1,4 +1,5 @@ -import { Component, EventEmitter, Input, OnInit, Output } from "@angular/core"; +import { DIALOG_DATA, DialogRef } from "@angular/cdk/dialog"; +import { Component, Inject, OnInit } from "@angular/core"; import { ProviderService } from "@bitwarden/common/admin-console/abstractions/provider.service"; import { Organization } from "@bitwarden/common/admin-console/models/domain/organization"; @@ -10,20 +11,21 @@ import { DialogService } from "@bitwarden/components"; import { WebProviderService } from "../services/web-provider.service"; +interface AddOrganizationDialogData { + providerId: string; + organizations: Organization[]; +} + @Component({ - selector: "provider-add-organization", templateUrl: "add-organization.component.html", }) export class AddOrganizationComponent implements OnInit { - @Input() providerId: string; - @Input() organizations: Organization[]; - @Output() onAddedOrganization = new EventEmitter(); - - provider: Provider; - formPromise: Promise; - loading = true; + protected provider: Provider; + protected loading = true; constructor( + private dialogRef: DialogRef, + @Inject(DIALOG_DATA) protected data: AddOrganizationDialogData, private providerService: ProviderService, private webProviderService: WebProviderService, private i18nService: I18nService, @@ -37,52 +39,53 @@ export class AddOrganizationComponent implements OnInit { } async load() { - if (this.providerId == null) { + if (this.data.providerId == null) { return; } - this.provider = await this.providerService.get(this.providerId); + this.provider = await this.providerService.get(this.data.providerId); this.loading = false; } - async add(organization: Organization) { - // eslint-disable-next-line @typescript-eslint/no-misused-promises - if (this.formPromise) { - return; - } + add(organization: Organization) { + return async () => { + const confirmed = await this.dialogService.openSimpleDialog({ + title: organization.name, + content: { + key: "addOrganizationConfirmation", + placeholders: [organization.name, this.provider.name], + }, + type: "warning", + }); - const confirmed = await this.dialogService.openSimpleDialog({ - title: organization.name, - content: { - key: "addOrganizationConfirmation", - placeholders: [organization.name, this.provider.name], - }, - type: "warning", - }); + if (!confirmed) { + return false; + } - if (!confirmed) { - return false; - } + try { + await this.webProviderService.addOrganizationToProvider( + this.data.providerId, + organization.id + ); + } catch (e) { + this.validationService.showError(e); + return; + } - try { - this.formPromise = this.webProviderService.addOrganizationToProvider( - this.providerId, - organization.id + this.platformUtilsService.showToast( + "success", + null, + this.i18nService.t("organizationJoinedProvider") ); - await this.formPromise; - } catch (e) { - this.validationService.showError(e); - return; - } finally { - this.formPromise = null; - } - this.platformUtilsService.showToast( - "success", - null, - this.i18nService.t("organizationJoinedProvider") - ); - this.onAddedOrganization.emit(); + this.dialogRef.close(true); + }; + } + + static open(dialogService: DialogService, data: AddOrganizationDialogData) { + return dialogService.open(AddOrganizationComponent, { + data, + }); } } diff --git a/bitwarden_license/bit-web/src/app/admin-console/providers/clients/clients.component.html b/bitwarden_license/bit-web/src/app/admin-console/providers/clients/clients.component.html index 59d07f7def..9e3aaf4d29 100644 --- a/bitwarden_license/bit-web/src/app/admin-console/providers/clients/clients.component.html +++ b/bitwarden_license/bit-web/src/app/admin-console/providers/clients/clients.component.html @@ -97,5 +97,3 @@ - - diff --git a/bitwarden_license/bit-web/src/app/admin-console/providers/clients/clients.component.ts b/bitwarden_license/bit-web/src/app/admin-console/providers/clients/clients.component.ts index 329bf5189e..758c812035 100644 --- a/bitwarden_license/bit-web/src/app/admin-console/providers/clients/clients.component.ts +++ b/bitwarden_license/bit-web/src/app/admin-console/providers/clients/clients.component.ts @@ -1,5 +1,6 @@ -import { Component, OnInit, ViewChild, ViewContainerRef } from "@angular/core"; +import { Component, OnInit } from "@angular/core"; import { ActivatedRoute } from "@angular/router"; +import { firstValueFrom } from "rxjs"; import { first } from "rxjs/operators"; import { ModalService } from "@bitwarden/angular/services/modal.service"; @@ -33,8 +34,6 @@ const DisallowedPlanTypes = [ }) // eslint-disable-next-line rxjs-angular/prefer-takeuntil export class ClientsComponent implements OnInit { - @ViewChild("add", { read: ViewContainerRef, static: true }) addModalRef: ViewContainerRef; - providerId: string; searchText: string; addableOrganizations: Organization[]; @@ -135,23 +134,14 @@ export class ClientsComponent implements OnInit { } async addExistingOrganization() { - const [modal] = await this.modalService.openViewRef( - AddOrganizationComponent, - this.addModalRef, - (comp) => { - comp.providerId = this.providerId; - comp.organizations = this.addableOrganizations; - // eslint-disable-next-line rxjs-angular/prefer-takeuntil, rxjs/no-async-subscribe - comp.onAddedOrganization.subscribe(async () => { - try { - await this.load(); - modal.close(); - } catch (e) { - this.logService.error(`Handled exception: ${e}`); - } - }); - } - ); + const dialogRef = AddOrganizationComponent.open(this.dialogService, { + providerId: this.providerId, + organizations: this.addableOrganizations, + }); + + if (await firstValueFrom(dialogRef.closed)) { + await this.load(); + } } async remove(organization: ProviderOrganizationOrganizationDetailsResponse) { diff --git a/bitwarden_license/bit-web/src/app/admin-console/providers/providers.module.ts b/bitwarden_license/bit-web/src/app/admin-console/providers/providers.module.ts index b7f3bf9f38..7995e14825 100644 --- a/bitwarden_license/bit-web/src/app/admin-console/providers/providers.module.ts +++ b/bitwarden_license/bit-web/src/app/admin-console/providers/providers.module.ts @@ -1,9 +1,8 @@ import { CommonModule } from "@angular/common"; -import { ComponentFactoryResolver, NgModule } from "@angular/core"; +import { NgModule } from "@angular/core"; import { FormsModule } from "@angular/forms"; import { JslibModule } from "@bitwarden/angular/jslib.module"; -import { ModalService } from "@bitwarden/angular/services/modal.service"; import { SearchModule } from "@bitwarden/components"; import { OrganizationPlansComponent } from "@bitwarden/web-vault/app/billing"; import { OssModule } from "@bitwarden/web-vault/app/oss.module"; @@ -56,11 +55,4 @@ import { SetupComponent } from "./setup/setup.component"; ], providers: [WebProviderService, ProviderPermissionsGuard], }) -export class ProvidersModule { - constructor(modalService: ModalService, componentFactoryResolver: ComponentFactoryResolver) { - modalService.registerComponentFactoryResolver( - AddOrganizationComponent, - componentFactoryResolver - ); - } -} +export class ProvidersModule {} diff --git a/libs/angular/src/services/modal.service.ts b/libs/angular/src/services/modal.service.ts index ba461764ba..da47368c2f 100644 --- a/libs/angular/src/services/modal.service.ts +++ b/libs/angular/src/services/modal.service.ts @@ -88,13 +88,6 @@ export class ModalService { return modalRef; } - registerComponentFactoryResolver( - componentType: Type, - componentFactoryResolver: ComponentFactoryResolver - ): void { - this.factoryResolvers.set(componentType, componentFactoryResolver); - } - resolveComponentFactory(componentType: Type): ComponentFactory { if (this.factoryResolvers.has(componentType)) { return this.factoryResolvers.get(componentType).resolveComponentFactory(componentType);