results-back-button in cris-layout

src/app/cris-layout/cris-layout.component.html

@@ -1,3 +1,8 @@
+<nav class="navbar navbar-light cris-results-back mb-2" *ngIf="showBackButton | async">
+  <div class="container">
+    <ds-themed-results-back-button  [back]="back"></ds-themed-results-back-button>
+  </div>
+</nav>
 <div class="cris-layout">
 	<ng-container *ngIf="!!tabs$">
 		<ng-container *ngVar="(leadingTabs$ | async) as leadingTabs">

src/app/cris-layout/cris-layout.component.scss

@@ -1,3 +1,7 @@
 .cris-layout {
   margin-top: -1rem;
 }
+.cris-results-back {
+  background-color: var(--ds-cris-layout-navbar-background-color);
+  margin-top: calc(-1 * var(--ds-content-spacing));
+}

src/app/cris-layout/cris-layout.component.ts

@@ -8,8 +8,9 @@ import { filter, map, take } from 'rxjs/operators';
 
 import { getFirstSucceededRemoteData, getPaginatedListPayload, getRemoteDataPayload } from '../core/shared/operators';
 import { isNotEmpty } from '../shared/empty.util';
-import { ActivatedRoute } from '@angular/router';
+import {ActivatedRoute, Router} from '@angular/router';
 import { RemoteData } from '../core/data/remote-data';
+import {RouteService} from '../core/services/route.service';
 
 /**
  * Component for determining what component to use depending on the item's entity type (dspace.entity.type)
@@ -21,6 +22,12 @@ import { RemoteData } from '../core/data/remote-data';
 })
 export class CrisLayoutComponent implements OnInit {
 
+  /**
+   * This regex matches previous routes. The button is shown
+   * for matching paths and hidden in other cases.
+   */
+  previousRoute = /^(\/search|\/browse|\/collections|\/admin\/search|\/mydspace)/;
+
   /**
    * DSpace Item to render
    */
@@ -56,14 +63,28 @@ export class CrisLayoutComponent implements OnInit {
    */
   hasLeadingTab$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
 
-  constructor(private tabService: TabDataService, private router: ActivatedRoute) {
+  /**
+   * Used to show or hide the back to results button in the view.
+   */
+  showBackButton: Observable<boolean>;
+
+  constructor(private tabService: TabDataService,
+              private router: ActivatedRoute,
+              protected routeService: RouteService,
+              protected route: Router) {
   }
 
   /**
    * Get tabs for the specific item
    */
   ngOnInit(): void {
 
+    this.showBackButton = this.routeService.getPreviousUrl().pipe(
+      filter(url => this.previousRoute.test(url)),
+      take(1),
+      map(() => true)
+    );
+
     if (!!this.dataTabs$) {
       this.tabs$ = this.dataTabs$.pipe(
         map((res: any) => {
@@ -127,4 +148,17 @@ export class CrisLayoutComponent implements OnInit {
     );
   }
 
+  /**
+   * The function used to return to list from the item.
+   */
+  back = () => {
+    this.routeService.getPreviousUrl().pipe(
+      take(1)
+    ).subscribe(
+      (url => {
+        this.route.navigateByUrl(url);
+      })
+    );
+  };
+
 }

src/app/cris-layout/cris-layout.module.ts

@@ -111,6 +111,7 @@ import {
 } from './cris-layout-matrix/cris-layout-box-container/boxes/metadata/rendering-types/advanced-attachment/bitstream-attachment/attachment-render/attachment-rendering.module';
 import { FormModule } from '../shared/form/form.module';
 import { CrisLayoutCollectionBoxComponent } from './cris-layout-matrix/cris-layout-box-container/boxes/cris-layout-collection-box/cris-layout-collection-box.component';
+import { ResultsBackButtonModule } from '../shared/results-back-button/results-back-button.module';
 
 const ENTRY_COMPONENTS = [
   // put only entry components that use custom decorator
@@ -174,7 +175,8 @@ const ENTRY_COMPONENTS = [
     MiradorViewerModule,
     MetricsModule,
     AttachmentRenderingModule,
-    FormModule
+    FormModule,
+    ResultsBackButtonModule
   ],
   exports: [
     CrisLayoutComponent,

src/assets/i18n/de.json5

@@ -1772,10 +1772,7 @@
 
 
   // "search.browse.item-back": "Back to Results",
-  // TODO New key - Add a translation
-  "search.browse.item-back": "Back to Results",
-
-
+  "search.browse.item-back": "Zurück zur Trefferliste",
 
   // "bulk-import.abort-on-error" : "Abort on first error",
   // TODO New key - Add a translation