[ADF-4496] Share dialog enhancements (#4705)

* raise snackbars on unshare errors

* remove time from datepicker

* update tests

* Update en.json

* code updates as per review

* update docs

* bind datetimepicker type attribute

* set datetimepicker type by configuration or default

* tests

* e2e test

* update docs

* e2e set sharedLinkDateTimePickerType config

lib/content-services/content-node-share/content-node-share.dialog.ts

@@ -21,18 +21,23 @@ import {
     OnInit,
     ViewEncapsulation,
     ViewChild,
-    ElementRef,
     OnDestroy
 } from '@angular/core';
-import { MAT_DIALOG_DATA, MatDialogRef,  MatDialog } from '@angular/material';
+import { MAT_DIALOG_DATA, MatDialogRef, MatDialog, MatSlideToggleChange } from '@angular/material';
 import { FormGroup, FormControl } from '@angular/forms';
-import { Subscription, Observable } from 'rxjs';
-import { tap, skip } from 'rxjs/operators';
+import { Subscription, Observable, throwError } from 'rxjs';
+import {
+    skip,
+    distinctUntilChanged,
+    mergeMap,
+    catchError
+} from 'rxjs/operators';
 import {
     SharedLinksApiService,
     NodesApiService,
     ContentService,
-    RenditionsService
+    RenditionsService,
+    AppConfigService
 } from '@alfresco/adf-core';
 import { SharedLinkEntry, Node } from '@alfresco/js-api';
 import { ConfirmDialogComponent } from '../dialogs/confirm.dialog';
@@ -42,7 +47,7 @@ import moment from 'moment-es6';
     selector: 'adf-share-dialog',
     templateUrl: './content-node-share.dialog.html',
     styleUrls: ['./content-node-share.dialog.scss'],
-    host: { 'class': 'adf-share-dialog' },
+    host: { class: 'adf-share-dialog' },
     encapsulation: ViewEncapsulation.None
 })
 export class ShareDialogComponent implements OnInit, OnDestroy {
@@ -55,34 +60,49 @@ export class ShareDialogComponent implements OnInit, OnDestroy {
     isFileShared: boolean = false;
     isDisabled: boolean = false;
     form: FormGroup = new FormGroup({
-        'sharedUrl': new FormControl(''),
-        'time': new FormControl({value: '', disabled: false})
+        sharedUrl: new FormControl(''),
+        time: new FormControl({ value: '', disabled: false })
     });
+    type = 'datetime';
 
-    @ViewChild('sharedLinkInput') sharedLinkInput: ElementRef;
+    @ViewChild('matDatetimepickerToggle')
+    matDatetimepickerToggle;
+
+    @ViewChild('slideToggleExpirationDate')
+    slideToggleExpirationDate;
+
+    @ViewChild('dateTimePickerInput')
+    dateTimePickerInput;
 
     constructor(
+        private appConfigService: AppConfigService,
         private sharedLinksApiService: SharedLinksApiService,
         private dialogRef: MatDialogRef<ShareDialogComponent>,
         private dialog: MatDialog,
         private nodesApiService: NodesApiService,
         private contentService: ContentService,
         private renditionService: RenditionsService,
-        @Inject(MAT_DIALOG_DATA) public data: any) {
-    }
+        @Inject(MAT_DIALOG_DATA) public data: any
+    ) {}
 
     ngOnInit() {
+        this.type = this.appConfigService.get<string>('sharedLinkDateTimePickerType', 'datetime');
 
         if (!this.canUpdate) {
             this.form.controls['time'].disable();
         }
 
         this.subscriptions.push(
-            this.form.valueChanges
+            this.form.controls.time.valueChanges
                 .pipe(
                     skip(1),
-                    tap((updates) => {
-                        this.updateNode(updates);
+                    distinctUntilChanged(),
+                    mergeMap(
+                        (updates) => this.updateNode(updates),
+                        (formUpdates) => formUpdates
+                    ),
+                    catchError((error) => {
+                        return throwError(error);
                     })
                 )
                 .subscribe((updates) => this.updateEntryExpiryDate(updates))
@@ -94,9 +114,7 @@ export class ShareDialogComponent implements OnInit, OnDestroy {
             const properties = this.data.node.entry.properties;
 
             if (properties && !properties['qshare:sharedId']) {
-
                 this.createSharedLinks(this.data.node.entry.id);
-
             } else {
                 this.sharedId = properties['qshare:sharedId'];
                 this.isFileShared = true;
@@ -123,7 +141,27 @@ export class ShareDialogComponent implements OnInit, OnDestroy {
     }
 
     get canUpdate() {
-        return this.contentService.hasAllowableOperations(this.data.node.entry, 'update');
+        return this.contentService.hasAllowableOperations(
+            this.data.node.entry,
+            'update'
+        );
+    }
+
+    onToggleExpirationDate(slideToggle: MatSlideToggleChange) {
+        if (slideToggle.checked) {
+            this.matDatetimepickerToggle.datetimepicker.open();
+        } else {
+            this.matDatetimepickerToggle.datetimepicker.close();
+            this.form.controls.time.setValue(null);
+        }
+    }
+
+    onDatetimepickerClosed() {
+        this.dateTimePickerInput.nativeElement.blur();
+
+        if (!this.form.controls.time.value) {
+            this.slideToggleExpirationDate.checked = false;
+        }
     }
 
     private openConfirmationDialog() {
@@ -140,7 +178,8 @@ export class ShareDialogComponent implements OnInit, OnDestroy {
                 minWidth: '250px',
                 closeOnNavigation: true
             })
-            .beforeClose().subscribe((deleteSharedLink) => {
+            .beforeClose()
+            .subscribe((deleteSharedLink) => {
                 if (deleteSharedLink) {
                     this.deleteSharedLink(this.sharedId);
                 } else {
@@ -152,15 +191,18 @@ export class ShareDialogComponent implements OnInit, OnDestroy {
     private createSharedLinks(nodeId: string) {
         this.isDisabled = true;
 
-        this.sharedLinksApiService.createSharedLinks(nodeId)
-            .subscribe((sharedLink: SharedLinkEntry) => {
-
+        this.sharedLinksApiService.createSharedLinks(nodeId).subscribe(
+            (sharedLink: SharedLinkEntry) => {
                 if (sharedLink.entry) {
                     this.sharedId = sharedLink.entry.id;
-                    this.data.node.entry.properties['qshare:sharedId'] = this.sharedId;
+                    this.data.node.entry.properties[
+                        'qshare:sharedId'
+                    ] = this.sharedId;
                     this.isDisabled = false;
                     this.isFileShared = true;
-                    this.renditionService.generateRenditionForNode(this.data.node.entry.id).subscribe(() => {});
+                    this.renditionService
+                        .generateRenditionForNode(this.data.node.entry.id)
+                        .subscribe(() => {});
 
                     this.updateForm();
                 }
@@ -168,21 +210,48 @@ export class ShareDialogComponent implements OnInit, OnDestroy {
             () => {
                 this.isDisabled = false;
                 this.isFileShared = false;
-            });
+            }
+        );
     }
 
-    private deleteSharedLink(sharedId: string) {
+    deleteSharedLink(sharedId: string) {
         this.isDisabled = true;
 
-        this.sharedLinksApiService.deleteSharedLink(sharedId).subscribe(() => {
-                this.data.node.entry.properties['qshare:sharedId'] = null;
-                this.data.node.entry.properties['qshare:expiryDate'] = null;
-                this.dialogRef.close(false);
+        this.sharedLinksApiService.deleteSharedLink(sharedId).subscribe(
+            (response: any) => {
+                if (response instanceof Error) {
+                    this.isDisabled = false;
+                    this.isFileShared = true;
+                    this.handleError(response);
+                } else {
+                    this.data.node.entry.properties['qshare:sharedId'] = null;
+                    this.data.node.entry.properties['qshare:expiryDate'] = null;
+                    this.dialogRef.close(false);
+                }
             },
             () => {
                 this.isDisabled = false;
                 this.isFileShared = false;
-            });
+            }
+        );
+    }
+
+    private handleError(error: Error) {
+        let message = 'SHARE.UNSHARE_ERROR';
+        let statusCode = 0;
+
+        try {
+            statusCode = JSON.parse(error.message).error.statusCode;
+        } catch {}
+
+        if (statusCode === 403) {
+            message = 'SHARE.UNSHARE_PERMISSION_ERROR';
+        }
+
+        this.sharedLinksApiService.error.next({
+            statusCode,
+            message
+        });
     }
 
     private updateForm() {
@@ -190,27 +259,26 @@ export class ShareDialogComponent implements OnInit, OnDestroy {
         const expiryDate = entry.properties['qshare:expiryDate'];
 
         this.form.setValue({
-            'sharedUrl': `${this.baseShareUrl}${this.sharedId}`,
-            'time': expiryDate ? expiryDate : null
+            sharedUrl: `${this.baseShareUrl}${this.sharedId}`,
+            time: expiryDate ? moment(expiryDate).local() : null
         });
     }
 
-    private updateNode(updates): Observable<Node> {
-        return this.nodesApiService.updateNode(
-            this.data.node.entry.id,
-            {
-                properties: {
-                    'qshare:expiryDate': updates.time ? updates.time.utc().format() : null
-                }
+    private updateNode(date: moment.Moment): Observable<Node> {
+        return this.nodesApiService.updateNode(this.data.node.entry.id, {
+            properties: {
+                'qshare:expiryDate': date ?
+                    (this.type === 'date' ? date.endOf('day').utc().format() : date.utc().format()) :
+                    null
             }
-        );
+        });
     }
 
-    private updateEntryExpiryDate(updates) {
+    private updateEntryExpiryDate(date: moment.Moment) {
         const { properties } = this.data.node.entry;
 
-        properties['qshare:expiryDate'] = updates.time
-            ? updates.time.local()
+        properties['qshare:expiryDate'] = date
+            ? date.local()
             : null;
     }
 }