moved view logic back to ItemComponent

2025-10-07 10:04:11 +00:00 · 2023-01-20 16:11:56 -08:00
parent 00bf90d8ea
commit 6e052af1f0
14 changed files with 115 additions and 83 deletions
--- a/src/app/entity-groups/journal-entities/item-pages/journal-issue/journal-issue.component.html
+++ b/src/app/entity-groups/journal-entities/item-pages/journal-issue/journal-issue.component.html
@@ -1,4 +1,4 @@
-<ds-themed-results-back-button></ds-themed-results-back-button>
+<ds-themed-results-back-button *ngIf="showBackButton | async"></ds-themed-results-back-button>
 <div class="d-flex flex-row">
  <ds-item-page-title-field [item]="object" class="mr-auto">
  </ds-item-page-title-field>
--- a/src/app/entity-groups/journal-entities/item-pages/journal-volume/journal-volume.component.html
+++ b/src/app/entity-groups/journal-entities/item-pages/journal-volume/journal-volume.component.html
@@ -1,4 +1,4 @@
-<ds-themed-results-back-button></ds-themed-results-back-button>
+<ds-themed-results-back-button *ngIf="showBackButton | async"></ds-themed-results-back-button>
 <div class="d-flex flex-row">
  <ds-item-page-title-field [item]="object" class="mr-auto">
  </ds-item-page-title-field>
--- a/src/app/entity-groups/journal-entities/item-pages/journal/journal.component.html
+++ b/src/app/entity-groups/journal-entities/item-pages/journal/journal.component.html
@@ -1,4 +1,4 @@
-<ds-themed-results-back-button></ds-themed-results-back-button>
+<ds-themed-results-back-button *ngIf="showBackButton | async"></ds-themed-results-back-button>
 <div class="d-flex flex-row">
  <ds-item-page-title-field [item]="object" class="mr-auto">
  </ds-item-page-title-field>
--- a/src/app/entity-groups/research-entities/item-pages/org-unit/org-unit.component.html
+++ b/src/app/entity-groups/research-entities/item-pages/org-unit/org-unit.component.html
@@ -1,4 +1,4 @@
-<ds-themed-results-back-button></ds-themed-results-back-button>
+<ds-themed-results-back-button *ngIf="showBackButton | async"></ds-themed-results-back-button>
 <div class="d-flex flex-row">
  <ds-item-page-title-field [item]="object" class="mr-auto">
  </ds-item-page-title-field>
--- a/src/app/entity-groups/research-entities/item-pages/person/person.component.html
+++ b/src/app/entity-groups/research-entities/item-pages/person/person.component.html
@@ -1,4 +1,4 @@
-<ds-themed-results-back-button></ds-themed-results-back-button>
+<ds-themed-results-back-button *ngIf="showBackButton | async"></ds-themed-results-back-button>
 <div class="d-flex flex-row">
  <ds-item-page-title-field class="mr-auto" [item]="object">
  </ds-item-page-title-field>
--- a/src/app/entity-groups/research-entities/item-pages/project/project.component.html
+++ b/src/app/entity-groups/research-entities/item-pages/project/project.component.html
@@ -1,4 +1,4 @@
-<ds-themed-results-back-button></ds-themed-results-back-button>
+<ds-themed-results-back-button *ngIf="showBackButton | async"></ds-themed-results-back-button>
 <div class="d-flex flex-row">
  <ds-item-page-title-field [item]="object" class="mr-auto">
  </ds-item-page-title-field>
--- a/src/app/item-page/simple/item-types/publication/publication.component.html
+++ b/src/app/item-page/simple/item-types/publication/publication.component.html
@@ -1,4 +1,4 @@
-<ds-themed-results-back-button></ds-themed-results-back-button>
+<ds-themed-results-back-button *ngIf="showBackButton | async"></ds-themed-results-back-button>
 <div class="row" *ngIf="iiifEnabled">
  <div class="col-12">
    <ds-mirador-viewer  id="iiif-viewer"
