hazza/dspace-angular
1
0
Fork 1
mirror of https://github.com/DSpace/dspace-angular.git synced 2025-10-07 10:04:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

Convert to themed, shared component

Browse Source
This commit is contained in:
Michael Spalti
2022-12-19 12:32:53 -08:00
parent 9fefe064bf
commit d029e80495
22 changed files with 148 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/entity-groups/journal-entities/item-pages/journal-issue/journal-issue.component.html
View File

@@ -1,8 +1,6 @@
<div class="row" *ngIf="showBackButton | async" (click)="back()">
<div class="row" *ngIf="showBackButton | async">
<div class="col-12">
<button class="btn btn-secondary back-btn ng-tns-c242-28" >
<i _ngcontent-dspace-angular-c242="" class="fas fa-arrow-left ng-tns-c242-3"></i>
{{"search-browse-item-return" | translate}}</button>
<ds-themed-item-back-button></ds-themed-item-back-button>
</div>
</div>

6
src/app/entity-groups/journal-entities/item-pages/journal-volume/journal-volume.component.html
View File

@@ -1,8 +1,6 @@
<div class="row" *ngIf="showBackButton | async" (click)="back()">
<div class="row" *ngIf="showBackButton | async">
<div class="col-12">
<button class="btn btn-secondary back-btn ng-tns-c242-28" >
<i _ngcontent-dspace-angular-c242="" class="fas fa-arrow-left ng-tns-c242-3"></i>
{{"search-browse-item-return" | translate}}</button>
<ds-themed-item-back-button></ds-themed-item-back-button>
</div>
</div>

6
src/app/entity-groups/journal-entities/item-pages/journal/journal.component.html
View File

@@ -1,8 +1,6 @@
<div class="row" *ngIf="showBackButton | async" (click)="back()">
<div class="row" *ngIf="showBackButton | async">
<div class="col-12">
<button class="btn btn-secondary back-btn ng-tns-c242-28" >
<i _ngcontent-dspace-angular-c242="" class="fas fa-arrow-left ng-tns-c242-3"></i>
{{"search-browse-item-return" | translate}}</button>
<ds-themed-item-back-button></ds-themed-item-back-button>
</div>
</div>

6
src/app/entity-groups/research-entities/item-pages/org-unit/org-unit.component.html
View File

@@ -1,8 +1,6 @@
<div class="row" *ngIf="showBackButton | async" (click)="back()">
<div class="row" *ngIf="showBackButton | async">
<div class="col-12">
<button class="btn btn-secondary back-btn ng-tns-c242-28" >
<i _ngcontent-dspace-angular-c242="" class="fas fa-arrow-left ng-tns-c242-3"></i>
{{"search-browse-item-return" | translate}}</button>
<ds-themed-item-back-button></ds-themed-item-back-button>
</div>
</div>

6
src/app/entity-groups/research-entities/item-pages/person/person.component.html
View File

@@ -1,8 +1,6 @@
<div class="row" *ngIf="showBackButton | async" (click)="back()">
<div class="row" *ngIf="showBackButton | async">
<div class="col-12">
<button class="btn btn-secondary back-btn ng-tns-c242-28" >
<i _ngcontent-dspace-angular-c242="" class="fas fa-arrow-left ng-tns-c242-3"></i>
{{"search-browse-item-return" | translate}}</button>
<ds-themed-item-back-button></ds-themed-item-back-button>
</div>
</div>

6
src/app/entity-groups/research-entities/item-pages/project/project.component.html
View File

@@ -1,8 +1,6 @@
<div class="row" *ngIf="showBackButton | async" (click)="back()">
<div class="row" *ngIf="showBackButton | async">
<div class="col-12">
<button class="btn btn-secondary back-btn ng-tns-c242-28" >
<i _ngcontent-dspace-angular-c242="" class="fas fa-arrow-left ng-tns-c242-3"></i>
{{"search-browse-item-return" | translate}}</button>
<ds-themed-item-back-button></ds-themed-item-back-button>
</div>
</div>

6
src/app/item-page/simple/item-types/publication/publication.component.html
View File

@@ -1,8 +1,6 @@
<div class="row" *ngIf="showBackButton | async" (click)="back()">
<div class="row" *ngIf="showBackButton | async">
<div class="col-12">
<button class="btn btn-secondary back-btn ng-tns-c242-28" >
<i _ngcontent-dspace-angular-c242="" class="fas fa-arrow-left ng-tns-c242-3"></i>
{{"search-browse-item-return" | translate}}</button>
<ds-themed-item-back-button></ds-themed-item-back-button>
</div>
</div>

18
src/app/item-page/simple/item-types/shared/item.component.spec.ts
View File

