[ADF-4894] Json editor dialog (#5082)

* move download-zip to its own folder

* json dialog

* update docs

* update test

* disable e2e test

* json widget for the Form

* remove deprecated test

* fix tests, update display text name

lib/core/dialogs/dialog.module.ts

@@ -19,7 +19,7 @@ import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 
 import { MaterialModule } from '../material.module';
-import { DownloadZipDialogComponent } from './download-zip.dialog';
+import { DownloadZipDialogComponent } from './download-zip/download-zip.dialog';
 import { TranslateModule } from '@ngx-translate/core';
 import { PipeModule } from '../pipes/pipe.module';
 

lib/core/dialogs/download-zip/download-zip.dialog.html

@@ -2,9 +2,8 @@
 <div mat-dialog-content>
     <mat-progress-bar color="primary" mode="indeterminate"></mat-progress-bar>
 </div>
-<div mat-dialog-actions>
-    <span class="adf-spacer"></span>
+<mat-dialog-actions align="end">
     <button mat-button color="primary" id="cancel-button" (click)="cancelDownload()">
         {{ 'CORE.DIALOG.DOWNLOAD_ZIP.ACTIONS.CANCEL' | translate }}
     </button>
-</div>
+</mat-dialog-actions>

lib/core/dialogs/download-zip/download-zip.dialog.scss

@@ -1,5 +1,3 @@
-.adf-spacer { flex: 1 1 auto; }
-
 .adf-download-zip-dialog .mat-dialog-actions .mat-button-wrapper {
     text-transform: uppercase;
 }

lib/core/dialogs/download-zip/download-zip.dialog.spec.ts

@@ -19,9 +19,9 @@ import { TestBed } from '@angular/core/testing';
 import { ComponentFixture } from '@angular/core/testing';
 import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
 import { DownloadZipDialogComponent } from './download-zip.dialog';
-import { setupTestBed } from '../testing/setupTestBed';
-import { CoreTestingModule } from '../testing/core.testing.module';
-import { DownloadZipService } from '../services/download-zip.service';
+import { setupTestBed } from '../../testing/setupTestBed';
+import { CoreTestingModule } from '../../testing/core.testing.module';
+import { DownloadZipService } from '../../services/download-zip.service';
 import { Observable } from 'rxjs/index';
 
 describe('DownloadZipDialogComponent', () => {

lib/core/dialogs/download-zip/download-zip.dialog.ts

@@ -18,8 +18,8 @@
 import { Component, Inject, OnInit, ViewEncapsulation } from '@angular/core';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
 import { DownloadEntry, NodeEntry } from '@alfresco/js-api';
-import { LogService } from '../services/log.service';
-import { DownloadZipService } from '../services/download-zip.service';
+import { LogService } from '../../services/log.service';
+import { DownloadZipService } from '../../services/download-zip.service';
 
 @Component({
     selector: 'adf-download-zip-dialog',

lib/core/dialogs/edit-json/edit-json.dialog.html

@@ -0,0 +1,13 @@
+<h1 mat-dialog-title>{{ title | translate }}</h1>
+<mat-dialog-content>
+    <textarea [(ngModel)]="value" [attr.readonly]="!editable"></textarea>
+</mat-dialog-content>
+
+<mat-dialog-actions align="end">
+    <button mat-button mat-dialog-close cdkFocusInitial>
+        {{ 'CORE.DIALOG.EDIT_JSON.CLOSE' | translate }}
+    </button>
+    <button *ngIf="editable" mat-button [mat-dialog-close]="value">
+        {{ 'CORE.DIALOG.EDIT_JSON.UPDATE' | translate }}
+    </button>
+</mat-dialog-actions>

lib/core/dialogs/edit-json/edit-json.dialog.module.ts

@@ -0,0 +1,45 @@
+/*!
+ * @license
+ * Copyright 2019 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+import { MatButtonModule } from '@angular/material/button';
+import { MatDialogModule } from '@angular/material/dialog';
+import { TranslateModule } from '@ngx-translate/core';
+import { EditJsonDialogComponent } from './edit-json.dialog';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+
+@NgModule({
+    imports: [
+        CommonModule,
+        FormsModule,
+        ReactiveFormsModule,
+        TranslateModule.forChild(),
+        MatDialogModule,
+        MatButtonModule
+    ],
+    declarations: [
+        EditJsonDialogComponent
+    ],
+    exports: [
+        EditJsonDialogComponent
+    ],
+    entryComponents: [
+        EditJsonDialogComponent
+    ]
+})
+export class EditJsonDialogModule {}

lib/core/dialogs/edit-json/edit-json.dialog.scss

@@ -0,0 +1,19 @@
+.adf-edit-json-dialog {
+    .mat-dialog-content {
+        height: 300px;
+        overflow: hidden;
+    }
+    textarea {
+        &:focus {
+            outline: none;
+        }
+        resize: none;
+        width: 100%;
+        height: 100%;
+        margin: 0;
+        padding: 0;
+        box-sizing: border-box;         /* For IE and modern versions of Chrome */
+        -moz-box-sizing: border-box;    /* For Firefox                          */
+        -webkit-box-sizing: border-box; /* For Safari                           */
+    }
+}

lib/core/dialogs/edit-json/edit-json.dialog.ts

@@ -0,0 +1,52 @@
+/*!
+ * @license
+ * Copyright 2019 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Component, Inject, OnInit, Input, ViewEncapsulation } from '@angular/core';
+import { MAT_DIALOG_DATA } from '@angular/material/dialog';
+
+export interface EditJsonDialogSettings {
+    title?: string;
+    editable?: boolean;
+    value?: string;
+}
+
+@Component({
+    templateUrl: 'edit-json.dialog.html',
+    styleUrls: ['edit-json.dialog.scss'],
+    encapsulation: ViewEncapsulation.None,
+    host: { class: 'adf-edit-json-dialog' }
+})
+export class EditJsonDialogComponent implements OnInit {
+
+    editable: boolean = false;
+    title: string = 'JSON';
+
+    @Input()
+    value: string = '';
+
+    constructor(
+        @Inject(MAT_DIALOG_DATA) private settings: EditJsonDialogSettings
+    ) {}
+
+    ngOnInit() {
+        if (this.settings) {
+            this.editable = this.settings.editable ? true : false;
+            this.value = this.settings.value || '';
+            this.title = this.settings.title || 'JSON';
+        }
+    }
+}

lib/core/dialogs/public-api.ts

@@ -15,6 +15,9 @@
  * limitations under the License.
  */
 
-export * from './download-zip.dialog';
+export * from './download-zip/download-zip.dialog';
+
+export * from './edit-json/edit-json.dialog';
+export * from './edit-json/edit-json.dialog.module';
 
 export * from './dialog.module';