[ACS-8635] ADW: View button not working on create process (#10263)

lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget.component.spec.ts

@@ -35,6 +35,8 @@ import { ProcessTestingModule } from '../../../testing/process.testing.module';
 import { AttachFileWidgetDialogService } from './attach-file-widget-dialog.service';
 import { ActivitiContentService } from '../../services/activiti-alfresco.service';
 import { ProcessContentService } from '../../services/process-content.service';
+import { RouterTestingModule } from '@angular/router/testing';
+import { ActivatedRoute, Router } from '@angular/router';
 
 const fakeRepositoryListAnswer = [
     {
@@ -145,6 +147,8 @@ describe('AttachFileWidgetComponent', () => {
     let fixture: ComponentFixture<AttachFileWidgetComponent>;
     let element: HTMLInputElement;
     let activitiContentService: ActivitiContentService;
+    let router: Router;
+    let activatedRoute: ActivatedRoute;
     let appConfigService: AppConfigService;
     let contentNodeDialogService: ContentNodeDialogService;
     let processContentService: ProcessContentService;
@@ -154,11 +158,24 @@ describe('AttachFileWidgetComponent', () => {
 
     beforeEach(() => {
         TestBed.configureTestingModule({
-            imports: [ProcessTestingModule, AttachFileWidgetComponent]
+            imports: [ProcessTestingModule, AttachFileWidgetComponent, RouterTestingModule],
+            providers: [
+                {
+                    provide: ActivatedRoute,
+                    useValue: {
+                        snapshot: {
+                            queryParams: {}
+                        },
+                        queryParams: of({})
+                    }
+                }
+            ]
         });
         fixture = TestBed.createComponent(AttachFileWidgetComponent);
         widget = fixture.componentInstance;
         element = fixture.nativeElement;
+        router = TestBed.inject(Router);
+        activatedRoute = TestBed.inject(ActivatedRoute);
         activitiContentService = TestBed.inject(ActivitiContentService);
         contentNodeDialogService = TestBed.inject(ContentNodeDialogService);
         processContentService = TestBed.inject(ProcessContentService);
@@ -381,6 +398,7 @@ describe('AttachFileWidgetComponent', () => {
         });
         widget.field.id = 'attach-file-attach';
         widget.field.params = definedSourceParams;
+        spyOn(router, 'navigate');
         spyOn(activitiContentService, 'getAlfrescoRepositories').and.returnValue(of(fakeRepositoryListAnswer));
         spyOn(activitiContentService, 'applyAlfrescoNode').and.returnValue(of(fakePngAnswer));
         spyOn(contentNodeDialogService, 'openFileBrowseDialogByFolderId').and.returnValue(of([fakeNode]));
@@ -401,6 +419,11 @@ describe('AttachFileWidgetComponent', () => {
         await fixture.whenStable();
 
         expect(element.querySelector('#file-1155-icon')).not.toBeNull();
+        expect(router.navigate).toHaveBeenCalledWith([], {
+            relativeTo: activatedRoute,
+            queryParams: { nodes: 'fake' },
+            queryParamsHandling: 'merge'
+        });
     });
 
     it('should be able to upload files from local source', async () => {
@@ -475,6 +498,7 @@ describe('AttachFileWidgetComponent', () => {
         });
 
         it('should remove file when remove is clicked', async () => {
+            spyOn(router, 'navigate');
             const menuButton = element.querySelector<HTMLButtonElement>('#file-1155-option-menu');
             expect(menuButton).not.toBeNull();
             menuButton.click();
@@ -489,6 +513,11 @@ describe('AttachFileWidgetComponent', () => {
             await fixture.whenStable();
 
             expect(element.querySelector('#file-1155')).toBeNull();
+            expect(router.navigate).toHaveBeenCalledWith([], {
+                relativeTo: activatedRoute,
+                queryParams: { nodes: '' },
+                queryParamsHandling: 'merge'
+            });
         });
 
         it('should download file when download is clicked', async () => {

lib/process-services/src/lib/form/widgets/content-widget/attach-file-widget.component.ts

@@ -33,6 +33,7 @@ import { MatIconModule } from '@angular/material/icon';
 import { MatButtonModule } from '@angular/material/button';
 import { MatMenuModule } from '@angular/material/menu';
 import { MatListModule } from '@angular/material/list';
+import { ActivatedRoute, Router } from '@angular/router';
 
 @Component({
     selector: 'attach-widget',
@@ -77,6 +78,8 @@ export class AttachFileWidgetComponent extends UploadWidgetComponent implements
         private contentDialog: ContentNodeDialogService,
         private appConfigService: AppConfigService,
         private downloadService: DownloadService,
+        private router: Router,
+        private activatedRoute: ActivatedRoute,
         private attachDialogService: AttachFileWidgetDialogService
     ) {
         super(formService, thumbnails, processContentService);
@@ -149,6 +152,7 @@ export class AttachFileWidgetComponent extends UploadWidgetComponent implements
         } else {
             this.contentDialog.openFileBrowseDialogByFolderId(params.fileSource.selectedFolder.pathId).subscribe((selections: Node[]) => {
                 this.tempFilesList.push(...selections);
+                this.updateNodesParams();
                 this.uploadFileFromCS(
                     selections,
                     this.field.params.fileSource.selectedFolder.accountId,
@@ -166,6 +170,7 @@ export class AttachFileWidgetComponent extends UploadWidgetComponent implements
     onRemoveAttachFile(file: File | RelatedContentRepresentation) {
         if (this.isTemporaryFile(file)) {
             this.tempFilesList.splice(this.tempFilesList.indexOf((file as RelatedContentRepresentation).contentBlob), 1);
+            this.updateNodesParams();
         }
         this.removeFile(file);
     }
@@ -219,6 +224,7 @@ export class AttachFileWidgetComponent extends UploadWidgetComponent implements
             this.contentDialog.openFileBrowseDialogByDefaultLocation().subscribe((selections: Node[]) => {
                 if (selections.length) {
                     this.tempFilesList.push(...selections);
+                    this.updateNodesParams();
                     this.uploadFileFromCS(selections, `alfresco-${repository.id}-${repository.name}Alfresco`);
                 }
             });
@@ -277,6 +283,18 @@ export class AttachFileWidgetComponent extends UploadWidgetComponent implements
             );
     }
 
+
+    private updateNodesParams(): void {
+        this.router.navigate(
+            [],
+            {
+                relativeTo: this.activatedRoute,
+                queryParams: { nodes: this.tempFilesList.map(file => file.id).join(',') },
+                queryParamsHandling: 'merge'
+            }
+        );
+    }
+
     private getDomainHost(urlToCheck: string): string {
         const result = urlToCheck.match('^(?:https?://)?(?:[^@/\n]+@)?(?:www\\.)?([^:/?\n]+)');
         return result[1];

lib/process-services/src/lib/form/widgets/upload/upload.widget.ts

@@ -77,7 +77,7 @@ export class UploadWidgetComponent extends WidgetComponent implements OnInit {
         const files = event.target.files;
         let filesSaved = [];
 
-        if (this.field.json.value) {
+        if (this.field?.json.value) {
             filesSaved = [...this.field.json.value];
         }