Skip to content

Commit 15342b3

Browse files
108588: Updated CollectionPageRoutingModule to use custom sections
1 parent e66a14c commit 15342b3

8 files changed

Lines changed: 251 additions & 149 deletions

src/app/collection-page/collection-page-routing.module.ts

Lines changed: 21 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,10 @@ import { LinkMenuItemModel } from '../shared/menu/menu-item/models/link.model';
2222
import { ThemedCollectionPageComponent } from './themed-collection-page.component';
2323
import { MenuItemType } from '../shared/menu/menu-item-type.model';
2424
import { DSOEditMenuResolver } from '../shared/dso-page/dso-edit-menu.resolver';
25+
import { BrowseBySwitcherComponent } from '../browse-by/browse-by-switcher/browse-by-switcher.component';
26+
import { BrowseByGuard } from '../browse-by/browse-by-guard';
27+
import { BrowseByI18nBreadcrumbResolver } from '../browse-by/browse-by-i18n-breadcrumb.resolver';
28+
import { CollectionRecentlyAddedComponent } from './sections/recently-added/collection-recently-added.component';
2529

2630
@NgModule({
2731
imports: [
@@ -65,7 +69,23 @@ import { DSOEditMenuResolver } from '../shared/dso-page/dso-edit-menu.resolver';
6569
{
6670
path: '',
6771
component: ThemedCollectionPageComponent,
68-
pathMatch: 'full',
72+
children: [
73+
{
74+
path: '',
75+
pathMatch: 'full',
76+
component: CollectionRecentlyAddedComponent,
77+
},
78+
{
79+
path: 'browse/:id',
80+
pathMatch: 'full',
81+
component: BrowseBySwitcherComponent,
82+
canActivate: [BrowseByGuard],
83+
resolve: {
84+
breadcrumb: BrowseByI18nBreadcrumbResolver,
85+
},
86+
data: { breadcrumbKey: 'browse.metadata' },
87+
},
88+
],
6989
}
7090
],
7191
data: {
Lines changed: 53 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -1,81 +1,64 @@
11
<div class="container">
2-
<div class="collection-page"
3-
*ngVar="(collectionRD$ | async) as collectionRD">
4-
<div *ngIf="collectionRD?.hasSucceeded" @fadeInOut>
5-
<div *ngIf="collectionRD?.payload as collection">
6-
<ds-view-tracker [object]="collection"></ds-view-tracker>
7-
<div class="d-flex flex-row border-bottom mb-4 pb-4">
8-
<header class="comcol-header mr-auto">
9-
<!-- Collection Name -->
10-
<ds-comcol-page-header
11-
[name]="dsoNameService.getName(collection)">
12-
</ds-comcol-page-header>
13-
<!-- Collection logo -->
14-
<ds-comcol-page-logo *ngIf="logoRD$"
15-
[logo]="(logoRD$ | async)?.payload"
16-
[alternateText]="'Collection Logo'">
17-
</ds-comcol-page-logo>
2+
<div class="collection-page"
3+
*ngVar="(collectionRD$ | async) as collectionRD">
4+
<div *ngIf="collectionRD?.hasSucceeded" @fadeInOut>
5+
<div *ngIf="collectionRD?.payload as collection">
6+
<ds-view-tracker [object]="collection"></ds-view-tracker>
7+
<div class="d-flex flex-row border-bottom mb-4 pb-4">
8+
<header class="comcol-header mr-auto">
9+
<!-- Collection Name -->
10+
<ds-comcol-page-header
11+
[name]="dsoNameService.getName(collection)">
12+
</ds-comcol-page-header>
13+
<!-- Collection logo -->
14+
<ds-comcol-page-logo *ngIf="logoRD$"
15+
[logo]="(logoRD$ | async)?.payload"
16+
[alternateText]="'Collection Logo'">
17+
</ds-comcol-page-logo>
1818

19-
<!-- Handle -->
20-
<ds-themed-comcol-page-handle
21-
[content]="collection.handle"
22-
[title]="'collection.page.handle'" >
23-
</ds-themed-comcol-page-handle>
24-
<!-- Introductory text -->
25-
<ds-comcol-page-content
26-
[content]="collection.introductoryText"
27-
[hasInnerHtml]="true">
28-
</ds-comcol-page-content>
29-
<!-- News -->
30-
<ds-comcol-page-content
31-
[content]="collection.sidebarText"
32-
[hasInnerHtml]="true"
33-
[title]="'collection.page.news'">
34-
</ds-comcol-page-content>
35-
</header>
36-
<ds-dso-edit-menu></ds-dso-edit-menu>
37-
<div class="pl-2 space-children-mr">
38-
<ds-dso-page-subscription-button [dso]="collection"></ds-dso-page-subscription-button>
39-
</div>
40-
</div>
41-
<section class="comcol-page-browse-section">
42-
<!-- Browse-By Links -->
43-
<ds-themed-comcol-page-browse-by
44-
[id]="collection.id"
45-
[contentType]="collection.type">
46-
</ds-themed-comcol-page-browse-by>
19+
<!-- Handle -->
20+
<ds-themed-comcol-page-handle
21+
[content]="collection.handle"
22+
[title]="'collection.page.handle'">
23+
</ds-themed-comcol-page-handle>
24+
<!-- Introductory text -->
25+
<ds-comcol-page-content
26+
[content]="collection.introductoryText"
27+
[hasInnerHtml]="true">
28+
</ds-comcol-page-content>
29+
<!-- News -->
30+
<ds-comcol-page-content
31+
[content]="collection.sidebarText"
32+
[hasInnerHtml]="true"
33+
[title]="'collection.page.news'">
34+
</ds-comcol-page-content>
35+
</header>
36+
<ds-dso-edit-menu></ds-dso-edit-menu>
37+
<div class="pl-2 space-children-mr">
38+
<ds-dso-page-subscription-button [dso]="collection"></ds-dso-page-subscription-button>
39+
</div>
40+
</div>
41+
<section class="comcol-page-browse-section">
42+
<!-- Browse-By Links -->
43+
<ds-themed-comcol-page-browse-by
44+
[id]="collection.id"
45+
[contentType]="collection.type">
46+
</ds-themed-comcol-page-browse-by>
4747

48-
<ng-container *ngVar="(itemRD$ | async) as itemRD">
49-
<div class="mt-4" *ngIf="itemRD?.hasSucceeded" @fadeIn>
50-
<h3 class="sr-only">{{'collection.page.browse.recent.head' | translate}}</h3>
51-
<ds-viewable-collection
52-
[config]="paginationConfig"
53-
[sortConfig]="sortConfig"
54-
[objects]="itemRD"
55-
[hideGear]="true">
56-
</ds-viewable-collection>
57-
</div>
58-
<ds-error *ngIf="itemRD?.hasFailed"
59-
message="{{'error.recent-submissions' | translate}}"></ds-error>
60-
<ds-themed-loading *ngIf="!itemRD || itemRD.isLoading"
61-
message="{{'loading.recent-submissions' | translate}}"></ds-themed-loading>
62-
<div *ngIf="!itemRD?.isLoading && itemRD?.payload?.page.length === 0" class="alert alert-info w-100" role="alert">
63-
{{'collection.page.browse.recent.empty' | translate}}
64-
</div>
65-
</ng-container>
66-
</section>
67-
<footer *ngIf="collection.copyrightText" class="border-top my-5 pt-4">
48+
<router-outlet></router-outlet>
49+
</section>
50+
<footer *ngIf="collection.copyrightText" class="border-top my-5 pt-4">
6851
<!-- Copyright -->
6952
<ds-comcol-page-content
70-
[content]="collection.copyrightText"
71-
[hasInnerHtml]="true">
53+
[content]="collection.copyrightText"
54+
[hasInnerHtml]="true">
7255
</ds-comcol-page-content>
7356
</footer>
7457
</div>
7558
</div>
76-
<ds-error *ngIf="collectionRD?.hasFailed"
77-
message="{{'error.collection' | translate}}"></ds-error>
78-
<ds-themed-loading *ngIf="collectionRD?.isLoading"
79-
message="{{'loading.collection' | translate}}"></ds-themed-loading>
59+
<ds-error *ngIf="collectionRD?.hasFailed"
60+
message="{{'error.collection' | translate}}"></ds-error>
61+
<ds-themed-loading *ngIf="collectionRD?.isLoading"
62+
message="{{'loading.collection' | translate}}"></ds-themed-loading>
8063
</div>
8164
</div>
Lines changed: 9 additions & 71 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,21 @@
1-
import { ChangeDetectionStrategy, Component, OnInit, Inject } from '@angular/core';
1+
import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
22
import { ActivatedRoute, Router } from '@angular/router';
3-
import { BehaviorSubject, combineLatest as observableCombineLatest, Observable, Subject } from 'rxjs';
4-
import { filter, map, mergeMap, startWith, switchMap, take } from 'rxjs/operators';
5-
import { PaginatedSearchOptions } from '../shared/search/models/paginated-search-options.model';
6-
import { SearchService } from '../core/shared/search/search.service';
7-
import { SortDirection, SortOptions } from '../core/cache/models/sort-options.model';
8-
import { CollectionDataService } from '../core/data/collection-data.service';
9-
import { PaginatedList } from '../core/data/paginated-list.model';
3+
import { Observable } from 'rxjs';
4+
import { filter, map, mergeMap, take } from 'rxjs/operators';
5+
import { SortOptions } from '../core/cache/models/sort-options.model';
106
import { RemoteData } from '../core/data/remote-data';
117
import { Bitstream } from '../core/shared/bitstream.model';
12-
138
import { Collection } from '../core/shared/collection.model';
14-
import { DSpaceObjectType } from '../core/shared/dspace-object-type.model';
15-
import { Item } from '../core/shared/item.model';
16-
import {
17-
getAllSucceededRemoteDataPayload,
18-
getFirstSucceededRemoteData,
19-
toDSpaceObjectListRD
20-
} from '../core/shared/operators';
21-
9+
import { getAllSucceededRemoteDataPayload } from '../core/shared/operators';
2210
import { fadeIn, fadeInOut } from '../shared/animations/fade';
2311
import { hasValue, isNotEmpty } from '../shared/empty.util';
2412
import { PaginationComponentOptions } from '../shared/pagination/pagination-component-options.model';
2513
import { AuthService } from '../core/auth/auth.service';
26-
import { PaginationService } from '../core/pagination/pagination.service';
2714
import { AuthorizationDataService } from '../core/data/feature-authorization/authorization-data.service';
2815
import { FeatureID } from '../core/data/feature-authorization/feature-id';
2916
import { getCollectionPageRoute } from './collection-page-routing-paths';
3017
import { redirectOn4xx } from '../core/shared/authorized.operators';
31-
import { BROWSE_LINKS_TO_FOLLOW } from '../core/browse/browse.service';
3218
import { DSONameService } from '../core/breadcrumbs/dso-name.service';
33-
import { APP_CONFIG, AppConfig } from '../../../src/config/app-config.interface';
3419

3520
@Component({
3621
selector: 'ds-collection-page',
@@ -44,14 +29,9 @@ import { APP_CONFIG, AppConfig } from '../../../src/config/app-config.interface'
4429
})
4530
export class CollectionPageComponent implements OnInit {
4631
collectionRD$: Observable<RemoteData<Collection>>;
47-
itemRD$: Observable<RemoteData<PaginatedList<Item>>>;
4832
logoRD$: Observable<RemoteData<Bitstream>>;
4933
paginationConfig: PaginationComponentOptions;
5034
sortConfig: SortOptions;
51-
private paginationChanges$: Subject<{
52-
paginationConfig: PaginationComponentOptions,
53-
sortConfig: SortOptions
54-
}>;
5535

5636
/**
5737
* Whether the current user is a Community admin
@@ -64,23 +44,12 @@ export class CollectionPageComponent implements OnInit {
6444
collectionPageRoute$: Observable<string>;
6545

6646
constructor(
67-
private collectionDataService: CollectionDataService,
68-
private searchService: SearchService,
69-
private route: ActivatedRoute,
70-
private router: Router,
71-
private authService: AuthService,
72-
private paginationService: PaginationService,
73-
private authorizationDataService: AuthorizationDataService,
47+
protected route: ActivatedRoute,
48+
protected router: Router,
49+
protected authService: AuthService,
50+
protected authorizationDataService: AuthorizationDataService,
7451
public dsoNameService: DSONameService,
75-
@Inject(APP_CONFIG) public appConfig: AppConfig,
7652
) {
77-
this.paginationConfig = Object.assign(new PaginationComponentOptions(), {
78-
id: 'cp',
79-
currentPage: 1,
80-
pageSize: this.appConfig.browseBy.pageSize,
81-
});
82-
83-
this.sortConfig = new SortOptions('dc.date.accessioned', SortDirection.DESC);
8453
}
8554

8655
ngOnInit(): void {
@@ -96,33 +65,6 @@ export class CollectionPageComponent implements OnInit {
9665
);
9766
this.isCollectionAdmin$ = this.authorizationDataService.isAuthorized(FeatureID.IsCollectionAdmin);
9867

99-
this.paginationChanges$ = new BehaviorSubject({
100-
paginationConfig: this.paginationConfig,
101-
sortConfig: this.sortConfig
102-
});
103-
104-
const currentPagination$ = this.paginationService.getCurrentPagination(this.paginationConfig.id, this.paginationConfig);
105-
const currentSort$ = this.paginationService.getCurrentSort(this.paginationConfig.id, this.sortConfig);
106-
107-
this.itemRD$ = observableCombineLatest([currentPagination$, currentSort$]).pipe(
108-
switchMap(([currentPagination, currentSort]) => this.collectionRD$.pipe(
109-
getFirstSucceededRemoteData(),
110-
map((rd) => rd.payload.id),
111-
switchMap((id: string) => {
112-
return this.searchService.search<Item>(
113-
new PaginatedSearchOptions({
114-
scope: id,
115-
pagination: currentPagination,
116-
sort: currentSort,
117-
dsoTypes: [DSpaceObjectType.ITEM]
118-
}), null, true, true, ...BROWSE_LINKS_TO_FOLLOW)
119-
.pipe(toDSpaceObjectListRD()) as Observable<RemoteData<PaginatedList<Item>>>;
120-
}),
121-
startWith(undefined) // Make sure switching pages shows loading component
122-
)
123-
)
124-
);
125-
12668
this.collectionPageRoute$ = this.collectionRD$.pipe(
12769
getAllSucceededRemoteDataPayload(),
12870
map((collection) => getCollectionPageRoute(collection.id))
@@ -133,9 +75,5 @@ export class CollectionPageComponent implements OnInit {
13375
return isNotEmpty(object);
13476
}
13577

136-
ngOnDestroy(): void {
137-
this.paginationService.clearPagination(this.paginationConfig.id);
138-
}
139-
14078

14179
}

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

Lines changed: 15 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,19 @@ import { ThemedCollectionPageComponent } from './themed-collection-page.componen
1818
import { ComcolModule } from '../shared/comcol/comcol.module';
1919
import { DsoSharedModule } from '../dso-shared/dso-shared.module';
2020
import { DsoPageModule } from '../shared/dso-page/dso-page.module';
21+
import { BrowseByPageModule } from '../browse-by/browse-by-page.module';
22+
import { CollectionRecentlyAddedComponent } from './sections/recently-added/collection-recently-added.component';
23+
24+
const DECLARATIONS = [
25+
CollectionPageComponent,
26+
ThemedCollectionPageComponent,
27+
CreateCollectionPageComponent,
28+
DeleteCollectionPageComponent,
29+
EditItemTemplatePageComponent,
30+
ThemedEditItemTemplatePageComponent,
31+
CollectionItemMapperComponent,
32+
CollectionRecentlyAddedComponent,
33+
];
2134

2235
@NgModule({
2336
imports: [
@@ -30,15 +43,10 @@ import { DsoPageModule } from '../shared/dso-page/dso-page.module';
3043
ComcolModule,
3144
DsoSharedModule,
3245
DsoPageModule,
46+
BrowseByPageModule,
3347
],
3448
declarations: [
35-
CollectionPageComponent,
36-
ThemedCollectionPageComponent,
37-
CreateCollectionPageComponent,
38-
DeleteCollectionPageComponent,
39-
EditItemTemplatePageComponent,
40-
ThemedEditItemTemplatePageComponent,
41-
CollectionItemMapperComponent
49+
...DECLARATIONS,
4250
],
4351
providers: [
4452
SearchService,
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<ng-container *ngVar="(itemRD$ | async) as itemRD">
2+
<div class="mt-4" *ngIf="itemRD?.hasSucceeded" @fadeIn>
3+
<h3 class="sr-only">{{'collection.page.browse.recent.head' | translate}}</h3>
4+
<ds-viewable-collection
5+
[config]="paginationConfig"
6+
[sortConfig]="sortConfig"
7+
[objects]="itemRD"
8+
[hideGear]="true">
9+
</ds-viewable-collection>
10+
</div>
11+
<ds-error *ngIf="itemRD?.hasFailed"
12+
message="{{'error.recent-submissions' | translate}}"></ds-error>
13+
<ds-themed-loading *ngIf="!itemRD || itemRD.isLoading"
14+
message="{{'loading.recent-submissions' | translate}}"></ds-themed-loading>
15+
<div *ngIf="!itemRD?.isLoading && itemRD?.payload?.page.length === 0" class="alert alert-info w-100" role="alert">
16+
{{'collection.page.browse.recent.empty' | translate}}
17+
</div>
18+
</ng-container>

src/app/community-page/sections/community-browse-section/community-browse-section.component.html renamed to src/app/collection-page/sections/recently-added/collection-recently-added.component.scss

File renamed without changes.

0 commit comments

Comments
 (0)