Merge pull request #1803 from mark-cooper/browse-comm-lists-configurable

Make no. of communities per pagination / expansion configurable

config/config.example.yml

@@ -175,6 +175,21 @@ browseBy:
   # The absolute lowest year to display in the dropdown (only used when no lowest date can be found for all items)
   defaultLowerLimit: 1900
 
+communityList:
+  # No. of communities to list per expansion (show more)
+  pageSize: 20
+
+homePage:
+  recentSubmissions:
+    # The number of item showing in recent submission components
+    pageSize: 5
+    # Sort record of recent submission
+    sortField: 'dc.date.accessioned'
+  topLevelCommunityList:
+    # No. of communities to list per page on the home page
+    # This will always round to the nearest number from the list of page sizes. e.g. if you set it to 7 it'll use 10
+    pageSize: 5
+
 # Item Config
 item:
   edit:
@@ -264,10 +279,3 @@ mediaViewer:
 info:
   enableEndUserAgreement: true
   enablePrivacyStatement: true
-# Home Page
-homePage:
-  recentSubmissions:
-	# The number of item showing in recent submission components
-      pageSize: 5
-	# Sort record of recent submission
-      sortField: 'dc.date.accessioned'

src/app/community-list-page/community-list-service.spec.ts

@@ -15,6 +15,8 @@ import { Collection } from '../core/shared/collection.model';
 import { PageInfo } from '../core/shared/page-info.model';
 import { FlatNode } from './flat-node.model';
 import { FindListOptions } from '../core/data/find-list-options.model';