--- a/src/app/item-page/simple/item-types/shared/item.component.spec.ts
+++ b/src/app/item-page/simple/item-types/shared/item.component.spec.ts
@@ -41,6 +41,8 @@ import { ResearcherProfileDataService } from '../../../../core/profile/researche

 import { buildPaginatedList } from '../../../../core/data/paginated-list.model';
 import { PageInfo } from '../../../../core/shared/page-info.model';
+import { Router } from '@angular/router';
+import { ItemComponent } from './item.component';

 export function getIIIFSearchEnabled(enabled: boolean): MetadataValue {
  return Object.assign(new MetadataValue(), {
@@ -400,5 +402,93 @@ describe('ItemComponent', () => {
      ]
    },
  });
+  describe('back to results', () => {
+    let comp: ItemComponent;
+    let fixture: ComponentFixture<any>;
+    let router: Router;
+
+    const searchUrl = '/search?query=test&spc.page=2';
+    const browseUrl = '/browse/title?scope=0cc&bbm.page=3';
+    const recentSubmissionsUrl = '/collections/be7b8430-77a5-4016-91c9-90863e50583a?cp.page=3';
+
+    beforeEach(waitForAsync(() => {
+      TestBed.configureTestingModule({
+        imports: [
+          TranslateModule.forRoot({
+            loader: {
+              provide: TranslateLoader,
+              useClass: TranslateLoaderMock
+            }
+          }),
+          RouterTestingModule,
+        ],
+        declarations: [ItemComponent, GenericItemPageFieldComponent, TruncatePipe ],
+        providers: [
+          { provide: ItemDataService, useValue: {} },
+          { provide: TruncatableService, useValue: {} },
+          { provide: RelationshipDataService, useValue: {} },
+          { provide: ObjectCacheService, useValue: {} },
+          { provide: UUIDService, useValue: {} },
+          { provide: Store, useValue: {} },
+          { provide: RemoteDataBuildService, useValue: {} },
+          { provide: CommunityDataService, useValue: {} },
+          { provide: HALEndpointService, useValue: {} },
+          { provide: HttpClient, useValue: {} },
+          { provide: DSOChangeAnalyzer, useValue: {} },
+          { provide: VersionHistoryDataService, useValue: {} },
+          { provide: VersionDataService, useValue: {} },
+          { provide: NotificationsService, useValue: {} },
+          { provide: DefaultChangeAnalyzer, useValue: {} },
+          { provide: BitstreamDataService, useValue: {} },
+          { provide: WorkspaceitemDataService, useValue: {} },
+          { provide: SearchService, useValue: {} },
+          { provide: RouteService, useValue: mockRouteService },
+          { provide: AuthorizationDataService, useValue: {} },
+          { provide: ResearcherProfileDataService, useValue: {} }
+        ],
+        schemas: [NO_ERRORS_SCHEMA]
+      }).overrideComponent(ItemComponent, {
+        set: {changeDetection: ChangeDetectionStrategy.Default}
+      });
+    }));
+
+    beforeEach(waitForAsync(() => {
+      router = TestBed.inject(Router);
+      spyOn(router, 'navigateByUrl');
+      TestBed.compileComponents();
+      fixture = TestBed.createComponent(ItemComponent);
+      comp = fixture.componentInstance;
+      comp.object = mockItem;
+      fixture.detectChanges();
+    }));
+
+    it('should hide back button',() => {
+      spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf('/item'));
+      comp.showBackButton.subscribe((val) => {
+        expect(val).toBeFalse();
+      });
+    });
+    it('should show back button for search', () => {
+      spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf(searchUrl));
+      comp.ngOnInit();
+      comp.showBackButton.subscribe((val) => {
+        expect(val).toBeTrue();
+      });
+    });
+    it('should show back button for browse', () => {
+      spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf(browseUrl));
+      comp.ngOnInit();
+      comp.showBackButton.subscribe((val) => {
+        expect(val).toBeTrue();
+      });
+    });
+    it('should show back button for recent submissions', () => {
+      spyOn(mockRouteService, 'getPreviousUrl').and.returnValue(observableOf(recentSubmissionsUrl));
+      comp.ngOnInit();
+      comp.showBackButton.subscribe((val) => {
+        expect(val).toBeTrue();
+      });
+    });
+  });

 });
