Merge pull request #3560 from cloudfoundry-incubator/show-cf-marketplace

marketplace: cf endpoint on card when multiple cf connected

src/frontend/packages/core/src/shared/components/add-service-instance/add-service-instance/add-service-instance.component.spec.ts

@@ -44,6 +44,7 @@ import {
   SpecifyUserProvidedDetailsComponent,
 } from '../specify-user-provided-details/specify-user-provided-details.component';
 import { AddServiceInstanceComponent } from './add-service-instance.component';
+import { CfOrgSpaceLinksComponent } from '../../cf-org-space-links/cf-org-space-links.component';
 
 describe('AddServiceInstanceComponent', () => {
   let component: AddServiceInstanceComponent;
@@ -62,6 +63,7 @@ describe('AddServiceInstanceComponent', () => {
         CardStatusComponent,
         MetadataItemComponent,
         CfServiceCardComponent,
+        CfOrgSpaceLinksComponent,
         MetaCardComponent,
         ServiceIconComponent,
         MetaCardTitleComponent,

src/frontend/packages/core/src/shared/components/add-service-instance/select-service/select-service.component.spec.ts

@@ -22,6 +22,7 @@ import { ServiceIconComponent } from '../../service-icon/service-icon.component'
 import { CsiGuidsService } from '../csi-guids.service';
 import { SelectServiceComponent } from './select-service.component';
 import { MultilineTitleComponent } from '../../multiline-title/multiline-title.component';
+import { CfOrgSpaceLinksComponent } from '../../cf-org-space-links/cf-org-space-links.component';
 
 describe('SelectServiceComponent', () => {
   let component: SelectServiceComponent;
@@ -31,6 +32,7 @@ describe('SelectServiceComponent', () => {
     TestBed.configureTestingModule({
       declarations: [
         SelectServiceComponent,
+        CfOrgSpaceLinksComponent,
         CardStatusComponent,
         CfServiceCardComponent,
         MetaCardComponent,

src/frontend/packages/core/src/shared/components/cf-org-space-links/cf-org-space-links.component.html

@@ -1,5 +1,11 @@
 <ng-container *ngIf="service?.multipleConnectedEndpoints$ | async">
-  <a [routerLink]="service?.getCfURL()">{{ service?.getCfName() | async }}</a> /
+  <a [routerLink]="service?.getCfURL()">{{ service?.getCfName() | async }}</a>
+  <span *ngIf="service?.getOrgName() | async"> / </span>
 </ng-container>
-<a [routerLink]="service?.getOrgURL()">{{ service?.getOrgName() | async}}</a> /
-<a [routerLink]="service?.getSpaceURL()" [queryParams]="spaceBreadCrumbs">{{ service?.getSpaceName()  | async}}</a>
+<ng-container *ngIf="service?.getOrgName() | async">
+  <a [routerLink]="service?.getOrgURL()">{{ service?.getOrgName() | async}}</a>
+  <span *ngIf="service?.getSpaceName() | async"> / </span>
+</ng-container>
+<ng-container *ngIf="service?.getSpaceName() | async">
+  <a [routerLink]="service?.getSpaceURL()" [queryParams]="spaceBreadCrumbs">{{ service?.getSpaceName()  | async}}</a>
+</ng-container>

src/frontend/packages/core/src/shared/components/cf-org-space-links/cf-org-space-links.component.spec.ts

@@ -3,11 +3,14 @@ import { RouterTestingModule } from '@angular/router/testing';
 
 import { createBasicStoreModule } from '../../../../test-framework/store-test-helper';
 import { CfOrgSpaceLinksComponent } from './cf-org-space-links.component';
+import { of } from 'rxjs';
+import { CfOrgSpaceLabelService } from '../../services/cf-org-space-label.service';
 
 
 describe('CfOrgSpaceLinksComponent', () => {
   let component: CfOrgSpaceLinksComponent;
   let fixture: ComponentFixture<CfOrgSpaceLinksComponent>;
+  let service;
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
@@ -21,12 +24,45 @@ describe('CfOrgSpaceLinksComponent', () => {
   }));
 
   beforeEach(() => {
+    service = jasmine.createSpyObj<CfOrgSpaceLabelService>('CfOrgSpaceLabelService', [
+      'getCfName',
+      'getCfURL',
+      'getOrgName',
+      'getOrgURL',
+      'getSpaceName',
+      'getSpaceURL'
+    ]);
+    service.multipleConnectedEndpoints$ = of(false);
+    service.getCfName.and.returnValue(of('CfName'));
+    service.getCfURL.and.returnValue(['/cf/path']);
+    service.getOrgName.and.returnValue(of('OrgName'));
+    service.getOrgURL.and.returnValue(['/org/path']);
+    service.getSpaceName.and.returnValue(of('SpaceName'));
+    service.getSpaceURL.and.returnValue(['/space/path']);
     fixture = TestBed.createComponent(CfOrgSpaceLinksComponent);
     component = fixture.componentInstance;
+    component.service = service;
     fixture.detectChanges();
   });
 
   it('should create', () => {
     expect(component).toBeTruthy();
   });
+
+  it('should render only org and space', () => {
+    const element: HTMLElement = fixture.nativeElement;
+    expect(element.textContent).toEqual('OrgName / SpaceName');
+  });
+
+  describe('with multiple endpoints', () => {
+    beforeEach(() => {
+      service.multipleConnectedEndpoints$ = of(true);
+      fixture.detectChanges();
+    });
+
+    it('should render cf if multiple', () => {
+      const element: HTMLElement = fixture.nativeElement;
+      expect(element.textContent).toEqual('CfName / OrgName / SpaceName');
+    });
+  });
 });

src/frontend/packages/core/src/shared/components/list/list-types/cf-services/cf-service-card/cf-service-card.component.html

@@ -55,6 +55,13 @@
     <app-meta-card-key>Provider</app-meta-card-key>
     <app-meta-card-value>{{ extraInfo?.providerDisplayName }}</app-meta-card-value>
   </app-meta-card-item>
+  <app-meta-card-item *ngIf="cfOrgSpace.multipleConnectedEndpoints$ | async">
+    <app-meta-card-key>CF Endpoint</app-meta-card-key>
+    <app-meta-card-value>
+      <app-cf-org-space-links [service]="cfOrgSpace" [spaceBreadCrumbs]="getSpaceBreadcrumbs()">
+      </app-cf-org-space-links>
+    </app-meta-card-value>
+  </app-meta-card-item>
   <app-meta-card-item customStyle="column">
     <app-meta-card-key>Tags</app-meta-card-key>
     <app-meta-card-value>

src/frontend/packages/core/src/shared/components/list/list-types/cf-services/cf-service-card/cf-service-card.component.spec.ts

@@ -9,6 +9,7 @@ import { AppChipsComponent } from '../../../../chips/chips.component';
 import { ServiceIconComponent } from '../../../../service-icon/service-icon.component';
 import { CfServiceCardComponent } from './cf-service-card.component';
 import { EntityMonitorFactory } from '../../../../../monitors/entity-monitor.factory.service';
+import { CfOrgSpaceLinksComponent } from '../../../../cf-org-space-links/cf-org-space-links.component';
 
 describe('CfServiceCardComponent', () => {
   let component: CfServiceCardComponent;
@@ -18,6 +19,7 @@ describe('CfServiceCardComponent', () => {
     TestBed.configureTestingModule({
       declarations: [
         CfServiceCardComponent,
+        CfOrgSpaceLinksComponent,
         MetadataCardTestComponents,
         BooleanIndicatorComponent,
         AppChipsComponent,

src/frontend/packages/core/src/shared/components/list/list-types/cf-services/cf-service-card/cf-service-card.component.ts

@@ -9,6 +9,7 @@ import { CardCell } from '../../../list.types';
 import { APIResource } from '../../../../../../../../store/src/types/api.types';
 import { AppState } from '../../../../../../../../store/src/app-state';
 import { RouterNav } from '../../../../../../../../store/src/actions/router.actions';
+import { CfOrgSpaceLabelService } from '../../../../../services/cf-org-space-label.service';
 
 export interface ServiceTag {
   value: string;
@@ -20,8 +21,11 @@ export interface ServiceTag {
   styleUrls: ['./cf-service-card.component.scss']
 })
 export class CfServiceCardComponent extends CardCell<APIResource<IService>> {
-
   serviceEntity: APIResource<IService>;
+  cfOrgSpace: CfOrgSpaceLabelService;
+  extraInfo: IServiceExtra;
+  tags: AppChip<ServiceTag>[] = [];
+
   @Input() disableCardClick = false;
 
   @Input('row')
@@ -40,12 +44,13 @@ export class CfServiceCardComponent extends CardCell<APIResource<IService>> {
           hideClearButton$: observableOf(true)
         });
       });
+
+      if (!this.cfOrgSpace) {
+        this.cfOrgSpace = new CfOrgSpaceLabelService(this.store, this.serviceEntity.entity.cfGuid);
+      }
     }
   }
 
-
-  extraInfo: IServiceExtra;
-  tags: AppChip<ServiceTag>[] = [];
   constructor(private store: Store<AppState>) {
     super();
   }
@@ -57,7 +62,6 @@ export class CfServiceCardComponent extends CardCell<APIResource<IService>> {
     return this.serviceEntity.entity.label;
   }
 
-
   hasDocumentationUrl() {
     return !!(this.getDocumentationUrl());
   }
@@ -68,10 +72,13 @@ export class CfServiceCardComponent extends CardCell<APIResource<IService>> {
   hasSupportUrl() {
     return !!(this.getSupportUrl());
   }
+
   getSupportUrl() {
     return this.extraInfo && this.extraInfo.supportUrl;
   }
 
+  getSpaceBreadcrumbs = () => ({ breadcrumbs: 'services-wall' });
+
   goToServiceInstances = () =>
     this.store.dispatch(new RouterNav({
       path: ['marketplace', this.serviceEntity.entity.cfGuid, this.serviceEntity.metadata.guid]