added crude first recent items list to collection hompage - needs refactoring

resources/i18n/en.json

@@ -7,7 +7,12 @@
   "collection": {
     "page": {
       "news": "News",
-      "license": "License"
+      "license": "License",
+      "browse": {
+        "recent": {
+          "head": "Recent Submissions"
+        }
+      }
     }
   },
   "community": {

src/app/collection-page/collection-page.component.html

@@ -1,32 +1,44 @@
-<div class="collection-page" *ngIf="collectionData.hasSucceeded | async">
-  <!-- Collection Name -->
-  <ds-comcol-page-header 
-        [name]="(collectionData.payload | async)?.name">
-  </ds-comcol-page-header>
-  <!-- Collection logo -->
-  <ds-comcol-page-logo *ngIf="logoData" 
-      [logo]="logoData.payload | async"
-      [alternateText]="'Collection Logo'">
-  </ds-comcol-page-logo>
-  <!-- Introductionary text -->
-  <ds-comcol-page-content
+<div class="collection-page">
+  <div *ngIf="collectionData.hasSucceeded | async">
+    <!-- Collection Name -->
+    <ds-comcol-page-header
+      [name]="(collectionData.payload | async)?.name">
+    </ds-comcol-page-header>
+    <!-- Collection logo -->
+    <ds-comcol-page-logo *ngIf="logoData"
+                         [logo]="logoData.payload | async"
+                         [alternateText]="'Collection Logo'">
+    </ds-comcol-page-logo>
+    <!-- Introductionary text -->
+    <ds-comcol-page-content
       [content]="(collectionData.payload | async)?.introductoryText"
       [hasInnerHtml]="true">
-  </ds-comcol-page-content>
-  <!-- News -->
-  <ds-comcol-page-content
+    </ds-comcol-page-content>
+    <!-- News -->
+    <ds-comcol-page-content
       [content]="(collectionData.payload | async)?.sidebarText"
       [hasInnerHtml]="true"
       [title]="'community.page.news'">
-  </ds-comcol-page-content>
-  <!-- Copyright -->
-  <ds-comcol-page-content
+    </ds-comcol-page-content>
+    <!-- Copyright -->
+    <ds-comcol-page-content
       [content]="(collectionData.payload | async)?.copyrightText"
       [hasInnerHtml]="true">
-  </ds-comcol-page-content>
-  <!-- Licence -->
-  <ds-comcol-page-content
+    </ds-comcol-page-content>
+    <!-- Licence -->
+    <ds-comcol-page-content
       [content]="(collectionData.payload | async)?.license"
       [title]="'collection.page.license'">
-  </ds-comcol-page-content>
+    </ds-comcol-page-content>
+  </div>
+  <br>
+  <div *ngIf="itemData.hasSucceeded | async">
+    <h2>{{'collection.page.browse.recent.head' | translate}}</h2>
+    <ds-object-list [config]="config" [sortConfig]="sortConfig"
+                    [objects]="itemData" [hideGear]="true"
+                    (pageChange)="onPageChange($event)"
+                    (pageSizeChange)="onPageSizeChange($event)"
+                    (sortDirectionChange)="onSortDirectionChange($event)"
+                    (sortFieldChange)="onSortDirectionChange($event)"></ds-object-list>
+  </div>
 </div>

src/app/collection-page/collection-page.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnDestroy, OnInit } from '@angular/core';
+import { ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core';
 import { ActivatedRoute, Params } from '@angular/router';
 
 import { Collection } from "../core/shared/collection.model";
@@ -6,6 +6,11 @@ import { Bitstream } from "../core/shared/bitstream.model";
 import { RemoteData } from "../core/data/remote-data";
 import { CollectionDataService } from "../core/data/collection-data.service";
 import { Subscription } from "rxjs/Subscription";
+import { ItemDataService } from "../core/data/item-data.service";
+import { Item } from "../core/shared/item.model";
+import { SortOptions, SortDirection } from "../core/cache/models/sort-options.model";
+import { PaginationComponentOptions } from "../shared/pagination/pagination-component-options.model";
+import { Observable } from "rxjs/Observable";
 
 @Component({
   selector: 'ds-collection-page',
@@ -14,22 +19,39 @@ import { Subscription } from "rxjs/Subscription";
 })
 export class CollectionPageComponent implements OnInit, OnDestroy {
   collectionData: RemoteData<Collection>;
+  itemData: RemoteData<Item[]>;
   logoData: RemoteData<Bitstream>;
+  config : PaginationComponentOptions;
+  sortConfig : SortOptions;
   private subs: Subscription[] = [];
+  private collectionId: string;
 
   constructor(
     private collectionDataService: CollectionDataService,
+    private itemDataService: ItemDataService,
+    private ref: ChangeDetectorRef,
     private route: ActivatedRoute
   ) {
     this.universalInit();
   }
 
   ngOnInit(): void {
-    this.route.params.subscribe((params: Params) => {
-      this.collectionData = this.collectionDataService.findById(params['id']);
-      this.subs.push(this.collectionData.payload
-        .subscribe(collection => this.logoData = collection.logo));
-    });
+    this.subs.push(this.route.params.map((params: Params) => params['id'] )
+      .subscribe((id: string) => {
+        this.collectionId = id;
+        this.collectionData = this.collectionDataService.findById(this.collectionId);
+        this.subs.push(this.collectionData.payload
+          .subscribe(collection => this.logoData = collection.logo));
+
+        this.config = new PaginationComponentOptions();
+        this.config.id = "collection-browse";
+        this.config.pageSizeOptions = [ 5, 10, 20, 40, 60, 80, 100 ];
+        this.config.pageSize = 4;
+        this.sortConfig =  new SortOptions();
+
+        this.updateResults();
+      }));
+
   }
 
   ngOnDestroy(): void {
@@ -38,4 +60,35 @@ export class CollectionPageComponent implements OnInit, OnDestroy {
 
   universalInit() {
   }
+
+  onPageChange(currentPage: number): void {
+    this.config.currentPage = currentPage;
+    this.updateResults();
+  }
+
+  onPageSizeChange(elementsPerPage: number): void {
+    this.config.pageSize = elementsPerPage;
+    this.updateResults();
+  }
+
+  onSortDirectionChange(sortDirection: SortDirection): void {
+    this.sortConfig = new SortOptions(this.sortConfig.field, sortDirection);
+    this.updateResults();
+  }
+
+  onSortFieldChange(field: string): void {
+    this.sortConfig = new SortOptions(field, this.sortConfig.direction);
+    this.updateResults();
+  }
+
+  updateResults() {
+    this.itemData = undefined;
+    this.itemData = this.itemDataService.findAll({
+      scopeID: this.collectionId,
+      currentPage: this.config.currentPage,
+      elementsPerPage: this.config.pageSize,
+      sort: this.sortConfig
+    });
+    this.ref.detectChanges();
+  }
 }

src/app/core/data/collection-data.service.ts

@@ -12,7 +12,8 @@ import { GLOBAL_CONFIG, GlobalConfig } from "../../../config";
 
 @Injectable()
 export class CollectionDataService extends DataService<NormalizedCollection, Collection> {
-  protected endpoint = '/core/collections';
+  protected resourceEndpoint = '/core/collections';
+  protected browseEndpoint = '/discover/browses/dateissued/collections';
 
   constructor(
     protected objectCache: ObjectCacheService,

src/app/core/data/community-data.service.ts

@@ -12,7 +12,8 @@ import { GLOBAL_CONFIG, GlobalConfig } from "../../../config";
 
 @Injectable()
 export class CommunityDataService extends DataService<NormalizedCommunity, Community> {
-  protected endpoint = '/core/communities';
+  protected resourceEndpoint = '/core/communities';
+  protected browseEndpoint = '/discover/browses/dateissued/communities';
 
   constructor(
     protected objectCache: ObjectCacheService,

src/app/core/data/data.service.ts

@@ -20,7 +20,8 @@ export abstract class DataService<TNormalized extends CacheableObject, TDomain>
   protected abstract requestService: RequestService;
   protected abstract rdbService: RemoteDataBuildService;
   protected abstract store: Store<CoreState>;
-  protected abstract endpoint: string;
+  protected abstract resourceEndpoint: string;
+  protected abstract browseEndpoint: string;
 
   constructor(
     private normalizedResourceType: GenericConstructor<TNormalized>,
@@ -30,12 +31,16 @@ export abstract class DataService<TNormalized extends CacheableObject, TDomain>
   }
 
   protected getFindAllHref(options: FindAllOptions = {}): string {
-    let result = this.endpoint;
+    let result;
     let args = [];
 
     if (hasValue(options.scopeID)) {
+      result = this.browseEndpoint;
       args.push(`scope=${options.scopeID}`);
     }
+    else {
+      result = this.resourceEndpoint;
+    }
 
     if (hasValue(options.currentPage) && typeof options.currentPage === "number") {
       /* TODO: this is a temporary fix for the pagination start index (0 or 1) discrepancy between the rest and the frontend respectively */
@@ -69,7 +74,7 @@ export abstract class DataService<TNormalized extends CacheableObject, TDomain>
   }
 
   protected getFindByIDHref(resourceID): string {
-    return new RESTURLCombiner(this.EnvConfig, `${this.endpoint}/${resourceID}`).toString();
+    return new RESTURLCombiner(this.EnvConfig, `${this.resourceEndpoint}/${resourceID}`).toString();
   }
 
   findById(id: string): RemoteData<TDomain> {

src/app/core/data/item-data.service.ts

@@ -12,7 +12,8 @@ import { GLOBAL_CONFIG, GlobalConfig } from "../../../config";
 
 @Injectable()
 export class ItemDataService extends DataService<NormalizedItem, Item> {
-  protected endpoint = '/core/items';
+  protected resourceEndpoint = '/core/items';
+  protected browseEndpoint = '/discover/browses/dateissued/items';
 
   constructor(
     protected objectCache: ObjectCacheService,

src/app/home/home.module.ts

@@ -7,11 +7,6 @@ import { TopLevelCommunityListComponent } from "./top-level-community-list/top-l
 import { HomeNewsComponent } from "./home-news/home-news.component";
 import { RouterModule } from "@angular/router";
 import { TranslateModule } from "@ngx-translate/core";
-import { ObjectListComponent } from "../object-list/object-list.component";
-import { ObjectListElementComponent } from "../object-list/object-list-element/object-list-element.component";
-import { ItemListElementComponent } from "../object-list/item-list-element/item-list-element.component";
-import { CollectionListElementComponent } from "../object-list/collection-list-element/collection-list-element.component";
-import { CommunityListElementComponent } from "../object-list/community-list-element/community-list-element.component";
 import { SharedModule } from "../shared/shared.module";
 
 @NgModule({
@@ -25,12 +20,7 @@ import { SharedModule } from "../shared/shared.module";
   declarations: [
     HomeComponent,
     TopLevelCommunityListComponent,
-    HomeNewsComponent,
-    ObjectListComponent,
-    ObjectListElementComponent,
-    ItemListElementComponent,
-    CollectionListElementComponent,
-    CommunityListElementComponent
+    HomeNewsComponent
   ]
 })
 export class HomeModule { }

src/app/object-list/item-list-element/item-list-element.component.html

@@ -1,12 +1,14 @@
 <a [routerLink]="['/items/' + item.id]" class="lead">
     {{item.findMetadata("dc.title")}}
 </a>
-<div class="text-muted">
+<div>
+  <span class="text-muted">
     <span *ngIf="item.filterMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*']);" class="item-list-authors">
         <span *ngFor="let authorMd of item.filterMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*']); let last=last;">{{authorMd.value}}
             <span *ngIf="!last">; </span>
         </span>
     </span>
     (<span *ngIf="item.findMetadata('dc.publisher')" class="item-list-publisher">{{item.findMetadata("dc.publisher")}}, </span><span *ngIf="item.findMetadata('dc.date.issued')" class="item-list-date">{{item.findMetadata("dc.date.issued")}}</span>)
-    <div *ngIf="item.findMetadata('dc.description.abstract')" class="item-list-abstract">{{item.findMetadata("dc.description.abstract") | words : 35 : "..."}}</div>
+  </span>
+  <div *ngIf="item.findMetadata('dc.description.abstract')" class="item-list-abstract">{{item.findMetadata("dc.description.abstract") | words : 35 : "..."}}</div>
 </div>

src/app/shared/object-list/object-list.component.ts

@@ -2,21 +2,21 @@ import {
     Component, Input, ViewEncapsulation, ChangeDetectionStrategy,
     OnInit, Output
 } from '@angular/core';
-import { RemoteData } from "../core/data/remote-data";
-import { DSpaceObject } from "../core/shared/dspace-object.model";
-import { PageInfo } from "../core/shared/page-info.model";
+import { RemoteData } from "../../core/data/remote-data";
+import { DSpaceObject } from "../../core/shared/dspace-object.model";
+import { PageInfo } from "../../core/shared/page-info.model";
 import { Observable } from "rxjs";
-import { PaginationComponentOptions } from "../shared/pagination/pagination-component-options.model";
+import { PaginationComponentOptions } from "../pagination/pagination-component-options.model";
 import { EventEmitter } from "@angular/common/src/facade/async";
-import { SortOptions, SortDirection } from "../core/cache/models/sort-options.model";
+import { SortOptions, SortDirection } from "../../core/cache/models/sort-options.model";
 
 
 @Component({
     changeDetection: ChangeDetectionStrategy.Default,
     encapsulation: ViewEncapsulation.Emulated,
     selector: 'ds-object-list',
-    styleUrls: ['./object-list.component.css'],
-    templateUrl: './object-list.component.html'
+    styleUrls: ['../../object-list/object-list.component.css'],
+    templateUrl: '../../object-list/object-list.component.html'
 })
 export class ObjectListComponent implements OnInit {
 

src/app/shared/pagination/pagination.component.spec.ts

@@ -31,6 +31,8 @@ import { MockTranslateLoader } from "../testing/mock-translate-loader";
 import { GLOBAL_CONFIG, EnvConfig } from '../../../config';
 import { ActivatedRouteStub, RouterStub } from "../testing/router-stubs";
 import { HostWindowService } from "../host-window.service";
+import { EnumKeysPipe } from "../utils/enum-keys-pipe";
+import { SortOptions } from "../../core/cache/models/sort-options.model";
 
 
 function createTestComponent<T>(html: string, type: {new (...args: any[]): T}): ComponentFixture<T> {
@@ -138,7 +140,7 @@ describe('Pagination component', () => {
         RouterTestingModule.withRoutes([
           {path: 'home', component: TestComponent}
         ])],
-      declarations: [PaginationComponent, TestComponent], // declare the test component
+      declarations: [PaginationComponent, TestComponent, EnumKeysPipe], // declare the test component
       providers: [
         { provide: ActivatedRoute, useValue: activatedRouteStub },
         { provide: GLOBAL_CONFIG, useValue: EnvConfig },
@@ -156,6 +158,7 @@ describe('Pagination component', () => {
     html = `
     <ds-pagination #p="paginationComponent"
                    [paginationOptions]="paginationOptions" 
+                   [sortOptions]="sortOptions"
                    [collectionSize]="collectionSize" 
                    (pageChange)="pageChanged($event)"
                    (pageSizeChange)="pageSizeChanged($event)">
@@ -247,12 +250,12 @@ describe('Pagination component', () => {
 
     changePage(testFixture, 3);
     tick();
-    expect(routerStub.navigate).toHaveBeenCalledWith([], { queryParams: { pageId: 'test', page: 3, pageSize: 10 } });
+    expect(routerStub.navigate).toHaveBeenCalledWith([], { queryParams: { pageId: 'test', page: 3, pageSize: 10, sortDirection: 0, sortField: 'name' } });
     expect(paginationComponent.currentPage).toEqual(3);
 
     changePageSize(testFixture, '20');
     tick();
-    expect(routerStub.navigate).toHaveBeenCalledWith([], { queryParams: { pageId: 'test', page: 3, pageSize: 20 } });
+    expect(routerStub.navigate).toHaveBeenCalledWith([], { queryParams: { pageId: 'test', page: 3, pageSize: 20, sortDirection: 0, sortField: 'name' } });
     expect(paginationComponent.pageSize).toEqual(20);
   }));
 
@@ -308,6 +311,7 @@ class TestComponent {
   collection: string[] = [];
   collectionSize: number;
   paginationOptions = new PaginationComponentOptions();
+  sortOptions = new SortOptions();
 
   constructor() {
     this.collection = Array.from(new Array(100), (x, i) => `item ${i + 1}`);

src/app/shared/pagination/pagination.component.ts

@@ -19,6 +19,7 @@ import { HostWindowService } from "../host-window.service";
 import { HostWindowState } from "../host-window.reducer";
 import { PaginationComponentOptions } from './pagination-component-options.model';
 import { SortDirection, SortOptions } from "../../core/cache/models/sort-options.model";
+import { hasValue } from "../empty.util";
 
 /**
  * The default pagination controls component.
@@ -173,7 +174,7 @@ export class PaginationComponent implements OnDestroy, OnInit {
         this.sortDirection = this.sortOptions.direction;
         this.sortField = this.sortOptions.field;
         this.routeSubscription = this.route.queryParams
-            .map(queryParams => queryParams)
+            .filter(queryParams => hasValue(queryParams))
             .subscribe(queryParams => {
                 this.currentQueryParams = queryParams;
                 if (this.id == queryParams['pageId']

src/app/shared/shared.module.ts

@@ -19,6 +19,11 @@ import { ComcolPageHeaderComponent } from "./comcol-page-header/comcol-page-head
 import { ComcolPageLogoComponent } from "./comcol-page-logo/comcol-page-logo.component";
 import { TRUNCATE_PIPES } from "ng2-truncate";
 import { EnumKeysPipe } from "./utils/enum-keys-pipe";
+import { ObjectListComponent } from "./object-list/object-list.component";
+import { ObjectListElementComponent } from "../object-list/object-list-element/object-list-element.component";
+import { ItemListElementComponent } from "../object-list/item-list-element/item-list-element.component";
+import { CommunityListElementComponent } from "../object-list/community-list-element/community-list-element.component";
+import { CollectionListElementComponent } from "../object-list/collection-list-element/collection-list-element.component";
 
 const MODULES = [
   // Do NOT include UniversalModule, HttpModule, or JsonpModule here
@@ -45,7 +50,12 @@ const COMPONENTS = [
   ThumbnailComponent,
   ComcolPageContentComponent,
   ComcolPageHeaderComponent,
-  ComcolPageLogoComponent
+  ComcolPageLogoComponent,
+  ObjectListComponent,
+  ObjectListElementComponent,
+  ItemListElementComponent,
+  CollectionListElementComponent,
+  CommunityListElementComponent
 ];
 
 const PROVIDERS = [