@@ -478,24 +478,6 @@ describe('ItemComponent', () => {
expect(val).toBeTrue();
});
});
it('should navigate back to the search list', () => {
spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf(searchUrl));
comp.back();
expect(mockRouteService.getPreviousUrl).toHaveBeenCalled();
expect(router.navigateByUrl).toHaveBeenCalledWith(searchUrl);
});
it('should navigate back to the browse list', () => {
spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf(browseUrl));
comp.back();
expect(mockRouteService.getPreviousUrl).toHaveBeenCalled();
expect(router.navigateByUrl).toHaveBeenCalledWith(browseUrl);
});
it('should navigate back to the recent submissions list', () => {
spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf(recentSubmissionsUrl));
comp.back();
expect(mockRouteService.getPreviousUrl).toHaveBeenCalled();
expect(router.navigateByUrl).toHaveBeenCalledWith(recentSubmissionsUrl);
});
});
});

16
src/app/item-page/simple/item-types/shared/item.component.ts
View File

@@ -6,7 +6,6 @@ import { RouteService } from '../../../../core/services/route.service';
import { Observable } from 'rxjs';
import { getDSpaceQuery, isIiifEnabled, isIiifSearchEnabled } from './item-iiif-utils';
import { filter, map, take } from 'rxjs/operators';
import { Router } from '@angular/router';
@Component({
selector: 'ds-item',
@@ -45,22 +44,9 @@ export class ItemComponent implements OnInit {
mediaViewer;
constructor(protected routeService: RouteService,
protected router: Router) {
constructor(protected routeService: RouteService) {
this.mediaViewer = environment.mediaViewer;
}
/**
* Navigate back from the item to the previous pagination url.
*/
public back() {
this.routeService.getPreviousUrl().pipe(
take(1)
).subscribe(
(url => this.router.navigateByUrl(url))
);
}
ngOnInit(): void {
this.itemPageRoute = getItemPageRoute(this.object);
// check to see if iiif viewer is required.

6
src/app/item-page/simple/item-types/untyped-item/untyped-item.component.html
View File

@@ -1,8 +1,6 @@
<div class="row" *ngIf="showBackButton | async" (click)="back()">
<div class="row" *ngIf="showBackButton | async">
<div class="col-12">
<button class="btn btn-secondary back-btn ng-tns-c242-28" >
<i _ngcontent-dspace-angular-c242="" class="fas fa-arrow-left ng-tns-c242-3"></i>
{{"search-browse-item-return" | translate}}</button>
<ds-themed-item-back-button></ds-themed-item-back-button>
</div>
</div>

5
src/app/item-page/simple/item-types/untyped-item/untyped-item.component.spec.ts
View File

@@ -196,11 +196,6 @@ describe('UntypedItemComponent', () => {
it('should retrieve the query term for previous route', (): void => {
expect(comp.iiifQuery$.subscribe(result => expect(result).toEqual('test query')));
});
it('should navigate back to the browse list', () => {
comp.back();
expect(localMockRouteService.getPreviousUrl).toHaveBeenCalled();
//expect(routerSpy.navigateByUrl).toHaveBeenCalledWith(url);
});
});
describe('with IIIF viewer and search but no previous search query', () => {

2
src/app/item-page/simple/item-types/versioned-item/versioned-item.component.ts
View File

@@ -37,7 +37,7 @@ export class VersionedItemComponent extends ItemComponent {
private itemService: ItemDataService,
protected routeService: RouteService,
) {
super(routeService, router);
super(routeService);
}
/**

4
src/app/shared/item-back-button/item-back-button.component.html Normal file
View File

@@ -0,0 +1,4 @@
<button class="btn btn-secondary btn-sm back-btn ng-tns-c242-28" (click)="back()">
<i _ngcontent-dspace-angular-c242="" class="fas fa-arrow-left ng-tns-c242-3"></i>
{{"search-browse-item-return" | translate}}
</button>

4
src/app/shared/item-back-button/item-back-button.component.scss Normal file
View File

@@ -0,0 +1,4 @@
button.back-btn {
margin-bottom: 10px;
}

48
src/app/shared/item-back-button/item-back-button.component.spec.ts Normal file
View File

@@ -0,0 +1,48 @@
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
import { ItemBackButtonComponent } from './item-back-button.component';
import { TranslateModule } from '@ngx-translate/core';
import { NO_ERRORS_SCHEMA } from '@angular/core';
import { RouteService } from '../../core/services/route.service';
import { RouterTestingModule } from '@angular/router/testing';
import { Observable, of } from 'rxjs';
import { Router } from '@angular/router';
describe('ItemBackButtonComponent', () => {
let component: ItemBackButtonComponent;
let fixture: ComponentFixture<ItemBackButtonComponent>;
let router;
const searchUrl = '/search?query=test&spc.page=2';
const mockRouteService = {
getPreviousUrl(): Observable<string> {
return of(searchUrl);
}
};
beforeEach(waitForAsync(() => {
TestBed.configureTestingModule({
declarations: [ItemBackButtonComponent],
imports: [TranslateModule.forRoot(),
RouterTestingModule],
providers: [
{ provide: RouteService, useValue: {} },
],
schemas: [NO_ERRORS_SCHEMA]
}).compileComponents();
beforeEach(waitForAsync(() => {
router = TestBed.inject(Router);
spyOn(router, 'navigateByUrl');
spyOn(mockRouteService, 'getPreviousUrl');
fixture = TestBed.createComponent(ItemBackButtonComponent);
component = fixture.componentInstance;
}));
describe('back button click', () => {
component.back();
expect(mockRouteService.getPreviousUrl).toHaveBeenCalled();
expect(router.navigateByUrl).toHaveBeenCalledWith(searchUrl);
});
}));
});

32
src/app/shared/item-back-button/item-back-button.component.ts Normal file
View File

@@ -0,0 +1,32 @@
import { ChangeDetectionStrategy, Component } from '@angular/core';
import { take } from 'rxjs/operators';
import { RouteService } from '../../core/services/route.service';
import { Router } from '@angular/router';
@Component({
selector: 'ds-item-back-button',
styleUrls: ['./item-back-button.component.scss'],
templateUrl: './item-back-button.component.html',
changeDetection: ChangeDetectionStrategy.OnPush,
})
/**
* Component to add back to result list button to item.
*/
export class ItemBackButtonComponent {
constructor(protected routeService: RouteService,
protected router: Router) {
}
/**
* Navigate back from the item to the previous pagination url.
*/
public back() {
this.routeService.getPreviousUrl().pipe(
take(1)
).subscribe(
(url => this.router.navigateByUrl(url))
);
}
}

23
src/app/shared/item-back-button/themed-item-back-button.component.ts Normal file
View File

@@ -0,0 +1,23 @@
import { Component } from '@angular/core';
import { ThemedComponent } from '../theme-support/themed.component';
import { ItemBackButtonComponent } from './item-back-button.component';
@Component({
selector: 'ds-themed-item-back-button',
styleUrls: [],
templateUrl: '../theme-support/themed.component.html',
})
export class ThemedItemBackButtonComponent extends ThemedComponent<ItemBackButtonComponent> {
protected getComponentName(): string {
return 'ItemBackButtonComponent';
}
protected importThemedComponent(themeName: string): Promise<any> {
return import(`../../../themes/${themeName}/app/shared/item-back-button/item-back-button.component`);
}
protected importUnthemedComponent(): Promise<any> {
return import(`./item-back-button.component`);
}
}

4
src/app/shared/shared.module.ts
View File

@@ -326,6 +326,8 @@ import { GoogleRecaptchaModule } from '../core/google-recaptcha/google-recaptcha
import {
ListableNotificationObjectComponent
} from './object-list/listable-notification-object/listable-notification-object.component';
import { ItemBackButtonComponent } from './item-back-button/item-back-button.component';
import { ThemedItemBackButtonComponent } from './item-back-button/themed-item-back-button.component';
const MODULES = [
CommonModule,
@@ -410,6 +412,8 @@ const COMPONENTS = [
ItemSubmitterComponent,
ItemDetailPreviewComponent,
ItemDetailPreviewFieldComponent,
ItemBackButtonComponent,
ThemedItemBackButtonComponent,
ClaimedTaskActionsComponent,
ClaimedTaskActionsApproveComponent,
ClaimedTaskActionsRejectComponent,

0
src/themes/custom/app/shared/item-back-button/item-back-button.component.html Normal file
View File

0
src/themes/custom/app/shared/item-back-button/item-back-button.component.scss Normal file
View File

13
src/themes/custom/app/shared/item-back-button/item-back-button.component.ts Normal file
View File

@@ -0,0 +1,13 @@
import {
ItemBackButtonComponent as BaseComponent
} from '../../../../../app/shared/item-back-button/item-back-button.component';
import { Component } from '@angular/core';
@Component({
selector: 'ds-item-back-button',
// styleUrls: ['./item-back-button.component.scss'],
styleUrls: ['../../../../../app/shared/item-back-button/item-back-button.component.scss'],
//templateUrl: './item-back-button.component.html',
templateUrl: '../../../../../app/shared/item-back-button/item-back-button.component.html'
})
export class ItemBackButtonComponent extends BaseComponent {}

2
src/themes/custom/eager-theme.module.ts
View File

@@ -43,6 +43,7 @@ import {
import { CommunityListElementComponent } from './app/shared/object-list/community-list-element/community-list-element.component';
import { CollectionListElementComponent} from './app/shared/object-list/collection-list-element/collection-list-element.component';
import { ItemBackButtonComponent } from './app/shared/item-back-button/item-back-button.component';
/**
@@ -74,6 +75,7 @@ const DECLARATIONS = [
EditCollectionSelectorComponent,
EditCommunitySelectorComponent,
EditItemSelectorComponent,
ItemBackButtonComponent
];
@NgModule({