64574: Refactor item-pages to use paginated-lists and relationship-service

This commit is contained in:
Kristof De Langhe
2019-08-27 11:18:12 +02:00
parent 02cf98c759
commit 4b55d7507c
15 changed files with 78 additions and 201 deletions

View File

@@ -29,7 +29,7 @@
<div class="col-xs-12 col-md-6">
<ds-metadata-representation-list
[label]="'relationships.isAuthorOf' | translate"
[representations]="authors$ | async">
[representations]="(authors$ | async)?.payload?.page">
</ds-metadata-representation-list>
<ds-related-items
[items]="(projects$ | async)?.payload?.page"

View File

@@ -7,7 +7,6 @@ import {
} from '../../../../shared/items/item-type-decorator';
import { ItemComponent } from '../shared/item.component';
import { MetadataRepresentation } from '../../../../core/shared/metadata-representation/metadata-representation.model';
import { getRelatedItemsByTypeLabel } from '../shared/item-relationships-utils';
import { RemoteData } from '../../../../core/data/remote-data';
import { PaginatedList } from '../../../../core/data/paginated-list';
@@ -23,7 +22,7 @@ export class PublicationComponent extends ItemComponent implements OnInit {
/**
* The authors related to this publication
*/
authors$: Observable<MetadataRepresentation[]>;
authors$: Observable<RemoteData<PaginatedList<MetadataRepresentation>>>;
/**
* The projects related to this publication
@@ -41,16 +40,10 @@ export class PublicationComponent extends ItemComponent implements OnInit {
journalIssues$: Observable<RemoteData<PaginatedList<Item>>>;
ngOnInit(): void {
super.ngOnInit();
this.authors$ = this.buildRepresentations('Person', 'dc.contributor.author', 'isAuthorOfPublication');
if (this.resolvedRelsAndTypes$) {
this.authors$ = this.buildRepresentations('Person', 'dc.contributor.author');
this.projects$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isProjectOfPublication');
this.orgUnits$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isOrgUnitOfPublication');
this.journalIssues$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isJournalIssueOfPublication');
}
this.projects$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isProjectOfPublication');
this.orgUnits$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isOrgUnitOfPublication');
this.journalIssues$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isJournalIssueOfPublication');
}
}

View File

@@ -1,20 +1,16 @@
import { Component, Inject, OnInit } from '@angular/core';
import { Component, Inject } from '@angular/core';
import { Observable , zip as observableZip, combineLatest as observableCombineLatest } from 'rxjs';
import { distinctUntilChanged, filter, flatMap, map } from 'rxjs/operators';
import { ItemDataService } from '../../../../core/data/item-data.service';
import { filter, flatMap, map } from 'rxjs/operators';
import { PaginatedList } from '../../../../core/data/paginated-list';
import { RemoteData } from '../../../../core/data/remote-data';
import { RelationshipType } from '../../../../core/shared/item-relationships/relationship-type.model';
import { Relationship } from '../../../../core/shared/item-relationships/relationship.model';
import { Item } from '../../../../core/shared/item.model';
import { getRemoteDataPayload, getSucceededRemoteData } from '../../../../core/shared/operators';
import { ITEM } from '../../../../shared/items/switcher/item-type-switcher.component';
import { MetadataRepresentation } from '../../../../core/shared/metadata-representation/metadata-representation.model';
import { ItemMetadataRepresentation } from '../../../../core/shared/metadata-representation/item/item-metadata-representation.model';
import { MetadatumRepresentation } from '../../../../core/shared/metadata-representation/metadatum/metadatum-representation.model';
import { of } from 'rxjs/internal/observable/of';
import { MetadataValue } from '../../../../core/shared/metadata.models';
import { compareArraysUsingIds } from './item-relationships-utils';
import { RelationshipService } from '../../../../core/data/relationship.service';
/**
@@ -24,15 +20,15 @@ import { RelationshipService } from '../../../../core/data/relationship.service'
* @param metadata The list of original Metadatum objects
*/
export const relationsToRepresentations = (thisId: string, itemType: string, metadata: MetadataValue[]) =>
(source: Observable<Relationship[]>): Observable<MetadataRepresentation[]> =>
(source: Observable<RemoteData<PaginatedList<Relationship>>>): Observable<RemoteData<PaginatedList<MetadataRepresentation>>> =>
source.pipe(
flatMap((rels: Relationship[]) =>
flatMap((relRD: RemoteData<PaginatedList<Relationship>>) =>
observableZip(
...metadata
.map((metadatum: any) => Object.assign(new MetadataValue(), metadatum))
.map((metadatum: MetadataValue) => {
if (metadatum.isVirtual) {
const matchingRels = rels.filter((rel: Relationship) => ('' + rel.id) === metadatum.virtualValue);
const matchingRels = relRD.payload.page.filter((rel: Relationship) => ('' + rel.id) === metadatum.virtualValue);
if (matchingRels.length > 0) {
const matchingRel = matchingRels[0];
return observableCombineLatest(matchingRel.leftItem, matchingRel.rightItem).pipe(
@@ -51,6 +47,8 @@ export const relationsToRepresentations = (thisId: string, itemType: string, met
return of(Object.assign(new MetadatumRepresentation(itemType), metadatum));
}
})
).pipe(
map((representations: MetadataRepresentation[]) => Object.assign(relRD, { payload: { page: representations } }))
)
)
);
@@ -62,59 +60,25 @@ export const relationsToRepresentations = (thisId: string, itemType: string, met
/**
* A generic component for displaying metadata and relations of an item
*/
export class ItemComponent implements OnInit {
/**
* Resolved relationships and types together in one observable
*/
resolvedRelsAndTypes$: Observable<[Relationship[], RelationshipType[]]>;
export class ItemComponent {
constructor(
@Inject(ITEM) public item: Item,
public relationshipService: RelationshipService
) {}
ngOnInit(): void {
const relationships$ = this.item.relationships;
if (relationships$) {
const relsCurrentPage$ = relationships$.pipe(
filter((rd: RemoteData<PaginatedList<Relationship>>) => rd.hasSucceeded),
getRemoteDataPayload(),
map((pl: PaginatedList<Relationship>) => pl.page),
distinctUntilChanged(compareArraysUsingIds())
);
const relTypesCurrentPage$ = relsCurrentPage$.pipe(
flatMap((rels: Relationship[]) =>
observableZip(...rels.map((rel: Relationship) => rel.relationshipType)).pipe(
map(([...arr]: Array<RemoteData<RelationshipType>>) => arr.map((d: RemoteData<RelationshipType>) => d.payload))
)
),
distinctUntilChanged(compareArraysUsingIds())
);
this.resolvedRelsAndTypes$ = observableCombineLatest(
relsCurrentPage$,
relTypesCurrentPage$
);
}
}
/**
* Build a list of MetadataRepresentations for the current item. This combines all metadata and relationships of a
* certain type.
* @param itemType The type of item we're building representations of. Used for matching templates.
* @param metadataField The metadata field that resembles the item type.
* @param relationshipLabel The label to use to fetch relationships to create MetadataRepresentations for.
*/
buildRepresentations(itemType: string, metadataField: string): Observable<MetadataRepresentation[]> {
buildRepresentations(itemType: string, metadataField: string, relationshipLabel: string): Observable<RemoteData<PaginatedList<MetadataRepresentation>>> {
const metadata = this.item.findMetadataSortedByPlace(metadataField);
const relsCurrentPage$ = this.item.relationships.pipe(
getSucceededRemoteData(),
getRemoteDataPayload(),
map((pl: PaginatedList<Relationship>) => pl.page),
distinctUntilChanged(compareArraysUsingIds())
);
const relationships$ = this.relationshipService.getItemRelationshipsByLabel(this.item, relationshipLabel);
return relsCurrentPage$.pipe(
return relationships$.pipe(
relationsToRepresentations(this.item.id, itemType, metadata)
);
}

View File

@@ -29,12 +29,12 @@
</div>
<div class="col-xs-12 col-md-6">
<ds-related-items
[items]="volumes$ | async"
[items]="(volumes$ | async)?.payload?.page"
[label]="'relationships.isSingleVolumeOf' | translate">
</ds-related-items>
<ds-related-items
class="mb-1 mt-1"
[items]="publications$ | async"
[items]="(publications$ | async)?.payload?.page"
[label]="'relationships.isPublicationOfJournalIssue' | translate">
</ds-related-items>
<ds-generic-item-page-field [item]="item"

View File

@@ -2,9 +2,9 @@ import { Component } from '@angular/core';
import { Observable } from 'rxjs';
import { Item } from '../../../../core/shared/item.model';
import { ItemViewMode, rendersItemType } from '../../../../shared/items/item-type-decorator';
import { isNotEmpty } from '../../../../shared/empty.util';
import { ItemComponent } from '../../../../+item-page/simple/item-types/shared/item.component';
import { getRelatedItemsByTypeLabel } from '../../../../+item-page/simple/item-types/shared/item-relationships-utils';
import { RemoteData } from '../../../../core/data/remote-data';
import { PaginatedList } from '../../../../core/data/paginated-list';
@rendersItemType('JournalIssue', ItemViewMode.Full)
@Component({
@@ -19,23 +19,15 @@ export class JournalIssueComponent extends ItemComponent {
/**
* The volumes related to this journal issue
*/
volumes$: Observable<Item[]>;
volumes$: Observable<RemoteData<PaginatedList<Item>>>;
/**
* The publications related to this journal issue
*/
publications$: Observable<Item[]>;
publications$: Observable<RemoteData<PaginatedList<Item>>>;
ngOnInit(): void {
super.ngOnInit();
if (isNotEmpty(this.resolvedRelsAndTypes$)) {
this.volumes$ = this.resolvedRelsAndTypes$.pipe(
getRelatedItemsByTypeLabel(this.item.id, 'isJournalVolumeOfIssue')
);
this.publications$ = this.resolvedRelsAndTypes$.pipe(
getRelatedItemsByTypeLabel(this.item.id, 'isPublicationOfJournalIssue')
);
}
this.volumes$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isJournalVolumeOfIssue');
this.publications$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isPublicationOfJournalIssue');
}
}

View File

@@ -17,11 +17,11 @@
</div>
<div class="col-xs-12 col-md-6">
<ds-related-items
[items]="journals$ | async"
[items]="(journals$ | async)?.payload?.page"
[label]="'relationships.isSingleJournalOf' | translate">
</ds-related-items>
<ds-related-items
[items]="issues$ | async"
[items]="(issues$ | async)?.payload?.page"
[label]="'relationships.isIssueOf' | translate">
</ds-related-items>
<ds-generic-item-page-field [item]="item"

View File

@@ -2,9 +2,9 @@ import { Component } from '@angular/core';
import { Observable } from 'rxjs';
import { Item } from '../../../../core/shared/item.model';
import { ItemViewMode, rendersItemType } from '../../../../shared/items/item-type-decorator';
import { isNotEmpty } from '../../../../shared/empty.util';
import { ItemComponent } from '../../../../+item-page/simple/item-types/shared/item.component';
import { getRelatedItemsByTypeLabel } from '../../../../+item-page/simple/item-types/shared/item-relationships-utils';
import { RemoteData } from '../../../../core/data/remote-data';
import { PaginatedList } from '../../../../core/data/paginated-list';
@rendersItemType('JournalVolume', ItemViewMode.Full)
@Component({
@@ -19,23 +19,15 @@ export class JournalVolumeComponent extends ItemComponent {
/**
* The journals related to this journal volume
*/
journals$: Observable<Item[]>;
journals$: Observable<RemoteData<PaginatedList<Item>>>;
/**
* The journal issues related to this journal volume
*/
issues$: Observable<Item[]>;
issues$: Observable<RemoteData<PaginatedList<Item>>>;
ngOnInit(): void {
super.ngOnInit();
if (isNotEmpty(this.resolvedRelsAndTypes$)) {
this.journals$ = this.resolvedRelsAndTypes$.pipe(
getRelatedItemsByTypeLabel(this.item.id, 'isJournalOfVolume')
);
this.issues$ = this.resolvedRelsAndTypes$.pipe(
getRelatedItemsByTypeLabel(this.item.id, 'isIssueOfJournalVolume')
);
}
this.journals$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isJournalOfVolume');
this.issues$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isIssueOfJournalVolume');
}
}

View File

@@ -21,7 +21,7 @@
</div>
<div class="col-xs-12 col-md-6">
<ds-related-items
[items]="volumes$ | async"
[items]="(volumes$ | async)?.payload?.page"
[label]="'relationships.isVolumeOf' | translate">
</ds-related-items>
<ds-generic-item-page-field class="item-page-fields" [item]="item"

View File

@@ -2,9 +2,9 @@ import { Component } from '@angular/core';
import { Observable } from 'rxjs';
import { Item } from '../../../../core/shared/item.model';
import { ItemViewMode, rendersItemType } from '../../../../shared/items/item-type-decorator';
import { isNotEmpty } from '../../../../shared/empty.util';
import { ItemComponent } from '../../../../+item-page/simple/item-types/shared/item.component';
import { getRelatedItemsByTypeLabel } from '../../../../+item-page/simple/item-types/shared/item-relationships-utils';
import { RemoteData } from '../../../../core/data/remote-data';
import { PaginatedList } from '../../../../core/data/paginated-list';
@rendersItemType('Journal', ItemViewMode.Full)
@Component({
@@ -19,15 +19,9 @@ export class JournalComponent extends ItemComponent {
/**
* The volumes related to this journal
*/
volumes$: Observable<Item[]>;
volumes$: Observable<RemoteData<PaginatedList<Item>>>;
ngOnInit(): void {
super.ngOnInit();
if (isNotEmpty(this.resolvedRelsAndTypes$)) {
this.volumes$ = this.resolvedRelsAndTypes$.pipe(
getRelatedItemsByTypeLabel(this.item.id, 'isVolumeOfJournal')
);
}
this.volumes$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isVolumeOfJournal');
}
}

View File

@@ -25,15 +25,15 @@
</div>
<div class="col-xs-12 col-md-6">
<ds-related-items
[items]="people$ | async"
[items]="(people$ | async)?.payload?.page"
[label]="'relationships.isPersonOf' | translate">
</ds-related-items>
<ds-related-items
[items]="projects$ | async"
[items]="(projects$ | async)?.payload?.page"
[label]="'relationships.isProjectOf' | translate">
</ds-related-items>
<ds-related-items
[items]="publications$ | async"
[items]="(publications$ | async)?.payload?.page"
[label]="'relationships.isPublicationOf' | translate">
</ds-related-items>
<ds-generic-item-page-field [item]="item"

View File

@@ -2,9 +2,9 @@ import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs';
import { Item } from '../../../../core/shared/item.model';
import { ItemViewMode, rendersItemType } from '../../../../shared/items/item-type-decorator';
import { isNotEmpty } from '../../../../shared/empty.util';
import { ItemComponent } from '../../../../+item-page/simple/item-types/shared/item.component';
import { getRelatedItemsByTypeLabel } from '../../../../+item-page/simple/item-types/shared/item-relationships-utils';
import { RemoteData } from '../../../../core/data/remote-data';
import { PaginatedList } from '../../../../core/data/paginated-list';
@rendersItemType('OrgUnit', ItemViewMode.Full)
@Component({
@@ -19,32 +19,21 @@ export class OrgunitComponent extends ItemComponent implements OnInit {
/**
* The people related to this organisation unit
*/
people$: Observable<Item[]>;
people$: Observable<RemoteData<PaginatedList<Item>>>;
/**
* The projects related to this organisation unit
*/
projects$: Observable<Item[]>;
projects$: Observable<RemoteData<PaginatedList<Item>>>;
/**
* The publications related to this organisation unit
*/
publications$: Observable<Item[]>;
publications$: Observable<RemoteData<PaginatedList<Item>>>;
ngOnInit(): void {
super.ngOnInit();
if (isNotEmpty(this.resolvedRelsAndTypes$)) {
this.people$ = this.resolvedRelsAndTypes$.pipe(
getRelatedItemsByTypeLabel(this.item.id, 'isPersonOfOrgUnit')
);
this.projects$ = this.resolvedRelsAndTypes$.pipe(
getRelatedItemsByTypeLabel(this.item.id, 'isProjectOfOrgUnit')
);
this.publications$ = this.resolvedRelsAndTypes$.pipe(
getRelatedItemsByTypeLabel(this.item.id, 'isPublicationOfOrgUnit')
);
}
}}
this.people$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isPersonOfOrgUnit');
this.projects$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isProjectOfOrgUnit');
this.publications$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isPublicationOfOrgUnit');
}
}

View File

@@ -25,11 +25,11 @@
</div>
<div class="col-xs-12 col-md-6">
<ds-related-items
[items]="projects$ | async"
[items]="(projects$ | async)?.payload?.page"
[label]="'relationships.isProjectOf' | translate">
</ds-related-items>
<ds-related-items
[items]="orgUnits$ | async"
[items]="(orgUnits$ | async)?.payload?.page"
[label]="'relationships.isOrgUnitOf' | translate">
</ds-related-items>
<ds-generic-item-page-field [item]="item"

View File

@@ -1,13 +1,10 @@
import { Component, Inject } from '@angular/core';
import { Observable , of as observableOf } from 'rxjs';
import { Component } from '@angular/core';
import { Observable } from 'rxjs';
import { Item } from '../../../../core/shared/item.model';
import { ItemViewMode, rendersItemType } from '../../../../shared/items/item-type-decorator';
import { ITEM } from '../../../../shared/items/switcher/item-type-switcher.component';
import { SearchFixedFilterService } from '../../../../+search-page/search-filters/search-filter/search-fixed-filter.service';
import { isNotEmpty } from '../../../../shared/empty.util';
import { ItemComponent } from '../../../../+item-page/simple/item-types/shared/item.component';
import { getRelatedItemsByTypeLabel } from '../../../../+item-page/simple/item-types/shared/item-relationships-utils';
import { RelationshipService } from '../../../../core/data/relationship.service';
import { RemoteData } from '../../../../core/data/remote-data';
import { PaginatedList } from '../../../../core/data/paginated-list';
@rendersItemType('Person', ItemViewMode.Full)
@Component({
@@ -22,53 +19,21 @@ export class PersonComponent extends ItemComponent {
/**
* The publications related to this person
*/
publications$: Observable<Item[]>;
publications$: Observable<RemoteData<PaginatedList<Item>>>;
/**
* The projects related to this person
*/
projects$: Observable<Item[]>;
projects$: Observable<RemoteData<PaginatedList<Item>>>;
/**
* The organisation units related to this person
*/
orgUnits$: Observable<Item[]>;
orgUnits$: Observable<RemoteData<PaginatedList<Item>>>;
/**
* The applied fixed filter
*/
fixedFilter$: Observable<string>;
/**
* The query used for applying the fixed filter
*/
fixedFilterQuery: string;
constructor(
@Inject(ITEM) public item: Item,
public relationshipService: RelationshipService,
private fixedFilterService: SearchFixedFilterService
) {
super(item, relationshipService);
}
ngOnInit(): void {
super.ngOnInit();
if (isNotEmpty(this.resolvedRelsAndTypes$)) {
this.publications$ = this.resolvedRelsAndTypes$.pipe(
getRelatedItemsByTypeLabel(this.item.id, 'isPublicationOfAuthor')
);
this.projects$ = this.resolvedRelsAndTypes$.pipe(
getRelatedItemsByTypeLabel(this.item.id, 'isProjectOfPerson')
);
this.orgUnits$ = this.resolvedRelsAndTypes$.pipe(
getRelatedItemsByTypeLabel(this.item.id, 'isOrgUnitOfPerson')
);
this.fixedFilterQuery = this.fixedFilterService.getQueryByRelations('isAuthorOfPublication', this.item.id);
this.fixedFilter$ = observableOf('publication');
}
this.publications$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isPublicationOfAuthor');
this.projects$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isProjectOfPerson');
this.orgUnits$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isOrgUnitOfPerson');
}
}

View File

@@ -12,7 +12,7 @@
<!--</ds-generic-item-page-field>-->
<ds-metadata-representation-list
[label]="'project.page.contributor' | translate"
[representations]="contributors$ | async">
[representations]="(contributors$ | async)?.payload?.page">
</ds-metadata-representation-list>
<ds-generic-item-page-field [item]="item"
[fields]="['project.identifier.funder']"
@@ -29,15 +29,15 @@
</div>
<div class="col-xs-12 col-md-6">
<ds-related-items
[items]="people$ | async"
[items]="(people$ | async)?.payload?.page"
[label]="'relationships.isPersonOf' | translate">
</ds-related-items>
<ds-related-items
[items]="publications$ | async"
[items]="(publications$ | async)?.payload?.page"
[label]="'relationships.isPublicationOf' | translate">
</ds-related-items>
<ds-related-items
[items]="orgUnits$ | async"
[items]="(orgUnits$ | async)?.payload?.page"
[label]="'relationships.isOrgUnitOf' | translate">
</ds-related-items>
<ds-generic-item-page-field [item]="item"

View File

@@ -3,9 +3,9 @@ import { Observable } from 'rxjs';
import { Item } from '../../../../core/shared/item.model';
import { MetadataRepresentation } from '../../../../core/shared/metadata-representation/metadata-representation.model';
import { ItemViewMode, rendersItemType } from '../../../../shared/items/item-type-decorator';
import { isNotEmpty } from '../../../../shared/empty.util';
import { ItemComponent } from '../../../../+item-page/simple/item-types/shared/item.component';
import { getRelatedItemsByTypeLabel } from '../../../../+item-page/simple/item-types/shared/item-relationships-utils';
import { RemoteData } from '../../../../core/data/remote-data';
import { PaginatedList } from '../../../../core/data/paginated-list';
@rendersItemType('Project', ItemViewMode.Full)
@Component({
@@ -20,40 +20,28 @@ export class ProjectComponent extends ItemComponent implements OnInit {
/**
* The contributors related to this project
*/
contributors$: Observable<MetadataRepresentation[]>;
contributors$: Observable<RemoteData<PaginatedList<MetadataRepresentation>>>;
/**
* The people related to this project
*/
people$: Observable<Item[]>;
people$: Observable<RemoteData<PaginatedList<Item>>>;
/**
* The publications related to this project
*/
publications$: Observable<Item[]>;
publications$: Observable<RemoteData<PaginatedList<Item>>>;
/**
* The organisation units related to this project
*/
orgUnits$: Observable<Item[]>;
orgUnits$: Observable<RemoteData<PaginatedList<Item>>>;
ngOnInit(): void {
super.ngOnInit();
this.contributors$ = this.buildRepresentations('OrgUnit', 'project.contributor.other', 'isOrgUnitOfProject');
if (isNotEmpty(this.resolvedRelsAndTypes$)) {
this.contributors$ = this.buildRepresentations('OrgUnit', 'project.contributor.other');
this.people$ = this.resolvedRelsAndTypes$.pipe(
getRelatedItemsByTypeLabel(this.item.id, 'isPersonOfProject')
);
this.publications$ = this.resolvedRelsAndTypes$.pipe(
getRelatedItemsByTypeLabel(this.item.id, 'isPublicationOfProject')
);
this.orgUnits$ = this.resolvedRelsAndTypes$.pipe(
getRelatedItemsByTypeLabel(this.item.id, 'isOrgUnitOfProject')
);
}
this.people$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isPersonOfProject');
this.publications$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isPublicationOfProject');
this.orgUnits$ = this.relationshipService.getRelatedItemsByLabel(this.item, 'isOrgUnitOfProject');
}
}