From 479c96eabb9db88d320ad810c2f9319d1a94be0c Mon Sep 17 00:00:00 2001 From: Jatin Chugh <105338943+jatin2008@users.noreply.github.com> Date: Wed, 14 Jun 2023 15:30:08 +0530 Subject: [PATCH] [PRODSEC-6575] Shared link not accessible now after the expiry date which was earlier accessible even after that expiration date (#8540) * Shared link expiry date code implementation * test case updated * removed unsed code * design changes as per the new design of Share dialog * test cases modification as per new design changes * placeholder modified for expiration date * look and feel changes for share dialog as per Shane comments * boolean name changed as per naming convention * review comments addressed * review comments addressed * type specified for node object * linting corrections * resolved nested ternary date operation into an independent statement * review comments addressed * used date-fns instead of moment.js in code as well as in test cases * review comments for date-fns addressed * removed extra line * removed extra empty lines in template * import changes and indentation correction * error in console resolved which was occuring after selecting date and time * used mat-datepicker instead of mat-datetimepicker * package-lock.json file updated for date-fns implementation * made type 'date' as default and removed the settings coming from the ACA * unit test case modifications as per calender changes * e2e modifications as per new calendar component --- .../components/share-file.e2e.ts | 17 -- e2e/core/pages/dialog/share-dialog.page.ts | 7 +- .../content-node-share.dialog.html | 194 ++++++++++-------- .../content-node-share.dialog.scss | 85 +++++++- .../content-node-share.dialog.spec.ts | 104 ++++------ .../content-node-share.dialog.ts | 119 ++++++----- .../services/shared-links-api.service.ts | 7 +- lib/content-services/src/lib/i18n/en.json | 6 + .../date-time-picker-calendar.page.ts | 8 +- .../pages/material/date-time-picker.page.ts | 6 +- package-lock.json | 32 +++ package.json | 1 + 12 files changed, 361 insertions(+), 225 deletions(-) diff --git a/e2e/content-services/components/share-file.e2e.ts b/e2e/content-services/components/share-file.e2e.ts index 0886e47144..2b92e972f3 100644 --- a/e2e/content-services/components/share-file.e2e.ts +++ b/e2e/content-services/components/share-file.e2e.ts @@ -132,23 +132,6 @@ describe('Share file', () => { await BrowserActions.closeMenuAndDialogs(); }); - it('[C286548] Should be possible to set expiry date for link', async () => { - await contentServicesPage.clickShareButton(); - await shareDialog.checkDialogIsDisplayed(); - await shareDialog.clickExpireToggle(); - await shareDialog.setDefaultDay(); - await shareDialog.setDefaultHour(); - await shareDialog.setDefaultMinutes(); - await shareDialog.dateTimePickerDialogIsClosed(); - const value = await shareDialog.getExpirationDate(); - await shareDialog.clickCloseButton(); - await shareDialog.dialogIsClosed(); - await contentServicesPage.clickShareButton(); - await shareDialog.checkDialogIsDisplayed(); - await shareDialog.expirationDateInputHasValue(value); - await BrowserActions.closeMenuAndDialogs(); - }); - it('[C310329] Should be possible to set expiry date only for link', async () => { await LocalStorageUtil.setConfigField('sharedLinkDateTimePickerType', JSON.stringify('date')); await contentServicesPage.clickShareButton(); diff --git a/e2e/core/pages/dialog/share-dialog.page.ts b/e2e/core/pages/dialog/share-dialog.page.ts index d7e38d5b54..0a05af555d 100644 --- a/e2e/core/pages/dialog/share-dialog.page.ts +++ b/e2e/core/pages/dialog/share-dialog.page.ts @@ -17,8 +17,7 @@ import { $$, $ } from 'protractor'; import { BrowserVisibility, TogglePage, BrowserActions, DateTimePickerPage } from '@alfresco/adf-testing'; -import * as moment from 'moment'; - +import { format, add } from 'date-fns'; export class ShareDialogPage { togglePage = new TogglePage(); @@ -85,7 +84,7 @@ export class ShareDialogPage { } async calendarTodayDayIsDisabled(): Promise { - const tomorrow = moment().add(1, 'days').format('D'); + const tomorrow = format(add(new Date(), {days: 1}), 'd'); if (tomorrow !== '1') { await this.dateTimePickerPage.checkCalendarTodayDayIsDisabled(); @@ -93,7 +92,7 @@ export class ShareDialogPage { } async setDefaultDay(): Promise { - const tomorrow = moment().add(1, 'days').format('D'); + const tomorrow = format(add(new Date(), {days: 1}), 'd'); await this.dateTimePickerPage.setDate(tomorrow); } diff --git a/lib/content-services/src/lib/content-node-share/content-node-share.dialog.html b/lib/content-services/src/lib/content-node-share/content-node-share.dialog.html index 352797d0c4..7f3bdf330c 100644 --- a/lib/content-services/src/lib/content-node-share/content-node-share.dialog.html +++ b/lib/content-services/src/lib/content-node-share/content-node-share.dialog.html @@ -1,89 +1,115 @@
-
- {{ 'SHARE.DIALOG-TITLE' | translate }} {{ fileName }} -
- - -

{{ 'SHARE.DESCRIPTION' | translate }}

- +
-
{{ 'SHARE.TITLE' | translate }}
- - - -
- -
- - - - content_copy - - - -
-
{{ 'SHARE.EXPIRES' | translate }}
- - +
+ {{ 'SHARE.DIALOG-TITLE' | translate }} {{ fileName }}
- - - - - - - - - - - -
- + close +
+ +
+
+
+ timer +
{{ 'SHARE.LINK-EXPIRY-DATE' | translate }} +
+ + +
+
+ + {{ 'SHARE.EXPIRATION-PLACEHOLDER' | translate }} + + + + + + +
+

{{ 'SHARE.SHARE-LINK' | translate }}

+
+ + +
{{ 'SHARE.SHARABLE-LINK-CREATED' | translate }} +
+
+ + + + content_copy + + +

+ {{ 'SHARE.LINK-WITH-EXPIRY-SETTINGS' | translate }} +

+
+ public +

+ {{ 'SHARE.PUBLIC-CONTENT' | translate }} +

+
+
+
+ +
+ +
diff --git a/lib/content-services/src/lib/content-node-share/content-node-share.dialog.scss b/lib/content-services/src/lib/content-node-share/content-node-share.dialog.scss index 84f07062eb..4bf4f0d29d 100644 --- a/lib/content-services/src/lib/content-node-share/content-node-share.dialog.scss +++ b/lib/content-services/src/lib/content-node-share/content-node-share.dialog.scss @@ -7,6 +7,14 @@ &__dialog-content { display: flex; flex-direction: column; + padding: 24px; + background-color: var(--theme-grey-text-background-color); + } + + &__dialog-container { + background-color: var(--theme-card-background-color); + border-radius: 16px; + padding: 16px 24px; } &__label, @@ -17,7 +25,7 @@ font-weight: normal; font-style: normal; font-stretch: normal; - font-size: var(--theme-subheading-2-font-size); + font-size: var(--theme-body-1-font-size); color: var(--adf-theme-foreground-text-color-087); } @@ -25,22 +33,68 @@ flex: 1 1 auto; } - &__info { + &__form { + padding-top: 8px; + } + + &__public-content { color: var(--adf-theme-foreground-text-color-054); font-size: var(--theme-caption-font-size); } + &__warn { + color: var(--theme-warn-color); + font-size: var(--theme-caption-font-size); + } + &--row { display: flex; flex-direction: row; /* stylelint-disable-next-line declaration-block-no-redundant-longhand-properties */ flex-wrap: wrap; align-items: center; + margin: 8px 0; } &__input { color: var(--adf-theme-foreground-text-color-087); } + + &__separation-line { + border: 1px solid var(--theme-grey-background-color); + margin: 8px -24px; + } + + &__close { + cursor: pointer; + margin-left: 12px; + } + + &__icon { + color: var(--adf-theme-foreground-icon-color-054); + } + + &__para { + margin-top: 8px; + margin-bottom: 8px; + } + + &__heading { + font-weight: 700; + font-size: var(--theme-subheading-2-font-size); + } + + &__calender-icon { + font-size: 18px; + } + + &__date-time-container { + padding-bottom: 8px; + } + + &__border-color { + border: 1px solid var(--theme-warn-color); + } } .adf-input-action { @@ -49,6 +103,13 @@ .adf-full-width { width: 100%; + background-color: var(--theme-grey-text-background-color); + border-radius: 6px; + padding-top: 8px; + } + + .adf-sharable-link { + margin-left: 8px; } .mat-form-field-infix { @@ -57,9 +118,13 @@ .mat-dialog-actions { justify-content: flex-end; + padding: 0; + margin: 8px 0 0; & > button { - text-transform: uppercase; + color: var(--adf-theme-foreground-base-color); + background-color: var(--theme-grey-text-background-color); + margin-right: 12px; } } @@ -67,6 +132,20 @@ align-items: center; } + .mat-dialog-container { + padding: 0; + } + + .mat-form-field-appearance-legacy .mat-form-field-underline { + display: none; + } + + .mat-form-field-appearance-legacy .mat-form-field-wrapper { + padding-bottom: 8px; + margin-right: 8px; + margin-left: 8px; + } + @media screen and (max-width: 380px) { .mat-dialog-container { padding: 0 15px; diff --git a/lib/content-services/src/lib/content-node-share/content-node-share.dialog.spec.ts b/lib/content-services/src/lib/content-node-share/content-node-share.dialog.spec.ts index 2070de62a4..aa17896060 100644 --- a/lib/content-services/src/lib/content-node-share/content-node-share.dialog.spec.ts +++ b/lib/content-services/src/lib/content-node-share/content-node-share.dialog.spec.ts @@ -28,9 +28,9 @@ import { RenditionService } from '../common/services/rendition.service'; import { SharedLinksApiService } from './services/shared-links-api.service'; import { ShareDialogComponent } from './content-node-share.dialog'; -import moment from 'moment'; import { ContentTestingModule } from '../testing/content.testing.module'; import { TranslateModule } from '@ngx-translate/core'; +import { format, endOfDay } from 'date-fns'; describe('ShareDialogComponent', () => { let node; @@ -45,6 +45,13 @@ describe('ShareDialogComponent', () => { let component: ShareDialogComponent; let appConfigService: AppConfigService; + const shareToggleId = '[data-automation-id="adf-share-toggle"]'; + + const getShareToggleLinkedClasses = (): DOMTokenList => fixture.nativeElement.querySelector(shareToggleId).classList; + + const clickShareToggleButton = () => fixture.nativeElement.querySelector(`${shareToggleId} label`) + .dispatchEvent(new MouseEvent('click')); + setupTestBed({ imports: [ TranslateModule.forRoot(), @@ -137,7 +144,7 @@ describe('ShareDialogComponent', () => { expect(sharedLinksApiService.createSharedLinks).toHaveBeenCalled(); expect(renditionService.getNodeRendition).toHaveBeenCalled(); expect(fixture.nativeElement.querySelector('input[formcontrolname="sharedUrl"]').value).toBe('some-url/sharedId'); - expect(fixture.nativeElement.querySelector('.mat-slide-toggle').classList).toContain('mat-checked'); + expect(getShareToggleLinkedClasses()).toContain('mat-checked'); }); it(`should not toggle share action when file has 'sharedId' property`, async () => { @@ -160,7 +167,7 @@ describe('ShareDialogComponent', () => { expect(sharedLinksApiService.createSharedLinks).not.toHaveBeenCalled(); expect(fixture.nativeElement.querySelector('input[formcontrolname="sharedUrl"]').value).toBe('some-url/sharedId'); - expect(fixture.nativeElement.querySelector('.mat-slide-toggle').classList).toContain('mat-checked'); + expect(getShareToggleLinkedClasses()).toContain('mat-checked'); }); it('should open a confirmation dialog when unshare button is triggered', () => { @@ -176,8 +183,7 @@ describe('ShareDialogComponent', () => { fixture.detectChanges(); - fixture.nativeElement.querySelector('.mat-slide-toggle label') - .dispatchEvent(new MouseEvent('click')); + clickShareToggleButton(); fixture.detectChanges(); @@ -196,8 +202,7 @@ describe('ShareDialogComponent', () => { fixture.detectChanges(); - fixture.nativeElement.querySelector('.mat-slide-toggle label') - .dispatchEvent(new MouseEvent('click')); + clickShareToggleButton(); fixture.detectChanges(); @@ -216,8 +221,7 @@ describe('ShareDialogComponent', () => { fixture.detectChanges(); - fixture.nativeElement.querySelector('.mat-slide-toggle label') - .dispatchEvent(new MouseEvent('click')); + clickShareToggleButton(); fixture.detectChanges(); @@ -235,12 +239,13 @@ describe('ShareDialogComponent', () => { fixture.detectChanges(); - expect(fixture.nativeElement.querySelector('.mat-slide-toggle').classList).toContain('mat-disabled'); - expect(fixture.nativeElement.querySelector('input[formcontrolname="time"]').disabled).toBe(true); - expect(fixture.nativeElement.querySelector('mat-datetimepicker-toggle button').disabled).toBe(true); + expect(getShareToggleLinkedClasses()).toContain('mat-disabled'); }); - it('should reset expiration date when toggle is unchecked', async () => { + it('should delete the current link generated with expiry date and generate a new link without expiry date when toggle is unchecked', async () => { + spyOn(sharedLinksApiService, 'createSharedLinks').and.returnValue(of()); + spyOn(sharedLinksApiService, 'deleteSharedLink').and.returnValue(of({})); + node.entry.properties['qshare:sharedId'] = 'sharedId'; node.entry.properties['qshare:sharedId'] = '2017-04-15T18:31:37+00:00'; node.entry.allowableOperations = ['update']; @@ -251,7 +256,7 @@ describe('ShareDialogComponent', () => { fixture.detectChanges(); - component.form.controls['time'].setValue(moment()); + component.form.controls['time'].setValue(new Date()); fixture.detectChanges(); @@ -263,13 +268,8 @@ describe('ShareDialogComponent', () => { await fixture.whenStable(); - expect(nodesApiService.updateNode).toHaveBeenCalledWith('nodeId', { - properties: {'qshare:expiryDate': null} - }); - - expect( - fixture.nativeElement.querySelector('input[formcontrolname="time"]').value - ).toBe(''); + expect(sharedLinksApiService.deleteSharedLink).toHaveBeenCalled(); + expect(sharedLinksApiService.createSharedLinks).toHaveBeenCalledWith('nodeId', undefined); }); it('should not allow expiration date action when node has no update permission', async () => { @@ -284,43 +284,18 @@ describe('ShareDialogComponent', () => { fixture.detectChanges(); await fixture.whenStable(); - expect(fixture.nativeElement.querySelector('input[formcontrolname="time"]').disabled).toBe(true); expect(fixture.nativeElement.querySelector('.mat-slide-toggle[data-automation-id="adf-expire-toggle"]') - .classList).toContain('mat-disabled'); + .classList).toContain('mat-disabled'); + expect(fixture.nativeElement.querySelector('[data-automation-id="adf-slide-toggle-checked"]').style.display).toEqual('none'); }); - it('should update node expiration date with selected date', fakeAsync(() => { - const date = moment(); - node.entry.allowableOperations = ['update']; - node.entry.properties['qshare:sharedId'] = 'sharedId'; - fixture.componentInstance.form.controls['time'].setValue(null); - - component.data = { - node, - baseShareUrl: 'some-url/' - }; - - fixture.detectChanges(); - - fixture.nativeElement - .querySelector( - 'mat-slide-toggle[data-automation-id="adf-expire-toggle"] label' - ) - .dispatchEvent(new MouseEvent('click')); - - fixture.componentInstance.form.controls['time'].setValue(date); - fixture.detectChanges(); - - tick(100); - - expect(nodesApiService.updateNode).toHaveBeenCalledWith('nodeId', { - properties: {'qshare:expiryDate': date.utc().format()} - }); - })); describe('datetimepicker type', () => { beforeEach(() => { - spyOn(sharedLinksApiService, 'createSharedLinks').and.returnValue(of(null)); + spyOn(sharedLinksApiService, 'createSharedLinks').and.returnValue(of()); + spyOn(sharedLinksApiService, 'deleteSharedLink').and.returnValue(of({})); + + node.entry.properties['qshare:sharedId'] = 'sharedId'; node.entry.allowableOperations = ['update']; component.data = { node, @@ -328,9 +303,9 @@ describe('ShareDialogComponent', () => { }; }); - it('it should update node with input date and end of day time when type is `date`', fakeAsync(() => { + it('should update node with input date and end of day time when type is `date`', fakeAsync(() => { const dateTimePickerType = 'date'; - const date = moment('2525-01-01 13:00:00'); + const date = new Date('2525-01-01'); spyOn(appConfigService, 'get').and.callFake(() => dateTimePickerType as any); fixture.detectChanges(); @@ -341,26 +316,35 @@ describe('ShareDialogComponent', () => { fixture.detectChanges(); tick(500); - expect(nodesApiService.updateNode).toHaveBeenCalledWith('nodeId', { - properties: {'qshare:expiryDate': date.endOf('day').utc().format()} + const expiryDate = format(endOfDay(date as Date), `yyyy-MM-dd'T'HH:mm:ss.SSSxx`); + + expect(sharedLinksApiService.deleteSharedLink).toHaveBeenCalled(); + expect(sharedLinksApiService.createSharedLinks).toHaveBeenCalledWith('nodeId', { + nodeId: 'nodeId', + expiresAt: expiryDate }); })); - it('it should update node with input date and time when type is `datetime`', fakeAsync(() => { + it('should update node with input date and time when type is `datetime`', fakeAsync(() => { const dateTimePickerType = 'datetime'; - const date = moment('2525-01-01 13:00:00'); + const date = new Date('2525-01-01 13:00:00'); spyOn(appConfigService, 'get').and.returnValue(dateTimePickerType); fixture.detectChanges(); fixture.nativeElement.querySelector('mat-slide-toggle[data-automation-id="adf-expire-toggle"] label') .dispatchEvent(new MouseEvent('click')); + fixture.componentInstance.type = 'datetime'; fixture.componentInstance.time.setValue(date); fixture.detectChanges(); tick(100); - expect(nodesApiService.updateNode).toHaveBeenCalledWith('nodeId', { - properties: {'qshare:expiryDate': date.utc().format()} + const expiryDate = format((new Date(date)), `yyyy-MM-dd'T'HH:mm:ss.SSSxx`); + + expect(sharedLinksApiService.deleteSharedLink).toHaveBeenCalled(); + expect(sharedLinksApiService.createSharedLinks).toHaveBeenCalledWith('nodeId', { + nodeId: 'nodeId', + expiresAt: expiryDate }); })); }); diff --git a/lib/content-services/src/lib/content-node-share/content-node-share.dialog.ts b/lib/content-services/src/lib/content-node-share/content-node-share.dialog.ts index 8c75d51ece..a05246b705 100644 --- a/lib/content-services/src/lib/content-node-share/content-node-share.dialog.ts +++ b/lib/content-services/src/lib/content-node-share/content-node-share.dialog.ts @@ -23,23 +23,19 @@ import { ViewChild, OnDestroy } from '@angular/core'; -import { MAT_DIALOG_DATA, MatDialogRef, MatDialog } from '@angular/material/dialog'; +import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from '@angular/material/dialog'; import { MatSlideToggleChange } from '@angular/material/slide-toggle'; import { UntypedFormGroup, UntypedFormControl, AbstractControl } from '@angular/forms'; -import { Observable, Subject } from 'rxjs'; -import { - AppConfigService -} from '@alfresco/adf-core'; -import { NodesApiService } from '../common/services/nodes-api.service'; +import { Subject } from 'rxjs'; import { ContentService } from '../common/services/content.service'; import { SharedLinksApiService } from './services/shared-links-api.service'; -import { SharedLinkEntry, Node } from '@alfresco/js-api'; +import { SharedLinkBodyCreate, SharedLinkEntry } from '@alfresco/js-api'; import { ConfirmDialogComponent } from '../dialogs/confirm.dialog'; -import moment from 'moment'; import { ContentNodeShareSettings } from './content-node-share.settings'; import { takeUntil, debounceTime } from 'rxjs/operators'; import { RenditionService } from '../common/services/rendition.service'; +import { format, add, endOfDay } from 'date-fns'; type DatePickerType = 'date' | 'time' | 'month' | 'datetime'; @@ -52,33 +48,33 @@ type DatePickerType = 'date' | 'time' | 'month' | 'datetime'; }) export class ShareDialogComponent implements OnInit, OnDestroy { - minDate = moment().add(1, 'd'); + minDate = add(new Date(), { days: 1 }); sharedId: string; fileName: string; baseShareUrl: string; - isFileShared: boolean = false; - isDisabled: boolean = false; + isFileShared = false; + isDisabled = false; + isLinkWithExpiryDate = false; form: UntypedFormGroup = new UntypedFormGroup({ sharedUrl: new UntypedFormControl(''), time: new UntypedFormControl({value: '', disabled: true}) }); - type: DatePickerType = 'datetime'; + type: DatePickerType = 'date'; maxDebounceTime = 500; + isExpiryDateToggleChecked: boolean; @ViewChild('slideToggleExpirationDate', {static: true}) slideToggleExpirationDate; - @ViewChild('dateTimePickerInput', {static: true}) - dateTimePickerInput; + @ViewChild('datePickerInput', {static: true}) + datePickerInput; private onDestroy$ = new Subject(); constructor( - private appConfigService: AppConfigService, private sharedLinksApiService: SharedLinksApiService, private dialogRef: MatDialogRef, private dialog: MatDialog, - private nodesApiService: NodesApiService, private contentService: ContentService, private renditionService: RenditionService, @Inject(MAT_DIALOG_DATA) public data: ContentNodeShareSettings @@ -86,8 +82,6 @@ export class ShareDialogComponent implements OnInit, OnDestroy { } ngOnInit() { - this.type = this.appConfigService.get('sharedLinkDateTimePickerType', 'datetime'); - if (this.data.node && this.data.node.entry) { this.fileName = this.data.node.entry.name; this.baseShareUrl = this.data.baseShareUrl; @@ -99,7 +93,10 @@ export class ShareDialogComponent implements OnInit, OnDestroy { } else { this.sharedId = properties['qshare:sharedId']; this.isFileShared = true; - this.updateForm(); + + const expiryDate = this.updateForm(); + this.isExpiryDateToggleChecked = this.isLinkWithExpiryDate = !!expiryDate; + this.isLinkWithExpiryDate ? this.time.enable() : this.time.disable(); } } @@ -111,10 +108,8 @@ export class ShareDialogComponent implements OnInit, OnDestroy { .subscribe(value => this.onTimeChanged(value)); } - onTimeChanged(date: moment.Moment) { - this.updateNode(date).subscribe( - () => this.updateEntryExpiryDate(date) - ); + onTimeChanged(date: Date) { + this.updateNode(date); } get time(): AbstractControl { @@ -147,15 +142,16 @@ export class ShareDialogComponent implements OnInit, OnDestroy { onToggleExpirationDate(slideToggle: MatSlideToggleChange) { if (slideToggle.checked) { this.time.enable(); + this.isExpiryDateToggleChecked = true; } else { this.time.disable(); this.time.setValue(null); + this.deleteSharedLink(this.sharedId, true); } } - onDatetimepickerClosed() { - this.dateTimePickerInput.nativeElement.blur(); - + onDatePickerClosed() { + this.datePickerInput.nativeElement.blur(); if (!this.time.value) { this.slideToggleExpirationDate.checked = false; } @@ -185,10 +181,10 @@ export class ShareDialogComponent implements OnInit, OnDestroy { }); } - private createSharedLinks(nodeId: string) { + private createSharedLinks(nodeId: string, sharedLinkWithExpirySettings?: SharedLinkBodyCreate) { this.isDisabled = true; - this.sharedLinksApiService.createSharedLinks(nodeId).subscribe( + this.sharedLinksApiService.createSharedLinks(nodeId, sharedLinkWithExpirySettings).subscribe( (sharedLink: SharedLinkEntry) => { if (sharedLink.entry) { this.sharedId = sharedLink.entry.id; @@ -215,7 +211,7 @@ export class ShareDialogComponent implements OnInit, OnDestroy { ); } - deleteSharedLink(sharedId: string) { + deleteSharedLink(sharedId: string, dialogOpenFlag?: boolean) { this.isDisabled = true; this.sharedLinksApiService @@ -230,7 +226,13 @@ export class ShareDialogComponent implements OnInit, OnDestroy { this.data.node.entry.properties['qshare:sharedId'] = null; this.data.node.entry.properties['qshare:expiryDate'] = null; } - this.dialogRef.close(false); + if (dialogOpenFlag) { + this.createSharedLinks(this.data.node.entry.id); + this.isExpiryDateToggleChecked = false; + this.isLinkWithExpiryDate = false; + } else { + this.dialogRef.close(false); + } } } ); @@ -255,7 +257,7 @@ export class ShareDialogComponent implements OnInit, OnDestroy { }); } - private updateForm() { + private updateForm(): Date { const {entry} = this.data.node; let expiryDate = null; @@ -265,34 +267,55 @@ export class ShareDialogComponent implements OnInit, OnDestroy { this.form.setValue({ sharedUrl: `${this.baseShareUrl}${this.sharedId}`, - time: expiryDate ? moment(expiryDate).local() : null - }); + time: expiryDate ? new Date(expiryDate) : null + }, { emitEvent: false }); - if (expiryDate) { - this.time.enable(); + return expiryDate; + } + + private updateNode(date: Date) { + let expiryDate: Date | string; + if (date) { + if (this.type === 'date') { + expiryDate = format(endOfDay(new Date(date)), `yyyy-MM-dd'T'HH:mm:ss.SSSxx`); + } else { + expiryDate = format((new Date(date)), `yyyy-MM-dd'T'HH:mm:ss.SSSxx`); + } } else { - this.time.disable(); + expiryDate = null; + } + + if (this.sharedId && expiryDate) { + this.isDisabled = true; + + this.sharedLinksApiService.deleteSharedLink(this.sharedId).subscribe((response: any) => { + if (response instanceof Error) { + this.isDisabled = false; + this.isFileShared = true; + this.handleError(response); + } else { + this.sharedLinkWithExpirySettings(expiryDate as Date); + this.isLinkWithExpiryDate = true; + this.updateEntryExpiryDate(date); + } + }); } } - private updateNode(date: moment.Moment): Observable { - const expiryDate = date - ? (this.type === 'date' ? date.endOf('day').utc().format() : date.utc().format()) - : null; - - return this.nodesApiService.updateNode(this.data.node.entry.id, { - properties: { - 'qshare:expiryDate': expiryDate - } - }); + private sharedLinkWithExpirySettings(expiryDate: Date) { + const nodeObject: SharedLinkBodyCreate = { + nodeId: this.data.node.entry.id, + expiresAt: expiryDate as Date + }; + this.createSharedLinks(this.data.node.entry.id, nodeObject); } - private updateEntryExpiryDate(date: moment.Moment) { + private updateEntryExpiryDate(date: Date) { const {properties} = this.data.node.entry; if (properties) { properties['qshare:expiryDate'] = date - ? date.local() + ? new Date(date) : null; } } diff --git a/lib/content-services/src/lib/content-node-share/services/shared-links-api.service.ts b/lib/content-services/src/lib/content-node-share/services/shared-links-api.service.ts index 8663b15263..aa113d1cae 100644 --- a/lib/content-services/src/lib/content-node-share/services/shared-links-api.service.ts +++ b/lib/content-services/src/lib/content-node-share/services/shared-links-api.service.ts @@ -16,7 +16,7 @@ */ import { Injectable } from '@angular/core'; -import { NodePaging, SharedLinkEntry, SharedlinksApi } from '@alfresco/js-api'; +import { NodePaging, SharedLinkBodyCreate, SharedLinkEntry, SharedlinksApi } from '@alfresco/js-api'; import { Observable, from, of, Subject } from 'rxjs'; import { AlfrescoApiService, UserPreferencesService } from '@alfresco/adf-core'; import { catchError } from 'rxjs/operators'; @@ -62,11 +62,12 @@ export class SharedLinksApiService { * Creates a shared link available to the current user. * * @param nodeId ID of the node to link to + * @param sharedLinkWithExpirySettings shared link with nodeId and expiryDate * @param options Options supported by JS-API * @returns The shared link just created */ - createSharedLinks(nodeId: string, options: any = {}): Observable { - const promise = this.sharedLinksApi.createSharedLink({ nodeId }, options); + createSharedLinks(nodeId: string, sharedLinkWithExpirySettings?: SharedLinkBodyCreate, options: any = {}): Observable { + const promise = this.sharedLinksApi.createSharedLink(sharedLinkWithExpirySettings? sharedLinkWithExpirySettings : { nodeId }, options); return from(promise).pipe( catchError((err) => of(err)) diff --git a/lib/content-services/src/lib/i18n/en.json b/lib/content-services/src/lib/i18n/en.json index 7a764bc6d1..b5cd5d8a5d 100644 --- a/lib/content-services/src/lib/i18n/en.json +++ b/lib/content-services/src/lib/i18n/en.json @@ -456,8 +456,14 @@ "DIALOG-TITLE": "Share", "DESCRIPTION": "Click the link below to copy it to the clipboard.", "TITLE": "Link to share", + "SHARE-LINK": "Share Link", + "SHARABLE-LINK-CREATED": "Sharable Link is Created", + "PUBLIC-CONTENT": "This content is publicly available to anyone with this link", + "LINK-WITH-EXPIRY-SETTINGS": "New link has been generated with expiry settings", "EXPIRES": "Expires on", + "LINK-EXPIRY-DATE": "Link Expiry Date", "EXPIRATION-LABEL" : "Expiration Date", + "EXPIRATION-PLACEHOLDER": "MM/DD/YYYY", "CLIPBOARD-MESSAGE": "Link copied to the clipboard", "CLOSE": "Close", "COPY_BUTTON_LABEL": "Copy link", diff --git a/lib/testing/src/lib/protractor/core/pages/material/date-time-picker-calendar.page.ts b/lib/testing/src/lib/protractor/core/pages/material/date-time-picker-calendar.page.ts index 6265717d41..0c76b3ced7 100644 --- a/lib/testing/src/lib/protractor/core/pages/material/date-time-picker-calendar.page.ts +++ b/lib/testing/src/lib/protractor/core/pages/material/date-time-picker-calendar.page.ts @@ -21,8 +21,8 @@ import { BrowserActions } from '../../utils/browser-actions'; export class DateTimePickerCalendarPage { - datePicker = $(`.mat-datetimepicker-calendar`); - today = $(`.mat-datetimepicker-calendar-body-today`); + datePicker = $(`.mat-datepicker-calendar`); + today = $(`.mat-calendar-body-today`); timePicker = $('.mat-datetimepicker-clock'); hourTime = $$('.mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell').first(); minutesTime = $$('.mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell').first(); @@ -47,7 +47,7 @@ export class DateTimePickerCalendarPage { async setDate(date?: string): Promise { try { if (date) { - await BrowserActions.clickScript(element.all(by.cssContainingText(`.mat-datetimepicker-calendar-body-cell-content`, date)).first()); + await BrowserActions.clickScript(element.all(by.cssContainingText(`.mat-datepicker-calendar-body-cell-content`, date)).first()); } else { await this.setToday(); } @@ -59,7 +59,7 @@ export class DateTimePickerCalendarPage { } async checkCalendarTodayDayIsDisabled(): Promise { - await BrowserVisibility.waitUntilElementIsPresent(element(by.cssContainingText('.mat-datetimepicker-calendar-body-disabled', await BrowserActions.getText(this.today)))); + await BrowserVisibility.waitUntilElementIsPresent(element(by.cssContainingText('.mat-calendar-body-cell-content', await BrowserActions.getText(this.today)))); } async setDefaultEnabledHour(): Promise { diff --git a/lib/testing/src/lib/protractor/core/pages/material/date-time-picker.page.ts b/lib/testing/src/lib/protractor/core/pages/material/date-time-picker.page.ts index 7f9dc85790..2c17bbcb18 100644 --- a/lib/testing/src/lib/protractor/core/pages/material/date-time-picker.page.ts +++ b/lib/testing/src/lib/protractor/core/pages/material/date-time-picker.page.ts @@ -23,12 +23,14 @@ export class DateTimePickerPage { rootElement: ElementFinder; dateTimePicker = $('.mat-datetimepicker-toggle'); + datePicker = $('.mat-datepicker-toggle'); dateTime = new DateTimePickerCalendarPage(); constructor(rootElement?: ElementFinder) { if (rootElement) { this.rootElement = rootElement; this.dateTimePicker = this.rootElement.$('.mat-datetimepicker-toggle'); + this.datePicker = this.rootElement.$('.mat-datepicker-toggle'); } } @@ -46,12 +48,12 @@ export class DateTimePickerPage { } async setDate(date?: string): Promise { - await BrowserActions.click(this.dateTimePicker); + await BrowserActions.click(this.datePicker); return this.dateTime.setDate(date); } async clickDateTimePicker(): Promise { - await BrowserActions.click(this.dateTimePicker); + await BrowserActions.click(this.datePicker); } async checkCalendarTodayDayIsDisabled(): Promise { diff --git a/package-lock.json b/package-lock.json index 7a85d81719..a886b99153 100644 --- a/package-lock.json +++ b/package-lock.json @@ -36,6 +36,7 @@ "apollo-angular": "^4.2.1", "chart.js": "2.9.4", "cropperjs": "1.5.13", + "date-fns": "^2.30.0", "dotenv-expand": "^5.1.0", "editorjs-html": "3.4.2", "editorjs-paragraph-with-alignment": "3.0.0", @@ -30973,6 +30974,37 @@ "node": ">=10" } }, + "node_modules/date-fns": { + "version": "2.30.0", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.30.0.tgz", + "integrity": "sha512-fnULvOpxnC5/Vg3NCiWelDsLiUc9bRwAPs/+LfTLNvetFCtCTN+yQz15C/fs4AwX1R9K5GLtLfn8QW+dWisaAw==", + "dependencies": { + "@babel/runtime": "^7.21.0" + }, + "engines": { + "node": ">=0.11" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/date-fns" + } + }, + "node_modules/date-fns/node_modules/@babel/runtime": { + "version": "7.21.5", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.5.tgz", + "integrity": "sha512-8jI69toZqqcsnqGGqwGS4Qb1VwLOEp4hz+CXPywcvjs60u3B4Pom/U/7rm4W8tMOYEB+E9wgD0mW1l3r8qlI9Q==", + "dependencies": { + "regenerator-runtime": "^0.13.11" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/date-fns/node_modules/regenerator-runtime": { + "version": "0.13.11", + "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz", + "integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==" + }, "node_modules/date-format": { "version": "4.0.14", "resolved": "https://registry.npmjs.org/date-format/-/date-format-4.0.14.tgz", diff --git a/package.json b/package.json index 8224fd4727..c331b45941 100644 --- a/package.json +++ b/package.json @@ -80,6 +80,7 @@ "apollo-angular": "^4.2.1", "chart.js": "2.9.4", "cropperjs": "1.5.13", + "date-fns": "^2.30.0", "dotenv-expand": "^5.1.0", "editorjs-html": "3.4.2", "editorjs-paragraph-with-alignment": "3.0.0",