[ADF-2055] Ability to pre-populate form with a file and values (#2834)

* fix translations form

* fix style webpack script

* fix tslint error problem in viewer

* fix naming problems in attach file widget

* add start process form values data initialization option

* fix translation problems

* missing return type

* start process name configuration

* add CS cross PS configuration

* start process from file example

* fix minor issues

* add documentation and move the dialog in a separate component

* easy test select app

* alfrescoRepositoryName right property

* file conversion test

* fix issue after CR

* Remove forgotten semicolon.

demo-shell/package.json

@@ -6,7 +6,7 @@
   "scripts": {
     "ng": "ng",
     "start": "npm run server-versions && rimraf dist && ng serve --host 0.0.0.0 --app dist --open --aot=false",
-    "start:dev": "npm run lint && npm run server-versions && rimraf dist && npm run clean-lib-angular && concurrently \"ng serve --host 0.0.0.0 --disable-host-check --app dev pp-dev --proxy-config proxy.conf.js --open\" \"npm run style:dev - --watch\" ",
+    "start:dev": "npm run lint && npm run server-versions && rimraf dist && npm run clean-lib-angular && concurrently \"ng serve --host 0.0.0.0 --disable-host-check --app dev pp-dev --proxy-config proxy.conf.js --open\" \"npm run style:dev -- --watch\" ",
     "start:dist": "npm run server-versions && rimraf dist && node --max_old_space_size=30000 node_modules/.bin/ng serve --prod --build-optimizer=false  --aot=false --host 0.0.0.0 --disable-host-check --app dist",
     "build": "npm run server-versions && rimraf dist && ng build  --app dist",
     "build:dev": "npm run lint && npm run style:dev && npm run server-versions && rimraf dist && ng build --app dev",

demo-shell/resources/i18n/en.json

@@ -3,7 +3,11 @@
     "VERSION": {
       "NO_PERMISSION": "You don't have permission to manage versions of this content",
       "NO_PERMISSION_EVENT": "You don't have ${event.permission} permission to ${event.action} the ${event.type}",
-      "CHOOSE_FILE": "Select a file to see its versions"
+      "CHOOSE_FILE": "Select a file to see its versions",
+      "DIALOG": {
+        "CLOSE": "Close",
+        "TITLE": "Manage versions"
+      }
     },
     "APP_LAYOUT": {
         "APP_NAME": "ADF Demo Application",
@@ -50,7 +54,8 @@
                 "DOWNLOAD": "Download",
                 "COPY": "Copy",
                 "MOVE": "Move",
-                "DELETE": "Delete"
+                "DELETE": "Delete",
+                "PROCESS_ACTION": "Start Process"
             }
         }
     },

demo-shell/src/app/components/files/files.component.html

@@ -191,6 +191,7 @@
                         format="timeAgo"
                         class="desktop-only">
                     </data-column>
+
                 </data-columns>
 
                 <content-actions>
@@ -268,6 +269,13 @@
                         (success)="onDeleteActionSuccess($event)"
                         handler="delete">
                     </content-action>
+                    <content-action
+                        *ngIf="authenticationService.isBpmLoggedIn()"
+                        icon="play_arrow"
+                        target="document" 
+                        title="{{'DOCUMENT_LIST.ACTIONS.DOCUMENT.PROCESS_ACTION' | translate}}"
+                        (execute)="startProcesAction($event)">
+                    </content-action>
                 </content-actions>
             </adf-document-list>
             <adf-pagination
@@ -290,6 +298,7 @@
                 {{ 'ADF-DOCUMENT-LIST.LAYOUT.LOAD_MORE' | translate }}
             </adf-infinite-pagination>
         </adf-upload-drag-area>
+
         <adf-info-drawer-layout *ngIf="showVersions" class="adf-manage-versions-sidebar" fxFlex="0 0 auto">
             <div info-drawer-content>
                 <ng-container *ngIf="hasOneFileSelected();else choose_document_template">
@@ -318,6 +327,13 @@
 
 <context-menu-holder></context-menu-holder>
 
+<div *ngIf="processId" >
+    <adf-start-process
+        [values]="formValues"
+        [appId]="processId">
+    </adf-start-process>
+</div>
+
 <div class="adf-content-service-settings">
 
     <p>Current folder ID: {{ documentList.currentFolderId }}</p>

demo-shell/src/app/components/files/files.component.ts

@@ -23,14 +23,16 @@ import { MatDialog } from '@angular/material';
 import { ActivatedRoute, Params, Router } from '@angular/router';
 import { MinimalNodeEntity, NodePaging, Pagination, MinimalNodeEntryEntity, SiteEntry } from 'alfresco-js-api';
 import {
-    AlfrescoApiService, ContentService, TranslationService,
+    AlfrescoApiService, AuthenticationService, ContentService, TranslationService,
     FileUploadEvent, FolderCreatedEvent, LogService, NotificationService,
     UploadService, DataColumn, DataRow, UserPreferencesService,
-    PaginationComponent
+    PaginationComponent, FormValues
 } from '@alfresco/adf-core';
 
 import { DocumentListComponent, PermissionStyleModel, DownloadZipDialogComponent } from '@alfresco/adf-content-services';
 
+import { SelectAppsDialogComponent } from '@alfresco/adf-process-services';
+
 import { VersionManagerDialogAdapterComponent } from './version-manager-dialog-adapter.component';
 import { Subscription } from 'rxjs/Rx';
 
@@ -60,6 +62,10 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
         // The identifier of a node. You can also use one of these well-known aliases: -my- | -shared- | -root-
     currentFolderId: string = DEFAULT_FOLDER_TO_SHOW;
 
+    formValues: FormValues = {};
+
+    processId;
+
     @Input()
     selectionMode = 'multiple';
 
@@ -143,7 +149,8 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
                 private router: Router,
                 private logService: LogService,
                 private preference: UserPreferencesService,
-                @Optional() private route: ActivatedRoute) {
+                @Optional() private route: ActivatedRoute,
+                public authenticationService: AuthenticationService) {
     }
 
     showFile(event) {
@@ -208,7 +215,7 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
     }
 
     giveDefaultPaginationWhenNotDefined() {
-        this.pagination =  <Pagination> {
+        this.pagination = <Pagination> {
             maxItems: this.preference.paginationSize,
             skipCount: 0,
             totalItems: 0,
@@ -446,6 +453,20 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
         return false;
     }
 
+    startProcesAction($event) {
+        this.formValues['file'] = $event.value.entry;
+
+        const dialogRef = this.dialog.open(SelectAppsDialogComponent, {
+            width: '630px',
+            panelClass: 'adf-version-manager-dialog'
+        });
+
+        dialogRef.afterClosed().subscribe(selectedProcess => {
+            this.processId = selectedProcess.id;
+        });
+
+    }
+
     onChangePageSize(event: Pagination): void {
         this.preference.paginationSize = event.maxItems;
         this.changedPageSize.emit(event);

demo-shell/src/app/components/files/version-manager-dialog-adapter.component.html

@@ -1,7 +1,7 @@
-<header mat-dialog-title>Manage versions</header>
+<header mat-dialog-title>{{'VERSION.DIALOG.TITLE' | translate}}</header>
 <section mat-dialog-content>
     <adf-version-manager [node]="contentEntry"></adf-version-manager>
 </section>
 <footer mat-dialog-actions fxLayout="row" fxLayoutAlign="end center">
-    <button mat-button (click)="close()">Close</button>
+    <button mat-button (click)="close()">{{'VERSION.DIALOG.CLOSE' | translate}}</button>
 </footer>