Merge pull request #1350 from ds-ashanmugavel/chore/1300-FE-Bug

chore[1300]: added back Button

Author: ds-mwesener

CHANGELOG.md

@@ -10,6 +10,7 @@ _**For better traceability add the corresponding GitHub issue number in each cha
 
 ### Added
 - #908 Add owner field to affected parts view in notification details
+- #1300 Added back button
 
 ### Changed
 - #1252 adapt IRS example response for integration tests to reflect current state

frontend/src/app/modules/shared/modules/relations/presentation/part-relation.component.html

@@ -18,12 +18,23 @@
 
 SPDX-License-Identifier: Apache-2.0
 -->
+<div class="part-relation--header--navigation--container" *ngIf="showMiniMap">
+  <app-button
+    [color]="'primary'"
+    onkeydown="this.navigateBack()"
+    (click)="this.navigateBack()"
+  >
+    <div class="flex justify-between items-center">
+      <mat-icon class="mr-2">arrow_back</mat-icon>
+      {{ 'actions.goBack' | i18n }}
+    </div>
+  </app-button>
+</div>
 
 <ng-container *ngIf="this.rootPart$">
   <ng-container *viewContainer="this.rootPart$ | async; main: partRelationMainTmp; error: errorTmp; loading: loaderTmp">
   </ng-container>
 </ng-container>
-
 <ng-template #partRelationMainTmp let-partDetails="view">
   <div class="part-relation--button-container">
     <app-button

frontend/src/app/modules/shared/modules/relations/presentation/part-relation.component.scss

@@ -29,6 +29,13 @@
   right: 0;
 }
 
+.part-relation--header--navigation--container {
+  position: absolute;
+  top: 10px;
+  left: 10px;
+  z-index: 1000;
+}
+
 .part-relation--button-container {
   display: flex;
   flex-direction: column;

frontend/src/app/modules/shared/modules/relations/presentation/part-relation.component.ts

@@ -19,6 +19,7 @@
  * SPDX-License-Identifier: Apache-2.0
  ********************************************************************************/
 
+import { Location } from '@angular/common';
 import {
   ChangeDetectionStrategy,
   ChangeDetectorRef,
@@ -57,14 +58,14 @@ export class PartRelationComponent implements OnInit, OnDestroy {
   public readonly rootPart$: Observable<View<Part>>;
   public readonly resizeTrigger$: Observable<number>;
   public readonly htmlId: string;
-
   private _rootPart$ = new State<View<Part>>({ loader: true });
   public readonly _resizeTrigger$ = new BehaviorSubject<number>(0);
 
   constructor(
     private readonly partDetailsFacade: PartDetailsFacade,
     private readonly route: ActivatedRoute,
     private readonly cdr: ChangeDetectorRef,
+    private readonly location: Location,
     staticIdService: StaticIdService,
   ) {
     this.resizeTrigger$ = this._resizeTrigger$.pipe(delay(0));
@@ -99,4 +100,8 @@ export class PartRelationComponent implements OnInit, OnDestroy {
   public decreaseSize(): void {
     this._resizeTrigger$.next(-0.1);
   }
+
+  navigateBack() {
+    this.location.back();
+  }
 }