[ACS-5842] - viewer button not working in file details view (#3389)

* [ACS-5842] - viewer details disappear on button click

* Change e2e and unit tests

* Change e2e and unit tests

* Change e2e and unit tests

* Change e2e and unit tests

* Change e2e and unit tests

projects/aca-content/src/lib/components/toolbar/view-node/view-node.component.spec.ts

@@ -25,7 +25,7 @@
 import { TestBed } from '@angular/core/testing';
 import { ViewNodeComponent } from './view-node.component';
 import { Store } from '@ngrx/store';
-import { Router } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 import { of } from 'rxjs';
 import { ViewNodeAction } from '@alfresco/aca-shared/store';
 import { AppTestingModule } from '../../../testing/app-testing.module';
@@ -49,12 +49,15 @@ describe('ViewNodeComponent', () => {
     )
   };
 
+  const route = { queryParams: of({}) };
+
   beforeEach(() => {
     TestBed.configureTestingModule({
       imports: [AppTestingModule, ViewNodeComponent],
       providers: [
         { provide: Store, useValue: mockStore },
-        { provide: Router, useValue: mockRouter }
+        { provide: Router, useValue: mockRouter },
+        { provide: ActivatedRoute, useValue: route }
       ]
     });
 
@@ -98,7 +101,7 @@ describe('ViewNodeComponent', () => {
     expect(mockStore.dispatch).toHaveBeenCalled();
   });
 
-  it('should call ViewNodeAction for `app:filelink` node type', () => {
+  it('should call ViewNodeAction for `app:filelink` node type with proper location', () => {
     const linkNode = {
       file: {
         entry: {
@@ -113,13 +116,20 @@ describe('ViewNodeComponent', () => {
     component.data = {
       iconButton: true
     };
+    mockStore.dispatch.calls.reset();
+    route.queryParams = of({});
     mockStore.select.and.returnValue(of(linkNode));
-
     fixture.detectChanges();
 
     component.onClick();
-
     const id = linkNode.file.entry.properties['cm:destination'];
-    expect(mockStore.dispatch).toHaveBeenCalledWith(new ViewNodeAction(id, { location: mockRouter.url }));
+    expect(mockStore.dispatch).toHaveBeenCalledWith(new ViewNodeAction(id, { location: 'some-url' }));
+
+    mockRouter.url = `some-url/details/${id}`;
+    route.queryParams = of({ location: 'other-location/1234' });
+
+    fixture.detectChanges();
+    component.onClick();
+    expect(mockStore.dispatch).toHaveBeenCalledWith(new ViewNodeAction(id, { location: 'other-location/1234' }));
   });
 });

projects/aca-content/src/lib/components/toolbar/view-node/view-node.component.ts

@@ -25,7 +25,7 @@
 import { Component, ViewEncapsulation, Input } from '@angular/core';
 import { Store } from '@ngrx/store';
 import { AppStore, ViewNodeAction, getAppSelection } from '@alfresco/aca-shared/store';
-import { Router } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 import { take } from 'rxjs/operators';
 import { SharedLinkEntry } from '@alfresco/js-api';
 import { AcaFileAutoDownloadService } from '@alfresco/aca-shared';
@@ -62,7 +62,12 @@ import { MatDialogModule } from '@angular/material/dialog';
 export class ViewNodeComponent {
   @Input() data: { title?: string; menuButton?: boolean; iconButton?: boolean };
 
-  constructor(private store: Store<AppStore>, private router: Router, private fileAutoDownloadService: AcaFileAutoDownloadService) {}
+  constructor(
+    private store: Store<AppStore>,
+    private router: Router,
+    private fileAutoDownloadService: AcaFileAutoDownloadService,
+    private activatedRoute: ActivatedRoute
+  ) {}
 
   onClick() {
     this.store
@@ -79,9 +84,15 @@ export class ViewNodeComponent {
           } else {
             id = (selection.file as SharedLinkEntry).entry.nodeId || (selection.file as any).entry.guid || selection.file.entry.id;
           }
-
-          this.store.dispatch(new ViewNodeAction(id, { location: this.router.url }));
+          this.navigateToViewer(id);
         }
       });
   }
+
+  private navigateToViewer(id: string): void {
+    this.activatedRoute.queryParams.pipe(take(1)).subscribe((params) => {
+      const location = params.location || this.router.url;
+      this.store.dispatch(new ViewNodeAction(id, { location }));
+    });
+  }
 }

projects/aca-content/src/lib/store/effects/node.effects.ts

@@ -54,12 +54,14 @@ import {
 } from '@alfresco/aca-shared/store';
 import { ContentManagementService } from '../../services/content-management.service';
 import { RenditionService } from '@alfresco/adf-content-services';
+import { Router } from '@angular/router';
 
 @Injectable()
 export class NodeEffects {
   constructor(
     private store: Store<AppStore>,
     private actions$: Actions,
+    private router: Router,
     private contentService: ContentManagementService,
     private renditionViewer: RenditionService
   ) {}
@@ -307,7 +309,11 @@ export class NodeEffects {
         map((action) => {
           if (action?.payload) {
             const route = 'personal-files/details';
-            this.store.dispatch(new NavigateRouteAction([route, action.payload.entry.id]));
+            this.router.navigate([route, action.payload.entry.id], {
+              queryParams: {
+                location: this.router.url
+              }
+            });
           } else {
             this.store
               .select(getAppSelection)
@@ -315,7 +321,11 @@ export class NodeEffects {
               .subscribe((selection) => {
                 if (selection && !selection.isEmpty) {
                   const route = 'personal-files/details';
-                  this.store.dispatch(new NavigateRouteAction([route, selection.first.entry.id]));
+                  this.router.navigate([route, selection.first.entry.id], {
+                    queryParams: {
+                      location: this.router.url
+                    }
+                  });
                 }
               });
           }