Merge upstream #3 (#421)

* Improve recent and favourites display (cloudfoundry#4421) * Improve recent and favourites display * Remove debug logging * Remove debug logging/subscription leak * Unit test fix * Tweaks following review * Changes following review - favourite & recent icon changes Co-authored-by: Richard Cox <richard.cox@suse.com> * Add line-height to favourite and recent entity labels (cloudfoundry#4438) - missed out from another PR following review * Autoscaler e2e tests: Give better failure error when the test can't find the scaling row (cloudfoundry#4424) * Improve autoscaler e2e tests * Remove duplicate fail statement * Helm Chart: Remove encryption key volume (cloudfoundry#4355) * Remove encryption key volume * Remove encrpytion key volume migration from config-init job * Improve the logout experience (cloudfoundry#4439) * Add support for including breaking changes in the changelog * Improve the logout experience * Fix unit tests * Add request for version info to github issues template (cloudfoundry#4443) * Merge downstream (cloudfoundry#4441) * Merge src/frontend from downstream * Merge src/jetstream from jetstream * Remove examples/custom-src * Merge deploy from downstream Does not include changes to - deploy/all-in-one/* - deploy/aio-entrypoint.sh - deploy/Dockerfile.all-in-one * Merge build from downstream * Add missing merge items from deploy * Updates to package-lock * Remove fdescribe * Fix e2e core tests * Remove favicon from packages/core/src * Changes following review * Show all favorites for an endpoint favorite if there is only one (cloudfoundry#4440) * Show all favorites for the endpoint favorite if there is only one * Missing changes * Merge downstream - JSON Viewer with dark mode & Header Fixes (cloudfoundry#4444) * Fix json-viewer dark mode * Fix profile page and side nav top position following header diet - Fix side nav top position - Update fix for profile page to also work in non-desktop mode * Fix issues with tests not running if build upload fails (cloudfoundry#4453) * Fix issues with tests not running if build upload fails * Fix script * One more fix for script * Fix white space at start of file * Improve autoscaler e2e logging (cloudfoundry#4456) * Improve autoscaler e2e logging - it looks like the AS returns scaling events 1-2 mins after they occur, which is too late for the test - add additional logging to print out event table data in case of alternative events being raised - fix logging if wait for events times out - add hint in later test that depends on AS scaling event * Ensure only the schedule rule results in scaling events * Fix check-e2e-pr.sh for pr's from other repos (cloudfoundry#4459) - switch from TRAVIS_PULL_REQUEST_SLUG to TRAVIS_REPO_SLUG * Convert Client Secret Input Fields to `password` (cloudfoundry#4455) * Insecure tlsv10 and tlsv11 ciphers in Stratos UI, bsc#1173295 (#411) (cloudfoundry#4460) Co-authored-by: Michal Jura <mjura@users.noreply.github.com> * [Security] Bump codecov from 3.7.0 to 3.7.1 (cloudfoundry#4457) Bumps [codecov](https://github.com/codecov/codecov-node) from 3.7.0 to 3.7.1. **This update includes a security fix.** - [Release notes](https://github.com/codecov/codecov-node/releases) - [Commits](codecov/codecov-node@v3.7.0...v3.7.1) Signed-off-by: dependabot-preview[bot] <support@dependabot.com> Co-authored-by: dependabot-preview[bot] <27856297+dependabot-preview[bot]@users.noreply.github.com> * Bump lodash from 4.17.15 to 4.17.19 (cloudfoundry#4452) Bumps [lodash](https://github.com/lodash/lodash) from 4.17.15 to 4.17.19. - [Release notes](https://github.com/lodash/lodash/releases) - [Commits](lodash/lodash@4.17.15...4.17.19) Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * Convert scripts to nodejs so they work on Windows (cloudfoundry#4462) * Convert scripts to js so they work on Windows * Improve initial developer experience * Fix scss compile on windows * Fix windows build * Use fs not fs-extra where possible (can work without npm install) * Remove gulp * Cleaner fixes for Windows * Reset * Fix whitespace * Address PR feedback Co-authored-by: Neil MacDougall <nmacdougall@suse.com> * Shorten file paths containing `cloudfoundry`/`cloud-foundry` (cloudfoundry#4466) * Fix 'too long' file paths * Fix build issues * Convert scripts to js so they work on Windows * Fix scss compile on windows * Improve initial developer experience * Fix scss compile on windows * Fix windows build * Use fs not fs-extra where possible (can work without npm install) * Remove gulp * Cleaner fixes for Windows * Reset * Fix whitespace * Fix merge Co-authored-by: Neil MacDougall <neil.macdougall@suse.com> Co-authored-by: Neil MacDougall <nmacdougall@suse.com> Co-authored-by: Neil MacDougall <nwmac@users.noreply.github.com> * Fix log out page when there's a custom log in page (cloudfoundry#4467) * Add service broker space scope information to service wall list (cloudfoundry#4463) * Add service broker space scope information to service wall list * Split out `Space Scope` into it's own `Scope` row/column * Add service broker scope to service instance list (card and table) & app binding list (card) * Fix e2e test * Fix services table, cater for brokers that return 403 * Changes following review - Show space scope link in app service list (quick access) - Harmonize names (Service, broker, scope, etc) - Fix space scope link in services wall * Remove recents and favorites when entities are deleted (cloudfoundry#4431) * Improve recent and favourites display * Remove debug logging * Remove debug logging/subscription leak * Unit test fix * Remove recents and favorites when entities are deleted * Fix merge issues * Fix merge issue * Tidy up and improve following PR feedback * Remove out of date comment * Fixed problem where clear was not working * Check favorite exists before deleting * Version bump and change log (cloudfoundry#4469) * Version bump and change log * Update changelog Co-authored-by: Neil MacDougall <nwmac@users.noreply.github.com> Co-authored-by: Michal Jura <mjura@users.noreply.github.com> Co-authored-by: dependabot-preview[bot] <27856297+dependabot-preview[bot]@users.noreply.github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Neil MacDougall <nmacdougall@suse.com> Co-authored-by: Neil MacDougall <neil.macdougall@suse.com>
SUSE · Jul 24, 2020 · a5b29fa · a5b29fa
1 parent 4717ba6
commit a5b29fa
Show file tree

Hide file tree

Showing 26 changed files with 416 additions and 103 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,71 @@
 # Change Log
 
+## 4.0.0
+
+[Full Changelog](https://github.com/cloudfoundry/stratos/compare/3.2.1...4.0.0)
+
+This release contains a number of fixes and improvements:
+
+**Improvements:**
+
+- Extensions: Remove the need for symlinks and improve the build process [\#4472](https://github.com/cloudfoundry/stratos/issues/4472)
+- Extensions: Allow Themes to be published and installed to/from npm [\#4471](https://github.com/cloudfoundry/stratos/issues/4471)
+- Extensions: Move to extensions and themes to be packages [\#4470](https://github.com/cloudfoundry/stratos/issues/4470)
+- Show service broker space scope information in service wall list [\#4458](https://github.com/cloudfoundry/stratos/issues/4458)
+- Client Secret is shown in the clear in the UI [\#4445](https://github.com/cloudfoundry/stratos/issues/4445)
+- Improve sizing of UI elements on desktop browsers [\#4419](https://github.com/cloudfoundry/stratos/issues/4419)
+- Theming: Allow more control over link and side navigation colors [\#4406](https://github.com/cloudfoundry/stratos/issues/4406)
+- Update to latest set of icons [\#4403](https://github.com/cloudfoundry/stratos/issues/4403)
+- Theming: Allow more control over page header colors and style [\#4396](https://github.com/cloudfoundry/stratos/issues/4396)
+- Helm Chart: Remove encryption volume [\#4351](https://github.com/cloudfoundry/stratos/issues/4351)
+- Improve app summary responsiveness [\#4348](https://github.com/cloudfoundry/stratos/issues/4348)
+- Improve UI for the case when we can't determine cf app deployment info [\#4347](https://github.com/cloudfoundry/stratos/issues/4347)
+- Change recent activity icon to avoid confusion with the refresh button [\#4346](https://github.com/cloudfoundry/stratos/issues/4346)
+- Helm Chart: Change default image pull policy to Always [\#4342](https://github.com/cloudfoundry/stratos/issues/4342)
+- Permissions: Org Managers: Disable org role checkboxes in roles stepper if not admin/org manager [\#4332](https://github.com/cloudfoundry/stratos/issues/4332)
+- Autoscaler: Add support for custom metrics [\#4298](https://github.com/cloudfoundry/stratos/issues/4298)
+- Add support for copying endpoint address in list view [\#4238](https://github.com/cloudfoundry/stratos/issues/4238)
+- Update to Angular 9 framework [\#4214](https://github.com/cloudfoundry/stratos/issues/4214)
+- Update docker logo in deploy app stepper [\#4133](https://github.com/cloudfoundry/stratos/issues/4133)
+- Helm Chart: Remove need for --recreate-pods when upgrading [\#4132](https://github.com/cloudfoundry/stratos/issues/4132)
+- Make permissions model extension friendly [\#3789](https://github.com/cloudfoundry/stratos/issues/3789)
+- User Favourites: Add icons to cards [\#3409](https://github.com/cloudfoundry/stratos/issues/3409)
+- Improve log out experience [\#2587](https://github.com/cloudfoundry/stratos/issues/2587)
+
+**Fixes:**
+
+- Ensure `cf push` works from Windows  [\#4465](https://github.com/cloudfoundry/stratos/issues/4465)
+- Visiting marketplace tab breaks service list [\#4397](https://github.com/cloudfoundry/stratos/issues/4397)
+- CF Application reports error after restage [\#4392](https://github.com/cloudfoundry/stratos/issues/4392)
+- Helm Chart: Icon is missing [\#4370](https://github.com/cloudfoundry/stratos/issues/4370)
+- Permissions: Users with no developer roles can click on create app button [\#4361](https://github.com/cloudfoundry/stratos/issues/4361)
+- Edit endpoint not available in table view [\#4349](https://github.com/cloudfoundry/stratos/issues/4349)
+- CF: Routes List: Filter by org breaks when user is an org auditor [\#4343](https://github.com/cloudfoundry/stratos/issues/4343)
+- Permissions: Only space developers should be able to see add service instance buttons [\#4331](https://github.com/cloudfoundry/stratos/issues/4331)
+- Permissions: Only Space Developers should be able to change count, terminate or ssh to instances [\#4330](https://github.com/cloudfoundry/stratos/issues/4330)
+- App: Gitlab Tab: Fix console errors [\#4325](https://github.com/cloudfoundry/stratos/issues/4325)
+- Permissions: Only space developers should be able to create/unbind/delete routes in app routes list [\#4324](https://github.com/cloudfoundry/stratos/issues/4324)
+- Permissions: Only Space Developers should be able to create/edit/delete an Autoscaler policy [\#4323](https://github.com/cloudfoundry/stratos/issues/4323)
+- Permissions: Only space developers should be able to see the app summary deployment card [\#4322](https://github.com/cloudfoundry/stratos/issues/4322)
+- Duplicated documentation between deploy/kubernetes and Helm Chart README.md [\#4315](https://github.com/cloudfoundry/stratos/issues/4315)
+- App Service Edit Binding: cancel of stepper results in leaked subscription [\#4295](https://github.com/cloudfoundry/stratos/issues/4295)
+- Exceptions thrown when navigating back from marketplace [\#4287](https://github.com/cloudfoundry/stratos/issues/4287)
+- Unbind services stepper fails to show bound services [\#4246](https://github.com/cloudfoundry/stratos/issues/4246)
+- Progress icon appears too close to right-hand size of table [\#4234](https://github.com/cloudfoundry/stratos/issues/4234)
+- Cancel/create in service instance stepper returns to incorrect locations [\#4052](https://github.com/cloudfoundry/stratos/issues/4052)
+- Exception thrown in setup steppers [\#3897](https://github.com/cloudfoundry/stratos/issues/3897)
+- Logout leaves the UI as is if the verify or logout call fails [\#2633](https://github.com/cloudfoundry/stratos/issues/2633)
+- Cf Build Packs: file name should wrap to next line if too long [\#1803](https://github.com/cloudfoundry/stratos/issues/1803)
+
+**Breaking Changes:**
+
+- **Kubernetes: Upgrade only possible from version 3.0.0 or later**
+
+  When deploying into Kubernetes using Helm and upgrading from an earlier version of Stratos using `helm upgrade`, upgrade is **only** supported from version 3.0.0 or later. If you are using an earlier version, first upgrade to version 3.x before then upgrading to the latest version.
+- **Angular 9 requires extensions to be declared**
+
+  Extension components must now be made known to the extensions system in the module that they are declared in, using `ExtensionService.declare`. Please check the documentation. This is required to ensure that the new Angular compiler for Ivy does not remove these components for being unreferenced in the application.
+
 ## 3.2.1
 
 [Full Changelog](https://github.com/SUSE/stratos/compare/3.2.0...3.2.1)

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "stratos",
-  "version": "3.2.1",
+  "version": "4.0.0",
   "description": "Stratos Console",
   "main": "index.js",
   "scripts": {

diff --git a/src/frontend/packages/cloud-foundry/src/shared/cf-shared.module.ts b/src/frontend/packages/cloud-foundry/src/shared/cf-shared.module.ts
@@ -136,6 +136,9 @@ import {
 import {
   TableCellServiceBindableComponent,
 } from './components/list/list-types/cf-services/table-cell-service-bindable/table-cell-service-bindable.component';
+import {
+  TableCellServiceBrokerComponent,
+} from './components/list/list-types/cf-services/table-cell-service-broker/table-cell-service-broker.component';
 import {
   TableCellServiceCfBreadcrumbsComponent,
 } from './components/list/list-types/cf-services/table-cell-service-cf-breadcrumbs/table-cell-service-cf-breadcrumbs.component';
@@ -248,6 +251,7 @@ const cfListTableCells: Type<TableCellCustom<any>>[] = [
   TableCellServiceReferencesComponent,
   TableCellServiceInstanceTagsComponent,
   TableCellCommitAuthorComponent,
+  TableCellServiceBrokerComponent
 ];
 
 const cfListCards: Type<CardCell<any>>[] = [

diff --git a/...ypes/app-sevice-bindings/app-service-binding-card/app-service-binding-card.component.html b/...ypes/app-sevice-bindings/app-service-binding-card/app-service-binding-card.component.html
@@ -1,7 +1,7 @@
 <app-meta-card class="app-service-card" [actionMenu]="cardMenu" [entityConfig]="entityConfig">
   <app-meta-card-title>
     <div class="app-service-card__title">
-      {{ (serviceInstance$ | async)?.entity.entity.name}}
+      {{ (serviceInstance$ | async)?.entity.name}}
       <app-service-icon [service]="service$ | async"></app-service-icon>
     </div>
   </app-meta-card-title>
@@ -18,7 +18,25 @@
     <app-meta-card-key>{{ data.label }}</app-meta-card-key>
     <app-meta-card-value>{{ data.data$ | async }} </app-meta-card-value>
   </app-meta-card-item>
-
+  <app-meta-card-item *ngIf="!isUserProvidedServiceInstance">
+    <app-meta-card-key>Service Broker</app-meta-card-key>
+    <app-meta-card-value>
+      <app-table-cell-service-broker [row]="service$ | async" [config]="brokerNameConfig">
+      </app-table-cell-service-broker>
+    </app-meta-card-value>
+  </app-meta-card-item>
+  <app-meta-card-item *ngIf="!isUserProvidedServiceInstance">
+    <app-meta-card-key>Service Scope</app-meta-card-key>
+    <app-meta-card-value>
+      <app-table-cell-service-broker [row]="service$ | async" [config]="brokerScopeConfig">
+      </app-table-cell-service-broker>
+    </app-meta-card-value>
+  </app-meta-card-item>
+  <app-meta-card-item>
+    <app-meta-card-key>Date Created On</app-meta-card-key>
+    <app-meta-card-value>{{ row.metadata.created_at | date:'medium'}}
+    </app-meta-card-value>
+  </app-meta-card-item>
   <app-meta-card-item *ngIf="envVarsAvailable$ | async as envVarData">
     <app-meta-card-key>Environment Variables</app-meta-card-key>
     <app-meta-card-value>

diff --git a/...-types/app-sevice-bindings/app-service-binding-card/app-service-binding-card.component.ts b/...-types/app-sevice-bindings/app-service-binding-card/app-service-binding-card.component.ts
@@ -1,7 +1,6 @@
-import { DatePipe } from '@angular/common';
 import { Component, OnInit } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
-import { combineLatest as observableCombineLatest, Observable, of as observableOf, of } from 'rxjs';
+import { combineLatest as observableCombineLatest, Observable, of } from 'rxjs';
 import { filter, first, map, switchMap } from 'rxjs/operators';
 
 import {
@@ -24,7 +23,6 @@ import { serviceBindingEntityType } from '../../../../../../cf-entity-types';
 import { ApplicationService } from '../../../../../../features/applications/application.service';
 import { isUserProvidedServiceInstance } from '../../../../../../features/cf/cf.helpers';
 import {
-  getServiceBrokerName,
   getServiceName,
   getServicePlanName,
   getServiceSummaryUrl,
@@ -34,6 +32,10 @@ import { CfCurrentUserPermissions } from '../../../../../../user-permissions/cf-
 import { ServiceActionHelperService } from '../../../../../data-services/service-action-helper.service';
 import { CSI_CANCEL_URL } from '../../../../add-service-instance/csi-mode.service';
 import { EnvVarViewComponent } from '../../../../env-var-view/env-var-view.component';
+import {
+  TableCellServiceBrokerComponentConfig,
+  TableCellServiceBrokerComponentMode,
+} from '../../cf-services/table-cell-service-broker/table-cell-service-broker.component';
 
 
 interface EnvVarData {
@@ -54,19 +56,25 @@ export class AppServiceBindingCardComponent extends CardCell<APIResource<IServic
     customStyle?: string;
   }[];
   cardMenu: MenuItem[];
-  service$: Observable<EntityInfo<APIResource<IService>> | null>;
+  service$: Observable<APIResource<IService> | null>;
   serviceInstance$: Observable<EntityInfo<APIResource<IServiceInstance | IUserProvidedServiceInstance>>>;
   tags$: Observable<AppChip<IServiceInstance | IUserProvidedServiceInstance>[]>;
   entityConfig: ComponentEntityMonitorConfig;
   private envVarServicesSection$: Observable<string>;
-  private isUserProvidedServiceInstance: boolean;
+  isUserProvidedServiceInstance: boolean;
   serviceDescription$: Observable<string>;
   serviceUrl$: Observable<string>;
   serviceName$: Observable<string>;
 
+  brokerNameConfig: TableCellServiceBrokerComponentConfig = {
+    mode: TableCellServiceBrokerComponentMode.NAME
+  }
+  brokerScopeConfig: TableCellServiceBrokerComponentConfig = {
+    mode: TableCellServiceBrokerComponentMode.SCOPE,
+  }
+
   constructor(
     private dialog: MatDialog,
-    private datePipe: DatePipe,
     private appService: ApplicationService,
     private serviceActionHelperService: ServiceActionHelperService,
     private currentUserPermissionsService: CurrentUserPermissionsService,
@@ -105,11 +113,6 @@ export class AppServiceBindingCardComponent extends CardCell<APIResource<IServic
       this.setupAsServiceInstance();
     }
 
-    this.listData.push({
-      label: 'Date Created On',
-      data$: observableOf(this.datePipe.transform(this.row.metadata.created_at, 'medium'))
-    });
-
     this.tags$ = this.serviceInstance$.pipe(
       filter(o => !!o.entity.entity.tags),
       map(o => o.entity.entity.tags.map(t => ({ value: t })))
@@ -126,7 +129,8 @@ export class AppServiceBindingCardComponent extends CardCell<APIResource<IServic
     this.service$ = serviceInstance$.pipe(
       switchMap(o => cfEntityCatalog.service.store.getEntityService(o.entity.entity.service_guid, this.appService.cfGuid, {})
         .waitForEntity$),
-      filter(service => !!service)
+      filter(service => !!service),
+      map(e => e.entity)
     );
     this.listData = [{
       label: 'Service Plan',
@@ -139,39 +143,19 @@ export class AppServiceBindingCardComponent extends CardCell<APIResource<IServic
           return getServicePlanName(serviceInstance.service_plan.entity);
         })
       )
-    },
-    {
-      label: 'Service Broker',
-      data$: this.serviceInstance$.pipe(
-        switchMap(si => {
-          if (this.isUserProvidedServiceInstance) {
-            return null;
-          }
-          const serviceInstance: IServiceInstance = si.entity.entity as IServiceInstance;
-          return this.service$.pipe(
-            switchMap(service => {
-              return getServiceBrokerName(
-                service.entity.entity.service_broker_guid,
-                serviceInstance.cfGuid,
-              );
-            })
-          );
-        })
-      )
-    },
-    ];
-    this.envVarServicesSection$ = this.service$.pipe(map(s => s.entity.entity.label));
+    }];
+    this.envVarServicesSection$ = this.service$.pipe(map(s => s.entity.label));
 
     this.serviceDescription$ = this.service$.pipe(
-      map(service => service.entity.entity.description)
+      map(service => service.entity.description)
     );
 
     this.serviceUrl$ = this.service$.pipe(
-      map(service => getServiceSummaryUrl(service.entity.entity.cfGuid, service.entity.metadata.guid))
+      map(service => getServiceSummaryUrl(service.entity.cfGuid, service.metadata.guid))
     );
 
     this.serviceName$ = this.service$.pipe(
-      map(service => getServiceName(service.entity))
+      map(service => getServiceName(service))
     );
 
   }

diff --git a/...red/components/list/list-types/cf-services/cf-service-card/cf-service-card.component.html b/...red/components/list/list-types/cf-services/cf-service-card/cf-service-card.component.html
@@ -13,13 +13,19 @@
     </app-meta-card-value>
   </app-meta-card-item>
   <app-meta-card-item>
-    <app-meta-card-key>Service Broker</app-meta-card-key>
+    <app-meta-card-key>Broker</app-meta-card-key>
     <app-meta-card-value>
-      {{ serviceBrokerName$ | async }}
+      <app-table-cell-service-broker [row]="serviceEntity" [config]="brokerNameConfig"></app-table-cell-service-broker>
     </app-meta-card-value>
   </app-meta-card-item>
   <app-meta-card-item>
-    <app-meta-card-key>Service Plans</app-meta-card-key>
+    <app-meta-card-key>Scope</app-meta-card-key>
+    <app-meta-card-value>
+      <app-table-cell-service-broker [row]="serviceEntity" [config]="brokerScopeConfig"></app-table-cell-service-broker>
+    </app-meta-card-value>
+  </app-meta-card-item>
+  <app-meta-card-item>
+    <app-meta-card-key>Plans</app-meta-card-key>
     <app-meta-card-value>
       {{ serviceEntity.entity.service_plans.length }}
     </app-meta-card-value>

diff --git a/...hared/components/list/list-types/cf-services/cf-service-card/cf-service-card.component.ts b/...hared/components/list/list-types/cf-services/cf-service-card/cf-service-card.component.ts
@@ -1,6 +1,5 @@
 import { Component, Input } from '@angular/core';
 import { Store } from '@ngrx/store';
-import { Observable } from 'rxjs';
 
 import { CFAppState } from '../../../../../../../../cloud-foundry/src/cf-app-state';
 import { AppChip } from '../../../../../../../../core/src/shared/components/chips/chips.component';
@@ -9,8 +8,12 @@ import { RouterNav } from '../../../../../../../../store/src/actions/router.acti
 import { EntityServiceFactory } from '../../../../../../../../store/src/entity-service-factory.service';
 import { APIResource } from '../../../../../../../../store/src/types/api.types';
 import { IService, IServiceExtra } from '../../../../../../cf-api-svc.types';
-import { getServiceBrokerName, getServiceName } from '../../../../../../features/service-catalog/services-helper';
+import { getServiceName } from '../../../../../../features/service-catalog/services-helper';
 import { CfOrgSpaceLabelService } from '../../../../../services/cf-org-space-label.service';
+import {
+  TableCellServiceBrokerComponentConfig,
+  TableCellServiceBrokerComponentMode,
+} from '../table-cell-service-broker/table-cell-service-broker.component';
 
 export interface ServiceTag {
   value: string;
@@ -27,7 +30,12 @@ export class CfServiceCardComponent extends CardCell<APIResource<IService>> {
   cfOrgSpace: CfOrgSpaceLabelService;
   extraInfo: IServiceExtra;
   tags: AppChip<ServiceTag>[] = [];
-  serviceBrokerName$: Observable<string>;
+  brokerNameConfig: TableCellServiceBrokerComponentConfig = {
+    mode: TableCellServiceBrokerComponentMode.NAME
+  }
+  brokerScopeConfig: TableCellServiceBrokerComponentConfig = {
+    mode: TableCellServiceBrokerComponentMode.SCOPE
+  }
 
   @Input() disableCardClick = false;
 
@@ -45,13 +53,6 @@ export class CfServiceCardComponent extends CardCell<APIResource<IService>> {
       if (!this.cfOrgSpace) {
         this.cfOrgSpace = new CfOrgSpaceLabelService(this.store, this.serviceEntity.entity.cfGuid);
       }
-
-      if (!this.serviceBrokerName$) {
-        this.serviceBrokerName$ = getServiceBrokerName(
-          this.serviceEntity.entity.service_broker_guid,
-          this.serviceEntity.entity.cfGuid,
-        );
-      }
     }
   }
 

diff --git a/...rc/shared/components/list/list-types/cf-services/cf-service-instances-list-config.base.ts b/...rc/shared/components/list/list-types/cf-services/cf-service-instances-list-config.base.ts
@@ -78,7 +78,7 @@ export class CfServiceInstancesListConfigBase implements IListConfig<APIResource
       columnId: 'service',
       headerCell: () => 'Service',
       cellComponent: TableCellServiceComponent,
-      cellFlex: '2'
+      cellFlex: '3'
     },
     {
       columnId: 'lastOp',
@@ -119,7 +119,7 @@ export class CfServiceInstancesListConfigBase implements IListConfig<APIResource
         orderKey: 'creation',
         field: 'metadata.created_at'
       },
-      cellFlex: '2'
+      cellFlex: '1'
     },
   ];
 

diff --git a/...ndry/src/shared/components/list/list-types/cf-services/cf-services-list-config.service.ts b/...ndry/src/shared/components/list/list-types/cf-services/cf-services-list-config.service.ts
@@ -21,6 +21,10 @@ import { CfServiceCardComponent } from './cf-service-card/cf-service-card.compon
 import { CfServicesDataSource } from './cf-services-data-source';
 import { TableCellServiceActiveComponent } from './table-cell-service-active/table-cell-service-active.component';
 import { TableCellServiceBindableComponent } from './table-cell-service-bindable/table-cell-service-bindable.component';
+import {
+  TableCellServiceBrokerComponent,
+  TableCellServiceBrokerComponentMode,
+} from './table-cell-service-broker/table-cell-service-broker.component';
 import {
   TableCellServiceCfBreadcrumbsComponent,
 } from './table-cell-service-cf-breadcrumbs/table-cell-service-cf-breadcrumbs.component';
@@ -105,10 +109,19 @@ export class CfServicesListConfigService implements IListConfig<APIResource> {
   }, {
     columnId: 'broker',
     headerCell: () => 'Broker',
-    cellDefinition: {
-      valuePath: 'entity.label',
+    cellComponent: TableCellServiceBrokerComponent,
+    cellConfig: {
+      mode: TableCellServiceBrokerComponentMode.NAME
     },
-    cellFlex: '1'
+    cellFlex: '2'
+  }, {
+    columnId: 'brokerScope',
+    headerCell: () => 'Scope',
+    cellComponent: TableCellServiceBrokerComponent,
+    cellConfig: {
+      mode: TableCellServiceBrokerComponentMode.SCOPE
+    },
+    cellFlex: '2'
   }, {
     columnId: 'plans',
     headerCell: () => 'Plans',