From 2ece89db6277709d4ba7473fbf21633026c04184 Mon Sep 17 00:00:00 2001 From: Marie Verdonck Date: Thu, 10 Oct 2019 17:59:09 +0200 Subject: [PATCH] 65528: ComCol flat tree with actual backend comm/coll > TODO FIX: Last subcom and coll are undefined --- .../CommunityListDataSource.ts | 113 +++++++++++------- .../CommunityListService.ts | 45 ++++--- .../community-list.component.ts | 13 +- 3 files changed, 110 insertions(+), 61 deletions(-) diff --git a/src/app/community-list-page/CommunityListDataSource.ts b/src/app/community-list-page/CommunityListDataSource.ts index db1b817f7c..0730197be8 100644 --- a/src/app/community-list-page/CommunityListDataSource.ts +++ b/src/app/community-list-page/CommunityListDataSource.ts @@ -1,27 +1,31 @@ -import {CommunityForList, CommunityListService} from './CommunityListService'; +import {CommunityListService} from './CommunityListService'; import {CollectionViewer, DataSource} from '@angular/cdk/typings/collections'; import {BehaviorSubject, Observable, of} from 'rxjs'; -import {catchError, finalize, map, take} from 'rxjs/operators'; +import {catchError, finalize, map, take, tap} from 'rxjs/operators'; +import {Community} from '../core/shared/community.model'; +import {Collection} from '../core/shared/collection.model'; -export interface CommunityFlatNode { +export interface FlatNode { expandable: boolean; name: string; + handle: string; level: number; isExpanded?: boolean; - parent?: CommunityFlatNode; - community: CommunityForList; + parent?: FlatNode; + community: Community; } -export class CommunityListDataSource implements DataSource { +export class CommunityListDataSource implements DataSource { - private communityListSubject = new BehaviorSubject([]); + private communityListSubject = new BehaviorSubject([]); private loadingSubject = new BehaviorSubject(false); public loading$ = this.loadingSubject.asObservable(); - constructor(private communityListService: CommunityListService) {} + constructor(private communityListService: CommunityListService) { + } - connect(collectionViewer: CollectionViewer): Observable { + connect(collectionViewer: CollectionViewer): Observable { return this.communityListSubject.asObservable(); } @@ -30,7 +34,7 @@ export class CommunityListDataSource implements DataSource { this.loadingSubject.complete(); } - loadCommunities(expandedNodes: CommunityFlatNode[]) { + loadCommunities(expandedNodes: FlatNode[]) { this.loadingSubject.next(true); this.communityListService.getCommunityList() @@ -38,45 +42,74 @@ export class CommunityListDataSource implements DataSource { take(1), catchError(() => of([])), finalize(() => this.loadingSubject.next(false)), - map((result: CommunityForList[]) => { - const communityFlatNodes: CommunityFlatNode[] = []; - const level = 0; - return this.transformListOfCommunities(result, level, communityFlatNodes, null, expandedNodes); + map((result: Community[]) => { + const flatNodes = this.transformListOfCommunities(result, 0, [], null, expandedNodes); + return flatNodes; }) ) - .subscribe((communityFlatNode) => { - this.communityListSubject.next(communityFlatNode) + .subscribe((flatNodes) => { + this.communityListSubject.next(flatNodes) }); }; - transformListOfCommunities(listOfCommunities: CommunityForList[], + transformListOfCommunities(listOfCommunities: Community[], level: number, - communityFlatNodes: CommunityFlatNode[], - parent: CommunityFlatNode, - expandedNodes: CommunityFlatNode[]): CommunityFlatNode[] { + flatNodes: FlatNode[], + parent: FlatNode, + expandedNodes: FlatNode[]): FlatNode[] { level++; - for (const community of listOfCommunities) { - const hasSubComs = ((!!community.subcoms && community.subcoms.length > 0)); - let expanded = false; - if (expandedNodes != null) { - const expandedNodesFound = expandedNodes.filter((node) => (node.name === community.name)); - expanded = (expandedNodesFound.length > 0); - } - console.log(community.name + 'is expanded: ' + expanded); - const communityFlatNode: CommunityFlatNode = { - expandable: hasSubComs, - name: community.name, - level: level, - isExpanded: expanded, - community: community, - parent: parent - } - communityFlatNodes.push(communityFlatNode); - if (hasSubComs && communityFlatNode.isExpanded) { - this.transformListOfCommunities(community.subcoms, level, communityFlatNodes, communityFlatNode, expandedNodes); + if (undefined !== listOfCommunities) { + for (const community of listOfCommunities) { + let expanded = false; + if (expandedNodes != null) { + const expandedNodesFound = expandedNodes.filter((node) => (node.handle === community.handle)); + expanded = (expandedNodesFound.length > 0); + } + const communityFlatNode: FlatNode = { + expandable: true, + name: community.name, + handle: community.handle, + level: level, + isExpanded: expanded, + parent: parent, + community: community, + } + flatNodes.push(communityFlatNode); + if (expanded) { + // TODO FIX: Retrieves last subcom or coll as undefined + let subcoms: Community[] = []; + community.subcommunities.pipe( + tap((v) => console.log('subcom tap', v)), + take(1)).subscribe((results) => { + subcoms = results.payload.page; + if (subcoms.length > 0) { + this.transformListOfCommunities(subcoms, level, flatNodes, communityFlatNode, expandedNodes); + } + }); + let coll: Collection[] = []; + community.collections.pipe( + tap((v) => console.log('col tap ' ,v)), + take(1), + ) + .subscribe((results) => { + coll = results.payload.page; + for (const collection of coll) { + const collectionFlatNode: FlatNode = { + expandable: false, + name: collection.name, + handle: collection.handle, + level: level, + isExpanded: false, + parent: parent, + community: community, + } + flatNodes.push(collectionFlatNode); + } + }); + } } } - return communityFlatNodes; + return flatNodes; } } diff --git a/src/app/community-list-page/CommunityListService.ts b/src/app/community-list-page/CommunityListService.ts index 940a79ec50..106a398589 100644 --- a/src/app/community-list-page/CommunityListService.ts +++ b/src/app/community-list-page/CommunityListService.ts @@ -1,24 +1,41 @@ import {Injectable} from '@angular/core'; import {Observable, of} from 'rxjs'; - -export interface CommunityForList { - name: string; - subcoms?: CommunityForList[]; - collections?: string[]; - parent?: string; -} +import {CommunityDataService} from '../core/data/community-data.service'; +import {PaginationComponentOptions} from '../shared/pagination/pagination-component-options.model'; +import {SortDirection, SortOptions} from '../core/cache/models/sort-options.model'; +import {take} from 'rxjs/operators'; +import {Community} from '../core/shared/community.model'; @Injectable() export class CommunityListService { - private comList: CommunityForList[] = [ - {name: 'com1', subcoms: [{name: 'subcom1', subcoms: [{name: 'subsubcom1'}], collections: null, parent: 'com1'}], collections: ['col1', 'col2'], parent: null}, - {name: 'com2', subcoms: [{name: 'subcom2', subcoms: null, collections: null, parent: 'com2'}, {name: 'subcom3', subcoms: null, collections: null, parent: 'com2'}], collections: ['col3', 'col4'], parent: null}, - {name: 'com3', subcoms: [{name: 'subcom4', subcoms: null, collections: null, parent: 'com3'}], collections: ['col5'], parent: null}, - ]; + communities: Community[]; - public getCommunityList(): Observable { - return of(this.comList); + config: PaginationComponentOptions; + sortConfig: SortOptions; + + constructor(private cds: CommunityDataService) { + this.config = new PaginationComponentOptions(); + this.config.id = 'top-level-pagination'; + this.config.pageSize = 100; + this.config.currentPage = 1; + this.sortConfig = new SortOptions('dc.title', SortDirection.ASC); + this.initTopCommunityList() + } + + private initTopCommunityList(): void { + this.cds.findTop({ + currentPage: this.config.currentPage, + elementsPerPage: this.config.pageSize, + sort: { field: this.sortConfig.field, direction: this.sortConfig.direction } + }).pipe(take(1)).subscribe((results) => { + this.communities = results.payload.page; + console.log('ping', this.communities); + }); + } + + public getCommunityList(): Observable { + return of(this.communities); } } diff --git a/src/app/community-list-page/community-list/community-list.component.ts b/src/app/community-list-page/community-list/community-list.component.ts index 03f06f1170..43f46aecad 100644 --- a/src/app/community-list-page/community-list/community-list.component.ts +++ b/src/app/community-list-page/community-list/community-list.component.ts @@ -1,6 +1,6 @@ import {Component, OnInit} from '@angular/core'; import {CommunityListService} from '../CommunityListService'; -import {CommunityFlatNode, CommunityListDataSource} from '../CommunityListDataSource'; +import {FlatNode, CommunityListDataSource} from '../CommunityListDataSource'; import {FlatTreeControl} from '@angular/cdk/tree'; @Component({ @@ -10,9 +10,9 @@ import {FlatTreeControl} from '@angular/cdk/tree'; }) export class CommunityListComponent implements OnInit { - private expandedNodes: CommunityFlatNode[] = []; + private expandedNodes: FlatNode[] = []; - treeControl = new FlatTreeControl( + treeControl = new FlatTreeControl( (node) => node.level, (node) => node.expandable ); @@ -25,14 +25,14 @@ export class CommunityListComponent implements OnInit { this.dataSource.loadCommunities(null); } - hasChild = (_: number, node: CommunityFlatNode) => node.expandable; + hasChild = (_: number, node: FlatNode) => node.expandable; - shouldRender(node: CommunityFlatNode) { + shouldRender(node: FlatNode) { const parent = node.parent; return !parent || parent.isExpanded; } - toggleExpanded(node: CommunityFlatNode) { + toggleExpanded(node: FlatNode) { if (node.isExpanded) { this.expandedNodes = this.expandedNodes.filter((node2) => node2.name !== node.name); node.isExpanded = false; @@ -41,7 +41,6 @@ export class CommunityListComponent implements OnInit { node.isExpanded = true; } this.dataSource.loadCommunities(this.expandedNodes); - console.log('Nr of expanded nodes' + this.expandedNodes.length); } }