Add user has roles filter to users tables

src/frontend/app/shared/components/list/list-types/app/cf-app-config.service.ts

@@ -6,11 +6,10 @@ import { UtilsService } from '../../../../../core/utils.service';
 import { ListView } from '../../../../../store/actions/list.actions';
 import { AppState } from '../../../../../store/app-state';
 import { APIResource } from '../../../../../store/types/api.types';
-import { CfOrgSpaceDataService } from '../../../../data-services/cf-org-space-service.service';
+import { CfOrgSpaceDataService, createCfOrgSpaceFilterConfig } from '../../../../data-services/cf-org-space-service.service';
 import { ApplicationStateService } from '../../../application-state/application-state.service';
 import { ITableColumn } from '../../list-table/table.types';
 import { IListConfig, IListMultiFilterConfig, ListConfig, ListViewTypes } from '../../list.component.types';
-import { createListFilterConfig } from '../../list.helper';
 import { CardAppComponent } from './card/card-app.component';
 import { CfAppsDataSource } from './cf-apps-data-source';
 import {
@@ -37,9 +36,9 @@ export class CfAppConfigService extends ListConfig<APIResource> implements IList
     this.appsDataSource = new CfAppsDataSource(this.store, this);
 
     this.multiFilterConfigs = [
-      createListFilterConfig('cf', 'Cloud Foundry', this.cfOrgSpaceService.cf),
-      createListFilterConfig('org', 'Organization', this.cfOrgSpaceService.org),
-      createListFilterConfig('space', 'Space', this.cfOrgSpaceService.space),
+      createCfOrgSpaceFilterConfig('cf', 'Cloud Foundry', this.cfOrgSpaceService.cf),
+      createCfOrgSpaceFilterConfig('org', 'Organization', this.cfOrgSpaceService.org),
+      createCfOrgSpaceFilterConfig('space', 'Space', this.cfOrgSpaceService.space),
     ];
   }
   appsDataSource: CfAppsDataSource;

src/frontend/app/shared/components/list/list-types/app/cf-apps-data-source.ts

