Provider qa feedback (#1118)

* Ensure business plan is selected for providers

* Show add organization button on if user has valid orgs to add

* Correct client owner description

* No drop down options if you can't manage organizations

bitwarden_license/src/app/providers/clients/add-organization.component.ts

@@ -21,8 +21,6 @@ import { Provider } from 'jslib-common/models/domain/provider';
 
 import { PlanType } from 'jslib-common/enums/planType';
 
-const DisallowedPlanTypes = [PlanType.Free, PlanType.FamiliesAnnually2019, PlanType.FamiliesAnnually];
-
 @Component({
     selector: 'provider-add-organization',
     templateUrl: 'add-organization.component.html',
@@ -30,12 +28,12 @@ const DisallowedPlanTypes = [PlanType.Free, PlanType.FamiliesAnnually2019, PlanT
 export class AddOrganizationComponent implements OnInit {
 
     @Input() providerId: string;
+    @Input() organizations: Organization[];
     @Output() onAddedOrganization = new EventEmitter();
 
     provider: Provider;
     formPromise: Promise<any>;
     loading = true;
-    organizations: Organization[];
 
     constructor(private userService: UserService, private providerService: ProviderService,
         private toasterService: ToasterService, private i18nService: I18nService,
@@ -53,12 +51,6 @@ export class AddOrganizationComponent implements OnInit {
 
         this.provider = await this.userService.getProvider(this.providerId);
 
-        const candidateOrgs = (await this.userService.getAllOrganizations()).filter(o => o.providerId == null);
-        const allowedOrgsIds = await Promise.all(candidateOrgs.map(o => this.apiService.getOrganization(o.id))).then(orgs =>
-            orgs.filter(o => !DisallowedPlanTypes.includes(o.planType))
-                .map(o => o.id));
-        this.organizations = candidateOrgs.filter(o => allowedOrgsIds.includes(o.id));
-
         this.loading = false;
     }
 

bitwarden_license/src/app/providers/clients/clients.component.html

@@ -38,7 +38,7 @@
                     <td>
                         <a [routerLink]="['/organizations', o.organizationId]">{{o.organizationName}}</a>
                     </td>
-                    <td class="table-list-options">
+                    <td class="table-list-options" *ngIf="manageOrganizations">
                         <div class="dropdown" appListDropdown>
                             <button class="btn btn-outline-secondary dropdown-toggle" type="button"
                                 data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"

bitwarden_license/src/app/providers/clients/clients.component.ts

@@ -15,6 +15,7 @@ import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.se
 import { SearchService } from 'jslib-common/abstractions/search.service';
 import { UserService } from 'jslib-common/abstractions/user.service';
 
+import { PlanType } from 'jslib-common/enums/planType';
 import { ProviderUserType } from 'jslib-common/enums/providerUserType';
 
 import { ValidationService } from 'jslib-angular/services/validation.service';
@@ -22,6 +23,7 @@ import { ValidationService } from 'jslib-angular/services/validation.service';
 import {
     ProviderOrganizationOrganizationDetailsResponse
 } from 'jslib-common/models/response/provider/providerOrganizationResponse';
+import { Organization } from 'jslib-common/models/domain/organization';
 
 import { ModalComponent } from 'src/app/modal.component';
 
@@ -29,6 +31,8 @@ import { ProviderService } from '../services/provider.service';
 
 import { AddOrganizationComponent } from './add-organization.component';
 
+const DisallowedPlanTypes = [PlanType.Free, PlanType.FamiliesAnnually2019, PlanType.FamiliesAnnually];
+
 @Component({
     templateUrl: 'clients.component.html',
 })
@@ -38,6 +42,7 @@ export class ClientsComponent implements OnInit {
 
     providerId: any;
     searchText: string;
+    addableOrganizations: Organization[];
     loading = true;
     manageOrganizations = false;
     showAddExisting = false;
@@ -77,7 +82,13 @@ export class ClientsComponent implements OnInit {
         const response = await this.apiService.getProviderClients(this.providerId);
         this.clients = response.data != null && response.data.length > 0 ? response.data : [];
         this.manageOrganizations = (await this.userService.getProvider(this.providerId)).type === ProviderUserType.ProviderAdmin;
-        this.showAddExisting = (await this.userService.getAllOrganizations()).some(org => org.providerId == null);
+        const candidateOrgs = (await this.userService.getAllOrganizations()).filter(o => o.providerId == null);
+        const allowedOrgsIds = await Promise.all(candidateOrgs.map(o => this.apiService.getOrganization(o.id))).then(orgs =>
+            orgs.filter(o => !DisallowedPlanTypes.includes(o.planType))
+                .map(o => o.id));
+        this.addableOrganizations = candidateOrgs.filter(o => allowedOrgsIds.includes(o.id));
+
+        this.showAddExisting = this.addableOrganizations.length != 0;
         this.loading = false;
     }
 
@@ -121,6 +132,7 @@ export class ClientsComponent implements OnInit {
         const childComponent = this.modal.show<AddOrganizationComponent>(AddOrganizationComponent, this.addModalRef);
 
         childComponent.providerId = this.providerId;
+        childComponent.organizations = this.addableOrganizations;
         childComponent.onAddedOrganization.subscribe(async () => {
             try {
                 await this.load();

src/app/settings/organization-plans.component.html

@@ -33,7 +33,7 @@
         <div class="form-group col-6" *ngIf="!!providerId">
             <label for="email">{{'clientOwnerEmail' | i18n}}</label>
             <input id="email" class="form-control" type="text" name="Email" [(ngModel)]="clientOwnerEmail" required>
-            <small class="text-muted">{{'ownerDesc' | i18n : '20'}}</small>
+            <small class="text-muted">{{'clientOwnerDesc' | i18n : '20'}}</small>
         </div>
     </div>
     <div *ngIf="!providerId">

src/app/settings/organization-plans.component.ts

@@ -90,6 +90,7 @@ export class OrganizationPlansComponent implements OnInit {
 
         if (this.providerId) {
             this.ownedBusiness = true;
+            this.changedOwnedBusiness();
         }
 
         this.loading = false;

src/locales/en/messages.json

@@ -2251,7 +2251,7 @@
     "message": "The highest access user that can manage all aspects of your organization."
   },
   "clientOwnerDesc": {
-    "message": "This email should NOT be associated with the provider. This user will have permissions to access and manage all aspects of this organization."
+    "message": "This user should be independent of the Provider. If the Provider is disassociated with the organization, this user will maintain ownership of the organization."
   },
   "admin": {
     "message": "Admin"