Merge pull request #330 from atmire/DS249_Display-subcommunities

DS249:  display subcommunities

resources/i18n/en.json

@@ -22,6 +22,9 @@
     },
     "sub-collection-list": {
       "head": "Collections of this Community"
+    },
+    "sub-community-list": {
+      "head": "Communities of this Community"
     }
   },
   "item": {
@@ -210,6 +213,7 @@
     "community": "Loading community...",
     "collection": "Loading collection...",
     "sub-collections": "Loading sub-collections...",
+    "sub-communities": "Loading sub-communities...",
     "recent-submissions": "Loading recent submissions...",
     "item": "Loading item...",
     "objects": "Loading...",
@@ -222,6 +226,7 @@
     "community": "Error fetching community",
     "collection": "Error fetching collection",
     "sub-collections": "Error fetching sub-collections",
+    "sub-communities": "Error fetching sub-communities",
     "recent-submissions": "Error fetching recent submissions",
     "item": "Error fetching item",
     "objects": "Error fetching objects",

src/app/+community-page/community-page.component.html

@@ -24,6 +24,7 @@
         [content]="communityPayload.copyrightText"
         [hasInnerHtml]="true">
       </ds-comcol-page-content>
+      <ds-community-page-sub-community-list [community]="communityPayload"></ds-community-page-sub-community-list>
       <ds-community-page-sub-collection-list [community]="communityPayload"></ds-community-page-sub-collection-list>
     </div>
   </div>

src/app/+community-page/community-page.module.ts

@@ -6,6 +6,7 @@ import { SharedModule } from '../shared/shared.module';
 import { CommunityPageComponent } from './community-page.component';
 import { CommunityPageSubCollectionListComponent } from './sub-collection-list/community-page-sub-collection-list.component';
 import { CommunityPageRoutingModule } from './community-page-routing.module';
+import {CommunityPageSubCommunityListComponent} from './sub-community-list/community-page-sub-community-list.component';
 
 @NgModule({
   imports: [
@@ -16,6 +17,7 @@ import { CommunityPageRoutingModule } from './community-page-routing.module';
   declarations: [
     CommunityPageComponent,
     CommunityPageSubCollectionListComponent,
+    CommunityPageSubCommunityListComponent,
   ]
 })
 export class CommunityPageModule {

src/app/+community-page/sub-collection-list/community-page-sub-collection-list.component.html

 <ng-container *ngVar="(subCollectionsRDObs | async) as subCollectionsRD">
-  <div *ngIf="subCollectionsRD?.hasSucceeded" @fadeIn>
+  <div *ngIf="subCollectionsRD?.hasSucceeded && subCollectionsRD?.payload.totalElements > 0" @fadeIn>
     <h2>{{'community.sub-collection-list.head' | translate}}</h2>
     <ul>
       <li *ngFor="let collection of subCollectionsRD?.payload.page">

src/app/+community-page/sub-community-list/community-page-sub-community-list.component.html

+<ng-container *ngVar="(subCommunitiesRDObs | async) as subCommunitiesRD">
+  <div *ngIf="subCommunitiesRD?.hasSucceeded && subCommunitiesRD?.payload.totalElements > 0" @fadeIn>
+    <h2>{{'community.sub-community-list.head' | translate}}</h2>
+    <ul>
+      <li *ngFor="let community of subCommunitiesRD?.payload.page">
+        <p>
+          <span class="lead"><a [routerLink]="['/communities', community.id]">{{community.name}}</a></span><br>
+          <span class="text-muted">{{community.shortDescription}}</span>
+        </p>
+      </li>
+    </ul>
+  </div>
+  <ds-error *ngIf="subCommunitiesRD?.hasFailed" message="{{'error.sub-communities' | translate}}"></ds-error>
+  <ds-loading *ngIf="subCommunitiesRD?.isLoading" message="{{'loading.sub-communities' | translate}}"></ds-loading>
+</ng-container>

src/app/+community-page/sub-community-list/community-page-sub-community-list.component.scss

+@import '../../../styles/variables.scss';

src/app/+community-page/sub-community-list/community-page-sub-community-list.component.spec.ts

+import {async, ComponentFixture, TestBed} from '@angular/core/testing';
+import {TranslateModule} from '@ngx-translate/core';
+import {NO_ERRORS_SCHEMA} from '@angular/core';
+import {CommunityPageSubCommunityListComponent} from './community-page-sub-community-list.component';
+import {Community} from '../../core/shared/community.model';
+import {RemoteData} from '../../core/data/remote-data';
+import {PaginatedList} from '../../core/data/paginated-list';
+import {PageInfo} from '../../core/shared/page-info.model';
+import {SharedModule} from '../../shared/shared.module';
+import {RouterTestingModule} from '@angular/router/testing';
+import {NoopAnimationsModule} from '@angular/platform-browser/animations';
+import {By} from '@angular/platform-browser';
+import {of as observableOf,  Observable } from 'rxjs';
+
+describe('SubCommunityList Component', () => {
+  let comp: CommunityPageSubCommunityListComponent;
+  let fixture: ComponentFixture<CommunityPageSubCommunityListComponent>;
+
+  const subcommunities = [Object.assign(new Community(), {
+    name: 'SubCommunity 1',
+    id: '123456789-1',
+    metadata: [
+      {
+        key: 'dc.title',
+        language: 'en_US',
+        value: 'SubCommunity 1'
+      }]
+  }),
+    Object.assign(new Community(), {
+      name: 'SubCommunity 2',
+      id: '123456789-2',
+      metadata: [
+        {
+          key: 'dc.title',
+          language: 'en_US',
+          value: 'SubCommunity 2'
+        }]
+    })
+  ];
+
+  const emptySubCommunitiesCommunity = Object.assign(new Community(), {
+    metadata: [
+      {
+        key: 'dc.title',
+        language: 'en_US',
+        value: 'Test title'
+      }],
+    subcommunities: observableOf(new RemoteData(true, true, true,
+      undefined, new PaginatedList(new PageInfo(), [])))
+  });
+
+  const mockCommunity = Object.assign(new Community(), {
+      metadata: [
+        {
+          key: 'dc.title',
+          language: 'en_US',
+          value: 'Test title'
+        }],
+      subcommunities: observableOf(new RemoteData(true, true, true,
+        undefined, new PaginatedList(new PageInfo(), subcommunities)))
+    })
+  ;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot(), SharedModule,
+        RouterTestingModule.withRoutes([]),
+        NoopAnimationsModule],
+      declarations: [CommunityPageSubCommunityListComponent],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(CommunityPageSubCommunityListComponent);
+    comp = fixture.componentInstance;
+  });
+
+  it('should display a list of subCommunities', () => {
+    comp.community = mockCommunity;
+    fixture.detectChanges();
+
+    const subComList = fixture.debugElement.queryAll(By.css('li'));
+    expect(subComList.length).toEqual(2);
+    expect(subComList[0].nativeElement.textContent).toContain('SubCommunity 1');
+    expect(subComList[1].nativeElement.textContent).toContain('SubCommunity 2');
+  });
+
+  it('should not display the header when subCommunities are empty', () => {
+    comp.community = emptySubCommunitiesCommunity;
+    fixture.detectChanges();
+
+    const subComHead = fixture.debugElement.queryAll(By.css('h2'));
+    expect(subComHead.length).toEqual(0);
+  });
+});