+import { APP_CONFIG } from 'src/config/app-config.interface';
+import { environment } from 'src/environments/environment.test';
 
 describe('CommunityListService', () => {
   let store: StoreMock<AppState>;
@@ -191,13 +193,14 @@ describe('CommunityListService', () => {
     };
     TestBed.configureTestingModule({
       providers: [CommunityListService,
+        { provide: APP_CONFIG, useValue: environment },
         { provide: CollectionDataService, useValue: collectionDataServiceStub },
         { provide: CommunityDataService, useValue: communityDataServiceStub },
         { provide: Store, useValue: StoreMock },
       ],
     });
     store = TestBed.inject(Store as any);
-    service = new CommunityListService(communityDataServiceStub, collectionDataServiceStub, store);
+    service = new CommunityListService(environment, communityDataServiceStub, collectionDataServiceStub, store);
   });
 
   it('should create', inject([CommunityListService], (serviceIn: CommunityListService) => {

src/app/community-list-page/community-list-service.ts

@@ -1,5 +1,5 @@
 /* eslint-disable max-classes-per-file */
-import { Injectable } from '@angular/core';
+import { Inject, Injectable } from '@angular/core';
 import { createSelector, Store } from '@ngrx/store';
 
 import { combineLatest as observableCombineLatest, Observable, of as observableOf } from 'rxjs';
@@ -23,6 +23,7 @@ import { followLink } from '../shared/utils/follow-link-config.model';
 import { FlatNode } from './flat-node.model';
 import { ShowMoreFlatNode } from './show-more-flat-node.model';
 import { FindListOptions } from '../core/data/find-list-options.model';
+import { AppConfig, APP_CONFIG } from 'src/config/app-config.interface';
 
 // Helper method to combine an flatten an array of observables of flatNode arrays
 export const combineAndFlatten = (obsList: Observable<FlatNode[]>[]): Observable<FlatNode[]> =>
@@ -80,8 +81,6 @@ const communityListStateSelector = (state: AppState) => state.communityList;
 const expandedNodesSelector = createSelector(communityListStateSelector, (communityList: CommunityListState) => communityList.expandedNodes);
 const loadingNodeSelector = createSelector(communityListStateSelector, (communityList: CommunityListState) => communityList.loadingNode);
 
-export const MAX_COMCOLS_PER_PAGE = 20;
-
 /**
  * Service class for the community list, responsible for the creating of the flat list used by communityList dataSource
  *  and connection to the store to retrieve and save the state of the community list
@@ -89,8 +88,15 @@ export const MAX_COMCOLS_PER_PAGE = 20;
 @Injectable()
 export class CommunityListService {
 
-  constructor(private communityDataService: CommunityDataService, private collectionDataService: CollectionDataService,
-              private store: Store<any>) {
+  private pageSize: number;
+
+  constructor(
+    @Inject(APP_CONFIG) protected appConfig: AppConfig,
+    private communityDataService: CommunityDataService,
+    private collectionDataService: CollectionDataService,
+    private store: Store<any>
+  ) {
+    this.pageSize = appConfig.communityList.pageSize;
   }
 
   private configOnePage: FindListOptions = Object.assign(new FindListOptions(), {
@@ -145,7 +151,7 @@ export class CommunityListService {
   private getTopCommunities(options: FindListOptions): Observable<PaginatedList<Community>> {
     return this.communityDataService.findTop({
         currentPage: options.currentPage,
-        elementsPerPage: MAX_COMCOLS_PER_PAGE,
+        elementsPerPage: this.pageSize,
         sort: {
           field: options.sort.field,
           direction: options.sort.direction
@@ -216,7 +222,7 @@ export class CommunityListService {
       let subcoms = [];
       for (let i = 1; i <= currentCommunityPage; i++) {
         const nextSetOfSubcommunitiesPage = this.communityDataService.findByParent(community.uuid, {
-            elementsPerPage: MAX_COMCOLS_PER_PAGE,
+            elementsPerPage: this.pageSize,
             currentPage: i
           },
           followLink('subcommunities', { findListOptions: this.configOnePage }),
@@ -241,7 +247,7 @@ export class CommunityListService {
       let collections = [];
       for (let i = 1; i <= currentCollectionPage; i++) {
         const nextSetOfCollectionsPage = this.collectionDataService.findByParent(community.uuid, {
-          elementsPerPage: MAX_COMCOLS_PER_PAGE,
+          elementsPerPage: this.pageSize,
           currentPage: i
         })
           .pipe(

src/app/home-page/top-level-community-list/top-level-community-list.component.spec.ts

@@ -32,6 +32,8 @@ import { SearchConfigurationService } from '../../core/shared/search/search-conf
 import { ConfigurationProperty } from '../../core/shared/configuration-property.model';
 import { createPaginatedList } from '../../shared/testing/utils.test';
 import { SearchConfigurationServiceStub } from '../../shared/testing/search-configuration-service.stub';
+import { APP_CONFIG } from 'src/config/app-config.interface';
+import { environment } from 'src/environments/environment.test';
 
 describe('TopLevelCommunityList Component', () => {
   let comp: TopLevelCommunityListComponent;
@@ -151,6 +153,7 @@ describe('TopLevelCommunityList Component', () => {
       ],
       declarations: [TopLevelCommunityListComponent],
       providers: [
+        { provide: APP_CONFIG, useValue: environment },
         { provide: CommunityDataService, useValue: communityDataServiceStub },
         { provide: HostWindowService, useValue: new HostWindowServiceStub(0) },
         { provide: PaginationService, useValue: paginationService },

src/app/home-page/top-level-community-list/top-level-community-list.component.ts

@@ -1,4 +1,4 @@
-import { ChangeDetectionStrategy, Component, OnInit, OnDestroy } from '@angular/core';
+import { ChangeDetectionStrategy, Component, OnInit, OnDestroy, Inject } from '@angular/core';
 
 import { BehaviorSubject, combineLatest as observableCombineLatest, Subscription } from 'rxjs';
 
@@ -12,6 +12,7 @@ import { PaginationComponentOptions } from '../../shared/pagination/pagination-c
 import { hasValue } from '../../shared/empty.util';
 import { switchMap } from 'rxjs/operators';
 import { PaginationService } from '../../core/pagination/pagination.service';
+import { AppConfig, APP_CONFIG } from 'src/config/app-config.interface';
 
 /**
  * this component renders the Top-Level Community list
@@ -50,11 +51,14 @@ export class TopLevelCommunityListComponent implements OnInit, OnDestroy {
    */
   currentPageSubscription: Subscription;
 
-  constructor(private cds: CommunityDataService,
-              private paginationService: PaginationService) {
+  constructor(
+    @Inject(APP_CONFIG) protected appConfig: AppConfig,
+    private cds: CommunityDataService,
+    private paginationService: PaginationService
+  ) {
     this.config = new PaginationComponentOptions();
     this.config.id = this.pageId;
-    this.config.pageSize = 5;
+    this.config.pageSize = appConfig.homePage.topLevelCommunityList.pageSize;
     this.config.currentPage = 1;
     this.sortConfig = new SortOptions('dc.title', SortDirection.ASC);
   }

src/config/app-config.interface.ts

@@ -17,7 +17,9 @@ import { BrowseByConfig } from './browse-by-config.interface';
 import { BundleConfig } from './bundle-config.interface';
 import { ActuatorsConfig } from './actuators.config';
 import { InfoConfig } from './info-config.interface';
+import { CommunityListConfig } from './community-list-config.interface';
 import { HomeConfig } from './homepage-config.interface';
+
 interface AppConfig extends Config {
   ui: UIServerConfig;
   rest: ServerConfig;
@@ -31,6 +33,8 @@ interface AppConfig extends Config {
   defaultLanguage: string;
   languages: LangConfig[];
   browseBy: BrowseByConfig;
+  communityList: CommunityListConfig;
+  homePage: HomeConfig;
   item: ItemConfig;
   collection: CollectionPageConfig;
   themes: ThemeConfig[];
@@ -38,7 +42,6 @@ interface AppConfig extends Config {
   bundle: BundleConfig;
   actuators: ActuatorsConfig
   info: InfoConfig;
-  homePage: HomeConfig;
 }
 
 /**

src/config/community-list-config.interface.ts

@@ -0,0 +1,5 @@
+import { Config } from './config.interface';
+
+export interface CommunityListConfig extends Config {
+  pageSize: number;
+}

src/config/default-app-config.ts

@@ -17,7 +17,9 @@ import { UIServerConfig } from './ui-server-config.interface';
 import { BundleConfig } from './bundle-config.interface';
 import { ActuatorsConfig } from './actuators.config';
 import { InfoConfig } from './info-config.interface';
+import { CommunityListConfig } from './community-list-config.interface';
 import { HomeConfig } from './homepage-config.interface';
+
 export class DefaultAppConfig implements AppConfig {
   production = false;
 
@@ -210,6 +212,22 @@ export class DefaultAppConfig implements AppConfig {
     defaultLowerLimit: 1900
   };
 
+  communityList: CommunityListConfig = {
+    pageSize: 20
+  };
+
+  homePage: HomeConfig = {
+    recentSubmissions: {
+      //The number of item showing in recent submission components
+      pageSize: 5,
+      //sort record of recent submission
+      sortField: 'dc.date.accessioned',
+    },
+    topLevelCommunityList: {
+      pageSize: 5
+    }
+  };
+
   // Item Config
   item: ItemConfig = {
     edit: {
@@ -340,13 +358,4 @@ export class DefaultAppConfig implements AppConfig {
     enableEndUserAgreement: true,
     enablePrivacyStatement: true
   };
-  // Home Pages
-  homePage: HomeConfig = {
-    recentSubmissions: {
-      //The number of item showing in recent submission components
-      pageSize: 5,
-      //sort record of recent submission
-      sortField: 'dc.date.accessioned',
-    }
-  };
 }

src/config/homepage-config.interface.ts

@@ -16,5 +16,7 @@ export interface HomeConfig extends Config {
     sortField: string;
   }
 
-
+  topLevelCommunityList: {
+    pageSize: number;
+  };
 }

src/environments/environment.test.ts

@@ -204,6 +204,19 @@ export const environment: BuildConfig = {
     // The absolute lowest year to display in the dropdown (only used when no lowest date can be found for all items)
     defaultLowerLimit: 1900,
   },
+  communityList: {
+    pageSize: 20
+  },
+  homePage: {
+    recentSubmissions: {
+      pageSize: 5,
+      //sort record of recent submission
+      sortField: 'dc.date.accessioned',
+    },
+    topLevelCommunityList: {
+      pageSize: 5
+    }
+  },
   item: {
     edit: {
       undoTimeout: 10000 // 10 seconds
@@ -252,12 +265,4 @@ export const environment: BuildConfig = {
     enableEndUserAgreement: true,
     enablePrivacyStatement: true,
   },
-  //Home Page
-  homePage: {
-    recentSubmissions: {
-      pageSize: 5,
-      //sort record of recent submission
-      sortField: 'dc.date.accessioned',
-    }
-  }
 };