@@ -100,7 +100,6 @@ export class CfAppsDataSource extends ListDataSource<APIResource> {
           const appState = app.entity.state;
           const appGuid = app.metadata.guid;
           const cfGuid = app.entity.cfGuid;
-          const dispatching = false;
           if (appState === 'STARTED') {
             actions.push({
               id: appGuid,

src/frontend/app/shared/components/list/list-types/cf-org-users/cf-org-users-list-config.service.ts

@@ -8,6 +8,7 @@ import {
   CloudFoundryOrganizationService,
 } from '../../../../../features/cloud-foundry/services/cloud-foundry-organization.service';
 import { AppState } from '../../../../../store/app-state';
+import { CfUser } from '../../../../../store/types/user.types';
 import { CfUserService } from '../../../../data-services/cf-user.service';
 import { CfUserListConfigService } from '../cf-users/cf-user-list-config.service';
 
@@ -21,7 +22,14 @@ export class CfOrgUsersListConfigService extends CfUserListConfigService {
     router: Router,
     activeRouteCfOrgSpace: ActiveRouteCfOrgSpace,
     userPerms: CurrentUserPermissionsService) {
-    super(store, cfUserService, router, activeRouteCfOrgSpace, userPerms, cfOrgService.org$);
+    super(
+      store,
+      cfUserService,
+      router,
+      activeRouteCfOrgSpace,
+      userPerms,
+      (user: CfUser): boolean => cfUserService.hasRolesInOrg(user, activeRouteCfOrgSpace.orgGuid, false),
+      cfOrgService.org$
+    );
   }
-
 }

src/frontend/app/shared/components/list/list-types/cf-services/cf-services-list-config.service.ts

@@ -1,23 +1,21 @@
-
-import {of as observableOf,  BehaviorSubject ,  Observable } from 'rxjs';
-
-import {map, first} from 'rxjs/operators';
 import { Injectable } from '@angular/core';
 import { Store } from '@ngrx/store';
+import { BehaviorSubject, of as observableOf } from 'rxjs';
+import { first, map } from 'rxjs/operators';
 
 import { EndpointsService } from '../../../../../core/endpoints.service';
 import { ActiveRouteCfOrgSpace } from '../../../../../features/cloud-foundry/cf-page.types';
 import { ListView } from '../../../../../store/actions/list.actions';
 import { AppState } from '../../../../../store/app-state';
 import { endpointsRegisteredEntitiesSelector } from '../../../../../store/selectors/endpoint.selectors';
 import { APIResource } from '../../../../../store/types/api.types';
-import { CfOrgSpaceItem } from '../../../../data-services/cf-org-space-service.service';
+import { EndpointModel } from '../../../../../store/types/endpoint.types';
+import { CfOrgSpaceItem, createCfOrgSpaceFilterConfig } from '../../../../data-services/cf-org-space-service.service';
+import { ITableColumn } from '../../list-table/table.types';
 import { IListConfig, IListMultiFilterConfig, ListViewTypes } from '../../list.component.types';
-import { createListFilterConfig } from '../../list.helper';
 import { CfServiceCardComponent } from './cf-service-card/cf-service-card.component';
 import { CfServicesDataSource } from './cf-services-data-source';
-import { ITableColumn } from '../../list-table/table.types';
-import { EndpointModel } from '../../../../../store/types/endpoint.types';
+
 
 @Injectable()
 export class CfServicesListConfigService implements IListConfig<APIResource> {
@@ -69,16 +67,16 @@ export class CfServicesListConfigService implements IListConfig<APIResource> {
     this.cf = {
       list$: this.store
         .select(endpointsRegisteredEntitiesSelector).pipe(
-        first(),
-        map(endpoints => {
-          return Object.values(endpoints)
-            .filter((endpoint: EndpointModel) => endpoint.connectionStatus === 'connected' && endpoint.cnsi_type === 'cf');
-        }), ),
+          first(),
+          map(endpoints => {
+            return Object.values(endpoints)
+              .filter((endpoint: EndpointModel) => endpoint.connectionStatus === 'connected' && endpoint.cnsi_type === 'cf');
+          })),
       loading$: observableOf(false),
       select: new BehaviorSubject(undefined)
     };
     this.multiFilterConfigs = [
-      createListFilterConfig('cf', 'Cloud Foundry', this.cf),
+      createCfOrgSpaceFilterConfig('cf', 'Cloud Foundry', this.cf),
     ];
   }
 

src/frontend/app/shared/components/list/list-types/cf-space-users/cf-space-users-list-config.service.ts

@@ -11,6 +11,7 @@ import { CloudFoundrySpaceService } from '../../../../../features/cloud-foundry/
 import { AppState } from '../../../../../store/app-state';
 import { CfUserService } from '../../../../data-services/cf-user.service';
 import { CfUserListConfigService } from '../cf-users/cf-user-list-config.service';
+import { CfUser } from '../../../../../store/types/user.types';
 
 @Injectable()
 export class CfSpaceUsersListConfigService extends CfUserListConfigService {
@@ -22,6 +23,15 @@ export class CfSpaceUsersListConfigService extends CfUserListConfigService {
     router: Router,
     activeRouteCfOrgSpace: ActiveRouteCfOrgSpace,
     userPerms: CurrentUserPermissionsService) {
-    super(store, cfUserService, router, activeRouteCfOrgSpace, userPerms, cfOrgService.org$, cfSpaceService.space$);
+    super(
+      store,
+      cfUserService,
+      router,
+      activeRouteCfOrgSpace,
+      userPerms,
+      (user: CfUser): boolean => cfUserService.hasSpaceRoles(user, activeRouteCfOrgSpace.spaceGuid),
+      cfOrgService.org$,
+      cfSpaceService.space$
+    );
   }
 }

src/frontend/app/shared/components/list/list-types/cf-users/cf-permission-cell.ts

@@ -27,10 +27,6 @@ export interface ICellPermissionList<T> extends IUserRole<T> {
   spaceGuid?: string;
 }
 
-interface ICellPermissionUpdates {
-  [key: string]: Observable<boolean>;
-}
-
 export abstract class CfPermissionCell<T> extends TableCellCustom<APIResource<CfUser>> {
   userEntity: BehaviorSubject<CfUser> = new BehaviorSubject(null);
 

src/frontend/app/shared/components/list/list-types/cf-users/cf-user-data-source.service.ts

@@ -2,24 +2,47 @@ import { Store } from '@ngrx/store';
 
 import { getRowMetadata } from '../../../../../features/cloud-foundry/cf.helpers';
 import { cfUserSchemaKey, entityFactory } from '../../../../../store/helpers/entity-factory';
-import { PaginatedAction } from '../../../../../store/types/pagination.types';
+import { PaginatedAction, PaginationEntityState } from '../../../../../store/types/pagination.types';
 import { ListDataSource } from '../../data-sources-controllers/list-data-source';
 import { ListConfig } from '../../list.component.types';
 import { AppState } from './../../../../../store/app-state';
 import { APIResource } from './../../../../../store/types/api.types';
 import { CfUser } from './../../../../../store/types/user.types';
+import { UserListUsersVisible, userListUserVisibleKey } from './cf-user-list-helpers';
+
+function createUserVisibilityFilter(userHasRoles: (user: CfUser) => boolean):
+  (entities: APIResource<CfUser>[], paginationState: PaginationEntityState) => APIResource<CfUser>[] {
+  return (entities: APIResource<CfUser>[], paginationState: PaginationEntityState): APIResource<CfUser>[] => {
+    const filter: UserListUsersVisible = paginationState.clientPagination.filter.items[userListUserVisibleKey];
+    if (!filter || filter === UserListUsersVisible.ALL) {
+      return entities;
+    }
+    return entities.reduce((response, user) => {
+      const hasARole = userHasRoles(user.entity);
+      if ((filter === UserListUsersVisible.WITH_ROLE && hasARole) || (filter === UserListUsersVisible.NO_ROLE && !hasARole)) {
+        response.push(user);
+      }
+      return response;
+    }, []);
+  };
+}
 
 
 export class CfUserDataSourceService extends ListDataSource<APIResource<CfUser>> {
-  constructor(store: Store<AppState>, action: PaginatedAction, listConfigService: ListConfig<APIResource<CfUser>>) {
+  constructor(
+    store: Store<AppState>,
+    action: PaginatedAction,
+    listConfigService: ListConfig<APIResource<CfUser>>,
+    userHasRoles: (user: CfUser) => boolean
+  ) {
     super({
       store,
       action,
       schema: entityFactory(cfUserSchemaKey),
       getRowUniqueId: getRowMetadata,
       paginationKey: action.paginationKey,
       isLocal: true,
-      transformEntities: [{ type: 'filter', field: 'entity.username' }],
+      transformEntities: [{ type: 'filter', field: 'entity.username' }, createUserVisibilityFilter(userHasRoles)],
       listConfig: listConfigService
     });
   }

src/frontend/app/shared/components/list/list-types/cf-users/cf-user-list-config.service.ts

@@ -1,27 +1,44 @@
-import { Injectable } from '@angular/core';
 import { Router } from '@angular/router';
 import { Store } from '@ngrx/store';
-import { combineLatest, Observable, of as observableOf } from 'rxjs';
-import { filter, map, switchMap, tap } from 'rxjs/operators';
+import { BehaviorSubject, combineLatest, Observable, of as observableOf } from 'rxjs';
+import { filter, first, map, switchMap, tap } from 'rxjs/operators';
 
 import { IOrganization, ISpace } from '../../../../../core/cf-api.types';
 import { CurrentUserPermissionsChecker } from '../../../../../core/current-user-permissions.checker';
 import { CurrentUserPermissionsService } from '../../../../../core/current-user-permissions.service';
 import { ActiveRouteCfOrgSpace } from '../../../../../features/cloud-foundry/cf-page.types';
 import { canUpdateOrgSpaceRoles, waitForCFPermissions } from '../../../../../features/cloud-foundry/cf.helpers';
+import { SetClientFilter } from '../../../../../store/actions/pagination.actions';
 import { UsersRolesSetUsers } from '../../../../../store/actions/users-roles.actions';
+import { selectPaginationState } from '../../../../../store/selectors/pagination.selectors';
+import { PaginatedAction } from '../../../../../store/types/pagination.types';
 import { CfUser } from '../../../../../store/types/user.types';
 import { AppState } from './../../../../../store/app-state';
 import { APIResource, EntityInfo } from './../../../../../store/types/api.types';
 import { CfUserService } from './../../../../data-services/cf-user.service';
 import { ITableColumn } from './../../list-table/table.types';
-import { IListAction, IMultiListAction, ListConfig, ListViewTypes } from './../../list.component.types';
+import {
+  IListAction,
+  IListMultiFilterConfig,
+  IMultiListAction,
+  ListConfig,
+  ListViewTypes,
+} from './../../list.component.types';
 import { CfOrgPermissionCellComponent } from './cf-org-permission-cell/cf-org-permission-cell.component';
 import { CfSpacePermissionCellComponent } from './cf-space-permission-cell/cf-space-permission-cell.component';
 import { CfUserDataSourceService } from './cf-user-data-source.service';
+import { userHasRole, UserListUsersVisible, userListUserVisibleKey } from './cf-user-list-helpers';
 
+const defaultUserHasRoles: (user: CfUser) => boolean = (user: CfUser): boolean => {
+  return userHasRole(user, 'organizations') ||
+    userHasRole(user, 'spaces') ||
+    userHasRole(user, 'managed_organizations') ||
+    userHasRole(user, 'managed_spaces') ||
+    userHasRole(user, 'audited_organizations') ||
+    userHasRole(user, 'audited_spaces') ||
+    userHasRole(user, 'billing_managed_organizations');
+};
 
-@Injectable()
 export class CfUserListConfigService extends ListConfig<APIResource<CfUser>> {
   isLocal = true;
   viewType = ListViewTypes.TABLE_ONLY;
@@ -61,7 +78,7 @@ export class CfUserListConfigService extends ListConfig<APIResource<CfUser>> {
     noEntries: 'There are no users'
   };
   private initialised: Observable<boolean>;
-  private canEditOrgSpaceRoles$: Observable<boolean>;
+  private multiFilterConfigs: IListMultiFilterConfig[];
 
   manageUserAction: IListAction<APIResource<CfUser>> = {
     action: (user: APIResource<CfUser>) => {
@@ -88,7 +105,7 @@ export class CfUserListConfigService extends ListConfig<APIResource<CfUser>> {
     description: `Change Roles`,
   };
 
-  private createManagerUsersUrl(user: APIResource<CfUser> = null): string {
+  private createManagerUsersUrl(): string {
     let route = `/cloud-foundry/${this.cfUserService.activeRouteCfOrgSpace.cfGuid}`;
     if (this.activeRouteCfOrgSpace.orgGuid) {
       route += `/organizations/${this.activeRouteCfOrgSpace.orgGuid}`;
@@ -106,13 +123,16 @@ export class CfUserListConfigService extends ListConfig<APIResource<CfUser>> {
     private router: Router,
     private activeRouteCfOrgSpace: ActiveRouteCfOrgSpace,
     private userPerms: CurrentUserPermissionsService,
+    userHasRoles: (user: CfUser) => boolean = defaultUserHasRoles,
     org$?: Observable<EntityInfo<APIResource<IOrganization>>>,
     space$?: Observable<EntityInfo<APIResource<ISpace>>>,
   ) {
     super();
 
     this.assignColumnConfig(org$, space$);
 
+    this.assignMultiConfig();
+
     this.initialised = waitForCFPermissions(store, activeRouteCfOrgSpace.cfGuid).pipe(
       switchMap(cf => // `cf` needed to create the second observable
         combineLatest(
@@ -121,13 +141,56 @@ export class CfUserListConfigService extends ListConfig<APIResource<CfUser>> {
         )
       ),
       tap(([cf, action]) => {
-        this.dataSource = new CfUserDataSourceService(store, action, this);
+        this.dataSource = new CfUserDataSourceService(store, action, this, userHasRoles);
+
+        this.initialiseMultiFilter(action);
       }),
       map(([cf, action]) => cf && cf.state.initialised)
     );
     this.manageMultiUserAction.visible$ = this.createCanUpdateOrgSpaceRoles();
   }
 
+  private initialiseMultiFilter(action: PaginatedAction) {
+    this.store.select(selectPaginationState(action.entityKey, action.paginationKey)).pipe(
+      filter((pag) => !!pag),
+      first(),
+    ).subscribe(pag => {
+      const currentFilter = pag.clientPagination.filter.items[userListUserVisibleKey];
+      if (!currentFilter) {
+        this.store.dispatch(new SetClientFilter(action.entityKey, action.paginationKey, {
+          string: '',
+          items: {
+            [userListUserVisibleKey]: UserListUsersVisible.WITH_ROLE
+          }
+        }));
+      }
+    });
+  }
+
+  private assignMultiConfig = () => {
+    this.multiFilterConfigs = [
+      {
+        key: userListUserVisibleKey,
+        label: 'All Users',
+        allLabel: 'All Users',
+        list$: observableOf([
+          {
+            label: 'Users With Roles',
+            item: UserListUsersVisible.WITH_ROLE,
+            value: UserListUsersVisible.WITH_ROLE
+          },
+          {
+            label: 'Users Without Roles',
+            item: UserListUsersVisible.NO_ROLE,
+            value: UserListUsersVisible.NO_ROLE
+          }
+        ]),
+        loading$: observableOf(false),
+        select: new BehaviorSubject(UserListUsersVisible.WITH_ROLE)
+      }
+    ];
+  }
+
   /**
    * Assign the org and/or spaces obs to the cell configs. These will be used to determine which org or space roles to show
    *
@@ -193,7 +256,7 @@ export class CfUserListConfigService extends ListConfig<APIResource<CfUser>> {
   getGlobalActions = () => [];
   getMultiActions = () => [this.manageMultiUserAction];
   getSingleActions = () => [this.manageUserAction];
-  getMultiFiltersConfigs = () => [];
+  getMultiFiltersConfigs = () => this.multiFilterConfigs;
   getDataSource = () => this.dataSource;
   getInitialised = () => this.initialised;
 

src/frontend/app/shared/components/list/list-types/cf-users/cf-user-list-helpers.ts

@@ -0,0 +1,13 @@
+import { CfUser } from '../../../../../store/types/user.types';
+
+export const userListUserVisibleKey = 'showUsers';
+
+export enum UserListUsersVisible {
+  ALL = 'all',
+  WITH_ROLE = 'withRole',
+  NO_ROLE = 'noRole'
+}
+
+export const userHasRole = (user: CfUser, roleProperty: string): boolean => {
+  return !!user[roleProperty] && !!user[roleProperty].length;
+};

src/frontend/app/shared/components/list/list-types/services-wall/service-instances-wall-list-config.service.ts

@@ -5,10 +5,9 @@ import { Store } from '@ngrx/store';
 import { CurrentUserPermissionsService } from '../../../../../core/current-user-permissions.service';
 import { ListView } from '../../../../../store/actions/list.actions';
 import { AppState } from '../../../../../store/app-state';
-import { CfOrgSpaceDataService } from '../../../../data-services/cf-org-space-service.service';
+import { CfOrgSpaceDataService, createCfOrgSpaceFilterConfig } from '../../../../data-services/cf-org-space-service.service';
 import { ServiceActionHelperService } from '../../../../data-services/service-action-helper.service';
 import { defaultPaginationPageSizeOptionsCards, ListViewTypes } from '../../list.component.types';
-import { createListFilterConfig } from '../../list.helper';
 import { cfOrgSpaceFilter } from '../app/cf-apps-data-source';
 import { CfServiceInstancesListConfigBase } from '../cf-services/cf-service-instances-list-config.base';
 import { ServiceInstanceCardComponent } from './service-instance-card/service-instance-card.component';
@@ -43,9 +42,9 @@ export class ServiceInstancesWallListConfigService extends CfServiceInstancesLis
   ) {
     super(store, datePipe, currentUserPermissionsService, serviceActionHelperService);
     const multiFilterConfigs = [
-      createListFilterConfig('cf', 'Cloud Foundry', this.cfOrgSpaceService.cf),
-      createListFilterConfig('org', 'Organization', this.cfOrgSpaceService.org),
-      createListFilterConfig('space', 'Space', this.cfOrgSpaceService.space),
+      createCfOrgSpaceFilterConfig('cf', 'Cloud Foundry', this.cfOrgSpaceService.cf),
+      createCfOrgSpaceFilterConfig('org', 'Organization', this.cfOrgSpaceService.org),
+      createCfOrgSpaceFilterConfig('space', 'Space', this.cfOrgSpaceService.space),
     ];
 
     const transformEntities = [{ type: 'filter', field: 'entity.name' }, cfOrgSpaceFilter];

src/frontend/app/shared/components/list/list.component.html

@@ -16,7 +16,7 @@
           <div class="list-component__header__left--multi-filters" [hidden]="(!(hasRows$ | async) && !filter) || (isAddingOrSelecting$ | async)">
             <mat-form-field *ngFor="let multiFilterConfig of multiFilterConfigs" [floatLabel]="'never'">
               <mat-select id="{{multiFilterConfig.key}}" matInput [(value)]="multiFilters[multiFilterConfig.key]" [disabled]="(dataSource.isLoadingPage$ | async) || (multiFilterConfig.loading$ | async) || !(multiFilterConfig.list$ | async) || !(multiFilterConfig.list$ | async).length" (selectionChange)="multiFilterConfig.select.next($event.value)">
-                <mat-option>All</mat-option>
+                <mat-option>{{ multiFilterConfig.allLabel || 'All' }}</mat-option>
                 <mat-option *ngFor="let selectItem of multiFilterConfig.list$ | async" [value]="selectItem.value">
                   {{selectItem.label}}
                 </mat-option>