From aad8f15d4a43f4353817cc6d88513a0ac6551993 Mon Sep 17 00:00:00 2001 From: Alexandre Vryghem Date: Tue, 12 Dec 2023 22:00:49 +0100 Subject: [PATCH] 108588: Created separate section for communities & collections browse sections --- .../collection-page-routing.module.ts | 4 +- .../community-page-routing.module.ts | 4 +- src/app/shared/comcol/comcol.module.ts | 6 +- .../comcol-browse-by.component.html | 2 + .../comcol-browse-by.component.scss | 0 .../comcol-browse-by.component.spec.ts | 70 +++++++++++++++++++ .../comcol-browse-by.component.ts | 31 ++++++++ 7 files changed, 112 insertions(+), 5 deletions(-) create mode 100644 src/app/shared/comcol/sections/comcol-browse-by/comcol-browse-by.component.html create mode 100644 src/app/shared/comcol/sections/comcol-browse-by/comcol-browse-by.component.scss create mode 100644 src/app/shared/comcol/sections/comcol-browse-by/comcol-browse-by.component.spec.ts create mode 100644 src/app/shared/comcol/sections/comcol-browse-by/comcol-browse-by.component.ts diff --git a/src/app/collection-page/collection-page-routing.module.ts b/src/app/collection-page/collection-page-routing.module.ts index 1bf51f550c7..5ddef6ca68b 100644 --- a/src/app/collection-page/collection-page-routing.module.ts +++ b/src/app/collection-page/collection-page-routing.module.ts @@ -22,7 +22,7 @@ import { LinkMenuItemModel } from '../shared/menu/menu-item/models/link.model'; import { ThemedCollectionPageComponent } from './themed-collection-page.component'; import { MenuItemType } from '../shared/menu/menu-item-type.model'; import { DSOEditMenuResolver } from '../shared/dso-page/dso-edit-menu.resolver'; -import { BrowseBySwitcherComponent } from '../browse-by/browse-by-switcher/browse-by-switcher.component'; +import { ComcolBrowseByComponent } from '../shared/comcol/sections/comcol-browse-by/comcol-browse-by.component'; import { BrowseByGuard } from '../browse-by/browse-by-guard'; import { BrowseByI18nBreadcrumbResolver } from '../browse-by/browse-by-i18n-breadcrumb.resolver'; import { CollectionRecentlyAddedComponent } from './sections/recently-added/collection-recently-added.component'; @@ -78,7 +78,7 @@ import { CollectionRecentlyAddedComponent } from './sections/recently-added/coll { path: 'browse/:id', pathMatch: 'full', - component: BrowseBySwitcherComponent, + component: ComcolBrowseByComponent, canActivate: [BrowseByGuard], resolve: { breadcrumb: BrowseByI18nBreadcrumbResolver, diff --git a/src/app/community-page/community-page-routing.module.ts b/src/app/community-page/community-page-routing.module.ts index f84fa1c9f74..5ca544bb541 100644 --- a/src/app/community-page/community-page-routing.module.ts +++ b/src/app/community-page/community-page-routing.module.ts @@ -18,7 +18,7 @@ import { DSOEditMenuResolver } from '../shared/dso-page/dso-edit-menu.resolver'; import { SubComColSectionComponent } from './sections/sub-com-col-section/sub-com-col-section.component'; import { BrowseByI18nBreadcrumbResolver } from '../browse-by/browse-by-i18n-breadcrumb.resolver'; import { BrowseByGuard } from '../browse-by/browse-by-guard'; -import { BrowseBySwitcherComponent } from '../browse-by/browse-by-switcher/browse-by-switcher.component'; +import { ComcolBrowseByComponent } from '../shared/comcol/sections/comcol-browse-by/comcol-browse-by.component'; @NgModule({ imports: [ @@ -61,7 +61,7 @@ import { BrowseBySwitcherComponent } from '../browse-by/browse-by-switcher/brows { path: 'browse/:id', pathMatch: 'full', - component: BrowseBySwitcherComponent, + component: ComcolBrowseByComponent, canActivate: [BrowseByGuard], resolve: { breadcrumb: BrowseByI18nBreadcrumbResolver, diff --git a/src/app/shared/comcol/comcol.module.ts b/src/app/shared/comcol/comcol.module.ts index efbcedf2c67..7ce48a3a55d 100644 --- a/src/app/shared/comcol/comcol.module.ts +++ b/src/app/shared/comcol/comcol.module.ts @@ -16,6 +16,8 @@ import { ComcolRoleComponent } from './comcol-forms/edit-comcol-page/comcol-role import { SharedModule } from '../shared.module'; import { FormModule } from '../form/form.module'; import { UploadModule } from '../upload/upload.module'; +import { ComcolBrowseByComponent } from './sections/comcol-browse-by/comcol-browse-by.component'; +import { BrowseByModule } from '../../browse-by/browse-by.module'; const COMPONENTS = [ ComcolPageContentComponent, @@ -29,7 +31,8 @@ const COMPONENTS = [ ComcolPageBrowseByComponent, ThemedComcolPageBrowseByComponent, ComcolRoleComponent, - ThemedComcolPageHandleComponent + ThemedComcolPageHandleComponent, + ComcolBrowseByComponent, ]; @NgModule({ @@ -41,6 +44,7 @@ const COMPONENTS = [ FormModule, SharedModule, UploadModule, + BrowseByModule, ], exports: [ ...COMPONENTS, diff --git a/src/app/shared/comcol/sections/comcol-browse-by/comcol-browse-by.component.html b/src/app/shared/comcol/sections/comcol-browse-by/comcol-browse-by.component.html new file mode 100644 index 00000000000..b7b109643b0 --- /dev/null +++ b/src/app/shared/comcol/sections/comcol-browse-by/comcol-browse-by.component.html @@ -0,0 +1,2 @@ + + diff --git a/src/app/shared/comcol/sections/comcol-browse-by/comcol-browse-by.component.scss b/src/app/shared/comcol/sections/comcol-browse-by/comcol-browse-by.component.scss new file mode 100644 index 00000000000..e69de29bb2d diff --git a/src/app/shared/comcol/sections/comcol-browse-by/comcol-browse-by.component.spec.ts b/src/app/shared/comcol/sections/comcol-browse-by/comcol-browse-by.component.spec.ts new file mode 100644 index 00000000000..6a78815e6b6 --- /dev/null +++ b/src/app/shared/comcol/sections/comcol-browse-by/comcol-browse-by.component.spec.ts @@ -0,0 +1,70 @@ +// eslint-disable-next-line max-classes-per-file +import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { ComcolBrowseByComponent } from './comcol-browse-by.component'; +import { rendersBrowseBy } from '../../../../browse-by/browse-by-switcher/browse-by-decorator'; +import { BrowseByDataType } from '../../../../browse-by/browse-by-switcher/browse-by-data-type'; +import { Component } from '@angular/core'; +import { AbstractBrowseByTypeComponent } from '../../../../browse-by/abstract-browse-by-type.component'; +import { BrowseDefinition } from '../../../../core/shared/browse-definition.model'; +import { ActivatedRouteStub } from '../../../testing/active-router.stub'; +import { ThemeService } from '../../../theme-support/theme.service'; +import { getMockThemeService } from '../../../mocks/theme-service.mock'; +import { BrowseBySwitcherComponent } from '../../../../browse-by/browse-by-switcher/browse-by-switcher.component'; +import { DynamicComponentLoaderDirective } from '../../../abstract-component-loader/dynamic-component-loader.directive'; +import { ActivatedRoute } from '@angular/router'; +import { By } from '@angular/platform-browser'; + +@rendersBrowseBy('ComcolBrowseByComponent' as BrowseByDataType) +@Component({ + // eslint-disable-next-line @angular-eslint/component-selector + selector: '', + template: '', +}) +class BrowseByTestComponent extends AbstractBrowseByTypeComponent { +} + +class TestBrowseByPageBrowseDefinition extends BrowseDefinition { + getRenderType(): BrowseByDataType { + return 'ComcolBrowseByComponent' as BrowseByDataType; + } +} + +describe('ComcolBrowseByComponent', () => { + let component: ComcolBrowseByComponent; + let fixture: ComponentFixture; + + let activatedRoute: ActivatedRouteStub; + let themeService: ThemeService; + + beforeEach(async () => { + activatedRoute = new ActivatedRouteStub(); + themeService = getMockThemeService(); + + await TestBed.configureTestingModule({ + declarations: [ + ComcolBrowseByComponent, + BrowseBySwitcherComponent, + DynamicComponentLoaderDirective, + ], + providers: [ + BrowseByTestComponent, + { provide: ActivatedRoute, useValue: activatedRoute }, + { provide: ThemeService, useValue: themeService }, + ], + }).compileComponents(); + + fixture = TestBed.createComponent(ComcolBrowseByComponent); + component = fixture.componentInstance; + }); + + it('should create the correct browse section based on the route browseDefinition', () => { + activatedRoute.testData = { + browseDefinition: new TestBrowseByPageBrowseDefinition(), + }; + + fixture.detectChanges(); + + expect(component).toBeTruthy(); + expect(fixture.debugElement.query(By.css('#ComcolBrowseByComponent'))).not.toBeNull(); + }); +}); diff --git a/src/app/shared/comcol/sections/comcol-browse-by/comcol-browse-by.component.ts b/src/app/shared/comcol/sections/comcol-browse-by/comcol-browse-by.component.ts new file mode 100644 index 00000000000..ffa89f5328b --- /dev/null +++ b/src/app/shared/comcol/sections/comcol-browse-by/comcol-browse-by.component.ts @@ -0,0 +1,31 @@ +import { Component, OnInit } from '@angular/core'; +import { Observable } from 'rxjs'; +import { BrowseByDataType } from '../../../../browse-by/browse-by-switcher/browse-by-data-type'; +import { ActivatedRoute } from '@angular/router'; +import { map } from 'rxjs/operators'; +import { BrowseDefinition } from '../../../../core/shared/browse-definition.model'; + +@Component({ + selector: 'ds-comcol-browse-by', + templateUrl: './comcol-browse-by.component.html', + styleUrls: ['./comcol-browse-by.component.scss'], +}) +export class ComcolBrowseByComponent implements OnInit { + + browseByType$: Observable; + + constructor( + protected route: ActivatedRoute, + ) { + } + + /** + * Fetch the correct browse-by component by using the relevant config from the route data + */ + ngOnInit(): void { + this.browseByType$ = this.route.data.pipe( + map((data: { browseDefinition: BrowseDefinition }) => data.browseDefinition.getRenderType()), + ); + } + +}