src/app/+community-page/sub-community-list/community-page-sub-community-list.component.ts

+import { Component, Input, OnInit } from '@angular/core';
+
+import { RemoteData } from '../../core/data/remote-data';
+import { Community } from '../../core/shared/community.model';
+
+import { fadeIn } from '../../shared/animations/fade';
+import { PaginatedList } from '../../core/data/paginated-list';
+import {Observable} from 'rxjs';
+
+@Component({
+  selector: 'ds-community-page-sub-community-list',
+  styleUrls: ['./community-page-sub-community-list.component.scss'],
+  templateUrl: './community-page-sub-community-list.component.html',
+  animations:[fadeIn]
+})
+/**
+ * Component to render the sub-communities of a Community
+ */
+export class CommunityPageSubCommunityListComponent implements OnInit {
+  @Input() community: Community;
+  subCommunitiesRDObs: Observable<RemoteData<PaginatedList<Community>>>;
+
+  ngOnInit(): void {
+    this.subCommunitiesRDObs = this.community.subcommunities;
+  }
+}

src/app/core/shared/community.model.ts

@@ -61,6 +61,6 @@ export class Community extends DSpaceObject {
 
   collections: Observable<RemoteData<PaginatedList<Collection>>>;
 
-  subcommunities: Observable<RemoteData<PaginatedList<Collection>>>;
+  subcommunities: Observable<RemoteData<PaginatedList<Community>>>;
 
 }