[ACA-3266] Improve version upload component (#1484)

* added version comparison from ADF

* fix design when smaller device screen

* improved align of content

src/app/dialogs/node-versions/node-versions.dialog.html

@@ -5,6 +5,11 @@
   {{ 'VERSION.DIALOG.TITLE' | translate }}
 </header>
 <section mat-dialog-content *ngIf="!isTypeList">
+  <adf-version-comparison
+    id="adf-version-comparison"
+    [newFileVersion]="file"
+    [node]="node"
+  ></adf-version-comparison>
   <adf-version-upload
     id="adf-version-upload-button"
     [node]="node"

src/app/dialogs/node-versions/node-versions.dialog.spec.ts

@@ -41,6 +41,7 @@ import { Store } from '@ngrx/store';
 import {
   NodeEntityEvent,
   UploadVersionButtonComponent,
+  VersionComparisonComponent,
   VersionListComponent,
   VersionUploadComponent
 } from '@alfresco/adf-content-services';
@@ -49,7 +50,6 @@ import {
   TranslateLoader,
   TranslateModule
 } from '@ngx-translate/core';
-import { MinimalNodeEntryEntity } from '@alfresco/js-api';
 import { AppStore, UnlockWriteAction } from '@alfresco/aca-shared/store';
 
 describe('NodeVersionsDialogComponent', () => {
@@ -71,7 +71,8 @@ describe('NodeVersionsDialogComponent', () => {
         NodeVersionsDialogComponent,
         VersionListComponent,
         VersionUploadComponent,
-        UploadVersionButtonComponent
+        UploadVersionButtonComponent,
+        VersionComparisonComponent
       ],
       providers: [
         {
@@ -105,9 +106,29 @@ describe('NodeVersionsDialogComponent', () => {
     fixture = TestBed.createComponent(NodeVersionsDialogComponent);
     component = fixture.componentInstance;
     component.node = {
-      id: 'file1',
-      properties: {}
-    } as MinimalNodeEntryEntity;
+      id: '1234',
+      name: 'TEST-NODE',
+      isFile: true,
+      nodeType: 'FAKE',
+      isFolder: false,
+      modifiedAt: new Date(),
+      modifiedByUser: null,
+      createdAt: new Date(),
+      createdByUser: null,
+      content: {
+        mimeType: 'text/html',
+        mimeTypeName: 'HTML',
+        sizeInBytes: 13
+      }
+    };
+    component.isTypeList = true;
+    component.file = {
+      name: 'Fake New file',
+      type: 'application/pdf',
+      lastModified: 13,
+      size: 1351,
+      slice: null
+    };
   });
 
   it('should display adf upload version if isTypeList is passed as false from parent component', () => {
@@ -116,7 +137,16 @@ describe('NodeVersionsDialogComponent', () => {
     const adfVersionComponent = document.querySelector(
       '#adf-version-upload-button'
     );
-    expect(adfVersionComponent).toBeDefined();
+    expect(adfVersionComponent).not.toEqual(null);
+  });
+
+  it('should display adf version comparison if isTypeList is passed as false from parent component', () => {
+    component.isTypeList = false;
+    fixture.detectChanges();
+    const adfVersionComparisonComponent = document.querySelector(
+      '#adf-version-comparison'
+    );
+    expect(adfVersionComparisonComponent).not.toEqual(null);
   });
 
   it('should unlock node if is locked when uploading a file', () => {

src/app/dialogs/node-versions/node-versions.dialog.theme.scss

@@ -7,7 +7,7 @@
   }
 
   .adf-version-manager-dialog-panel-upload {
-    height: 280px;
+    height: 500px;
   }
 
   .aca-node-versions-dialog {
@@ -56,13 +56,10 @@
       }
     }
 
-    .adf-new-version-container {
-      height: 350px !important;
-    }
-
     .mat-dialog-content {
-      max-height: 36vh;
+      max-height: 100vh;
       overflow: hidden;
+      padding: 2px 26px;
     }
 
     .mat-list-item-content {