--- a/src/app/item-page/simple/item-types/shared/item.component.ts
+++ b/src/app/item-page/simple/item-types/shared/item.component.ts
@@ -5,6 +5,7 @@ import { getItemPageRoute } from '../../../item-page-routing-paths';
 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';

@Component({
  selector: 'ds-item',
@@ -16,6 +17,11 @@ import { getDSpaceQuery, isIiifEnabled, isIiifSearchEnabled } from './item-iiif-
 export class ItemComponent implements OnInit {
  @Input() object: Item;

+  /**
+   * Used to show or hide the back to results button.
+   */
+  showBackButton: Observable<boolean>;
+
  /**
   * Route to the item page
   */
@@ -42,6 +48,12 @@ export class ItemComponent implements OnInit {
    this.mediaViewer = environment.mediaViewer;
  }
  ngOnInit(): void {
+
+    this.showBackButton = this.routeService.getPreviousUrl().pipe(
+      filter(url => /^(\/search|\/browse|\/collections|\/admin\/search|\/mydspace)/.test(url)),
+      take(1),
+      map(() => true)
+    );
    this.itemPageRoute = getItemPageRoute(this.object);
    // check to see if iiif viewer is required.
    this.iiifEnabled = isIiifEnabled(this.object);
--- a/src/app/item-page/simple/item-types/untyped-item/untyped-item.component.html
+++ b/src/app/item-page/simple/item-types/untyped-item/untyped-item.component.html
@@ -1,4 +1,4 @@
-<ds-themed-results-back-button></ds-themed-results-back-button>
+<ds-themed-results-back-button *ngIf="showBackButton | async"></ds-themed-results-back-button>
 <div class="row" *ngIf="iiifEnabled">
  <div class="col-12">
    <ds-mirador-viewer id="iiif-viewer"
--- a/src/app/shared/browse-by/browse-by.component.html
+++ b/src/app/shared/browse-by/browse-by.component.html
@@ -4,8 +4,7 @@
  <div *ngIf="objects?.hasSucceeded && !objects?.isLoading && objects?.payload?.page.length > 0" @fadeIn>
      <div *ngIf="shouldDisplayResetButton$ |async" class="mb-2 reset">
        <ds-results-back-button [paginationConfig]="paginationConfig"
-                                [previousPage$]="previousPage$"
-                                [alwaysShowButton]=true></ds-results-back-button>
+                                [previousPage$]="previousPage$"></ds-results-back-button>
      </div>
    <ds-viewable-collection
      [config]="paginationConfig"
@@ -21,8 +20,7 @@
  <div *ngIf="!objects?.isLoading && objects?.payload?.page.length === 0">
    <div *ngIf="shouldDisplayResetButton$ |async" class="d-inline-block mb-4 reset">
      <ds-results-back-button [paginationConfig]="paginationConfig"
-                              [previousPage$]="previousPage$"
-                              [alwaysShowButton]=true></ds-results-back-button>
+                              [previousPage$]="previousPage$"></ds-results-back-button>
    </div>
    <div class="alert alert-info w-100" role="alert">
      {{'browse.empty' | translate}}
--- a/src/app/shared/results-back-button/results-back-button.component.html
+++ b/src/app/shared/results-back-button/results-back-button.component.html
@@ -1,4 +1,4 @@
-<button *ngIf="showBackButton" class="btn btn-secondary btn-sm mb-2 ng-tns-c242-28" (click)="back()">
+<button class="btn btn-secondary btn-sm mb-2 ng-tns-c242-28" (click)="back()">
  <i _ngcontent-dspace-angular-c242="" class="fas fa-arrow-left ng-tns-c242-3"></i>
  {{this.buttonLabel | async}}
 </button>
--- a/src/app/shared/results-back-button/results-back-button.component.spec.ts
+++ b/src/app/shared/results-back-button/results-back-button.component.spec.ts
@@ -9,7 +9,6 @@ import { Router } from '@angular/router';
 import { PaginationComponentOptions } from '../pagination/pagination-component-options.model';
 import { PaginationService } from '../../core/pagination/pagination.service';
 import { PaginationServiceStub } from '../testing/pagination-service.stub';
-import { By } from '@angular/platform-browser';

 describe('ResultsBackButtonComponent', () => {

@@ -77,11 +76,7 @@ describe('ResultsBackButtonComponent', () => {
        expect(translate.get).toHaveBeenCalledWith('browse.back.all-results');
      });

-      it('should navigate to previous pagination', () => {
-        component.back();
-        expect(mockRouteService.getPreviousUrl).toHaveBeenCalled();
-        expect(paginationService.updateRoute).toHaveBeenCalled();
-      });
+

    });

@@ -106,41 +101,5 @@ describe('ResultsBackButtonComponent', () => {

  });

-  describe('back to results', () => {
-
-    const mockRouteService = getMockRouteService(nonSearchUrl);
-
-    beforeEach(waitForAsync(() => {
-      TestBed.configureTestingModule({
-        declarations: [ResultsBackButtonComponent],
-        imports: [TranslateModule.forRoot(),
-          RouterTestingModule.withRoutes([])
-        ],
-        providers: [
-          {provide: RouteService, useValue: mockRouteService},
-          {provide: PaginationService, useValue: paginationService},
-          {provide: Router, useValue: router},
-          {provide: TranslateService, useValue: translate}
-        ],
-        schemas: [NO_ERRORS_SCHEMA]
-      }).compileComponents();
-      spyOn(mockRouteService, 'getPreviousUrl').and.callThrough();
-    }));
-
-    describe('previous route not search or browse list', () => {
-      beforeEach(waitForAsync(() => {
-        fixture = TestBed.createComponent(ResultsBackButtonComponent);
-        component = fixture.componentInstance;
-        component.ngOnInit();
-        fixture.detectChanges();
-      }));
-
-      it('should hide back button', () => {
-        let button = fixture.debugElement.query(By.css('button'));
-        expect(button).toBeNull();
-      });
-    });
-
-  });
 });

--- a/src/app/shared/results-back-button/results-back-button.component.ts
+++ b/src/app/shared/results-back-button/results-back-button.component.ts
@@ -1,5 +1,5 @@
 import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core';
-import { filter, map, take } from 'rxjs/operators';
+import { take } from 'rxjs/operators';
 import { RouteService } from '../../core/services/route.service';
 import { Router } from '@angular/router';
 import { PaginationService } from '../../core/pagination/pagination.service';
@@ -29,19 +29,6 @@ export class ResultsBackButtonComponent implements OnInit {
   */
  @Input() paginationConfig?: PaginationComponentOptions;

-  /**
-   * Tells component to always show the back button.
-   * When not true the button is displayed based on
-   * the previous route.
-   */
-  @Input() alwaysShowButton?: boolean;
-
-  /**
-   * Always show back button when true regardless of
-   * previous route.
-   */
-  showBackButton: boolean;
-
  /**
   * The button text
   */
@@ -60,20 +47,6 @@ export class ResultsBackButtonComponent implements OnInit {
    } else {
      this.buttonLabel = this.translateService.get('search.browse.item-back');
    }
-
-    if (this.alwaysShowButton) {
-      this.showBackButton = true;
-    } else {
-      // Show the back button when the previous route was a search or browse list.
-      // Include the button for admin search results and MyDspace.
-      this.routeService.getPreviousUrl().pipe(
-        filter(url => /^(\/search|\/browse|\/collections|\/admin\/search|\/mydspace)/.test(url)),
-        take(1),
-        map(() => true)
-      ).subscribe(showButton => {
-        this.showBackButton = showButton;
-      });
-    }
  }

  /**