[ADF-2563] Upload new version information dialog (#3235)

* add majorVersion param
move common part in base class

* refactor upload queue

* fix after refactoring

* add comment functionality in versioning
add minor and major option in versioning
add animation in versioning
add new functionality in demo shell

* add animation test

* add missing properties test and base upload class

* fix reload after new version upload [ADF-2582]

* update documentation

* update doc and fix minor style issues

* fix tslint error

* change cachebuster

* ADF-2672 version manager disable buttons

* [ADF-2649] hide show actions in version list

* fix tests

demo-shell/src/app/components/file-view/file-view.component.html

@@ -13,7 +13,8 @@
             <adf-info-drawer-tab [label]="'APP.INFO_DRAWER.VERSIONS' | translate">
                 <mat-card>
                     <mat-card-content>
-                        <adf-version-manager [node]="node" (uploadError)="uploadError($event)">
+                        <adf-version-manager [node]="node"
+                                             (uploadError)="uploadError($event)">
                         </adf-version-manager>
                     </mat-card-content>
                 </mat-card>
@@ -21,7 +22,7 @@
         </adf-info-drawer>
     </ng-template>
 
-    <adf-viewer [fileNodeId]="nodeId" [allowSidebar]="true" [sidebarTemplate]="sidebarTemplate">
+    <adf-viewer [nodeId]="nodeId" [allowSidebar]="true" [sidebarTemplate]="sidebarTemplate">
 
         <adf-viewer-toolbar-actions>
             <button mat-icon-button>

demo-shell/src/app/components/file-view/file-view.component.scss

@@ -0,0 +1,3 @@
+.adf-viewer__sidebar {
+    width: 380px !important;
+}

demo-shell/src/app/components/file-view/file-view.component.ts

@@ -15,24 +15,26 @@
  * limitations under the License.
  */
 
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, ViewEncapsulation } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { AlfrescoApiService } from '@alfresco/adf-core';
 import { MatSnackBar } from '@angular/material';
 
 @Component({
     selector: 'app-file-view',
-    templateUrl: 'file-view.component.html'
+    templateUrl: 'file-view.component.html',
+    styleUrls: ['file-view.component.scss'],
+    encapsulation: ViewEncapsulation.None
 })
 export class FileViewComponent implements OnInit {
 
     nodeId: string = null;
 
-    constructor(
-        private router: Router,
-        private route: ActivatedRoute,
-        private snackBar: MatSnackBar,
-        private apiService: AlfrescoApiService) {}
+    constructor(private router: Router,
+                private route: ActivatedRoute,
+                private snackBar: MatSnackBar,
+                private apiService: AlfrescoApiService) {
+    }
 
     ngOnInit() {
 
@@ -53,7 +55,7 @@ export class FileViewComponent implements OnInit {
         });
     }
 
-    uploadError(errorMessage: string) {
+    onUploadError(errorMessage: string) {
         this.snackBar.open(errorMessage, '', { duration: 4000 });
     }
 }

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

@@ -35,7 +35,7 @@
     <div class="document-list-container" fxLayout="row" fxLayoutAlign="start stretch" fxLayoutGap="16px">
         <adf-upload-drag-area fxFlex="1 1 auto"
                               [disabled]="disableDragArea"
-                              [parentId]="getDocumentListCurrentFolderId()"
+                              [rootFolderId]="getDocumentListCurrentFolderId()"
                               [versioning]="versioning"
                               [adf-node-permission]="'create'"
                               [adf-nodes]="disableDragArea ? getCurrentDocumentListNode() : []">

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

@@ -63,7 +63,7 @@
     }
 
     .adf-manage-versions-sidebar {
-        width: 300px !important;
+        width: 360px !important;
         color: rgba(0, 0, 0, 0.87);
 
         .adf-manage-versions-empty,
@@ -79,25 +79,12 @@
             }
         }
 
-        & ::ng-deep .adf-info-drawer-layout-header {
-            display: none;
+        & .adf-info-drawer-layout-header {
+            display: none !important;
         }
 
-        & ::ng-deep .adf-info-drawer-layout-content {
-            padding: 0;
-
-            .adf-version-upload,
-            .adf-new-version-file-upload {
-                width: 100%;
-
-                & .mat-raised-button {
-                    width: 100%;
-                }
-            }
-
-            .adf-new-version-uploader-container {
-                padding: 8px 24px 16px 24px;
-            }
+        & .adf-info-drawer-layout-content {
+            padding: 10px !important;
         }
     }
 
@@ -143,13 +130,13 @@
             .adf-datatable-table-cell-header {
                 display: none;
             }
-    
+
             .adf-data-table-cell:first-child,
             .adf-datatable-table-cell-header:first-child,
             .adf-data-table-cell:nth-child(2),
             .adf-datatable-table-cell-header:nth-child(2) {
                 display: table-cell;
-            }                 
+            }
         }
 
         .adf-site-container-style {
@@ -172,11 +159,11 @@
 
     @media (max-device-width: 1024px) {
         adf-document-list .adf-data-table {
-    
+
             .adf-data-table-cell:nth-child(4),
             .adf-datatable-table-cell-header:nth-child(4) {
                 display: none;
-            }                 
+            }
         }
-    }    
+    }
 }