[ACS-5748] The file gets unshared when setting the past expiration date (#8876)

* [ACS-5748] set validation for share link input

* [ACS-5748] code smells

* [ACS-5748] lint

* [ACS-5748] rebase

* [ACS-5748] CR fixes

* [ACS-5748] rebase
This commit is contained in:
Mykyta Maliarchuk
2023-09-27 16:30:47 +02:00
committed by GitHub
parent 06bfded238
commit 44694c0ee1
4 changed files with 87 additions and 25 deletions

View File

@@ -51,7 +51,12 @@
[attr.aria-label]="'SHARE.EXPIRATION-LABEL' | translate"
[min]="minDate"
formControlName="time"
[matDatepicker]="datePicker" />
(keydown)="preventIncorrectCharacters($event)"
(blur)="onTimeChanged()"
(keydown.enter)="datePickerInput.blur()"
[matDatepicker]="datePicker"/>
<mat-error *ngIf="time.errors?.['invalidDate'] && (time.dirty || time.touched)"
data-automation-id="adf-share-link-input-warning">{{ 'SHARE.INVALID_DATE_ERROR' | translate }}</mat-error>
</mat-form-field>
</div>
<p class="adf-share-link__info adf-share-link__para">{{ 'SHARE.SHARE-LINK' | translate }}</p>

View File

@@ -21,12 +21,12 @@ import { of } from 'rxjs';
import { NotificationService, AppConfigService } from '@alfresco/adf-core';
import { NodesApiService } from '../common/services/nodes-api.service';
import { RenditionService } from '../common/services/rendition.service';
import { SharedLinksApiService } from './services/shared-links-api.service';
import { ShareDialogComponent } from './content-node-share.dialog';
import { ContentTestingModule } from '../testing/content.testing.module';
import { TranslateModule } from '@ngx-translate/core';
import { format, endOfDay } from 'date-fns';
import { By } from '@angular/platform-browser';
describe('ShareDialogComponent', () => {
let node;
@@ -45,6 +45,17 @@ describe('ShareDialogComponent', () => {
const getShareToggleLinkedClasses = (): DOMTokenList => fixture.nativeElement.querySelector(shareToggleId).classList;
const fillInDatepickerInput = (value: string) => {
const input = fixture.debugElement.query(By.css('.adf-share-link__input')).nativeElement;
input.value = value;
input.dispatchEvent(new Event('input'));
input.dispatchEvent(new Event('blur'));
fixture.detectChanges();
};
const clickExpireToggleButton = () => fixture.nativeElement.querySelector('mat-slide-toggle[data-automation-id="adf-expire-toggle"] label')
.dispatchEvent(new MouseEvent('click'));
const clickShareToggleButton = () => fixture.nativeElement.querySelector(`${shareToggleId} label`)
.dispatchEvent(new MouseEvent('click'));
@@ -250,17 +261,10 @@ describe('ShareDialogComponent', () => {
};
fixture.detectChanges();
component.form.controls['time'].setValue(new Date());
fixture.detectChanges();
fixture.nativeElement
.querySelector('.mat-slide-toggle[data-automation-id="adf-expire-toggle"] label')
.dispatchEvent(new MouseEvent('click'));
clickExpireToggleButton();
fixture.detectChanges();
await fixture.whenStable();
expect(sharedLinksApiService.deleteSharedLink).toHaveBeenCalled();
@@ -304,10 +308,10 @@ describe('ShareDialogComponent', () => {
spyOn(appConfigService, 'get').and.callFake(() => dateTimePickerType as any);
fixture.detectChanges();
fixture.nativeElement.querySelector('mat-slide-toggle[data-automation-id="adf-expire-toggle"] label')
.dispatchEvent(new MouseEvent('click'));
clickExpireToggleButton();
fixture.componentInstance.time.setValue(date);
component.onTimeChanged();
fixture.detectChanges();
tick(500);
@@ -326,11 +330,11 @@ describe('ShareDialogComponent', () => {
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'));
clickExpireToggleButton();
fixture.componentInstance.type = 'datetime';
fixture.componentInstance.time.setValue(date);
component.onTimeChanged();
fixture.detectChanges();
tick(100);
@@ -342,5 +346,44 @@ describe('ShareDialogComponent', () => {
expiresAt: expiryDate
});
}));
it('should not update node when provided date is less than minDate', () => {
fixture.detectChanges();
clickExpireToggleButton();
fillInDatepickerInput('01.01.2010');
expect(component.form.invalid).toBeTrue();
expect(sharedLinksApiService.deleteSharedLink).not.toHaveBeenCalled();
expect(sharedLinksApiService.createSharedLinks).not.toHaveBeenCalled();
});
it('should not accept alphabets in the datepicker input', () => {
fixture.detectChanges();
clickExpireToggleButton();
fillInDatepickerInput('test');
expect(component.form.invalid).toBeTrue();
expect(component.form.controls['time'].value).toBeNull();
});
it('should show an error if provided date is invalid', () => {
fixture.detectChanges();
clickExpireToggleButton();
fillInDatepickerInput('32');
const error = fixture.debugElement.query(By.css('[data-automation-id="adf-share-link-input-warning"]'));
expect(error).toBeTruthy();
expect(component.time.hasError('invalidDate')).toBeTrue();
});
it('should not show an error when provided date is valid', () => {
fixture.detectChanges();
clickExpireToggleButton();
fillInDatepickerInput('12.12.2525');
const error = fixture.debugElement.query(By.css('[data-automation-id="adf-share-link-input-warning"]'));
expect(error).toBeNull();
expect(component.time.hasError('invalidDate')).toBeFalse();
});
});
});

View File

@@ -18,17 +18,21 @@
import { Component, Inject, OnInit, ViewEncapsulation, ViewChild, OnDestroy } from '@angular/core';
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 {
UntypedFormGroup,
UntypedFormControl,
AbstractControl,
Validators,
ValidationErrors
} from '@angular/forms';
import { Subject } from 'rxjs';
import { ContentService } from '../common/services/content.service';
import { SharedLinksApiService } from './services/shared-links-api.service';
import { SharedLinkBodyCreate, SharedLinkEntry } from '@alfresco/js-api';
import { ConfirmDialogComponent } from '../dialogs/confirm.dialog';
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';
import { format, add, endOfDay, isBefore } from 'date-fns';
type DatePickerType = 'date' | 'time' | 'month' | 'datetime';
@@ -40,6 +44,10 @@ type DatePickerType = 'date' | 'time' | 'month' | 'datetime';
encapsulation: ViewEncapsulation.None
})
export class ShareDialogComponent implements OnInit, OnDestroy {
private minDateValidator = (control: AbstractControl): ValidationErrors | null => {
return isBefore(endOfDay(new Date(control.value)), this.minDate) ? {invalidDate: true} : null;
};
minDate = add(new Date(), { days: 1 });
sharedId: string;
fileName: string;
@@ -49,7 +57,7 @@ export class ShareDialogComponent implements OnInit, OnDestroy {
isLinkWithExpiryDate = false;
form: UntypedFormGroup = new UntypedFormGroup({
sharedUrl: new UntypedFormControl(''),
time: new UntypedFormControl({ value: '', disabled: true })
time: new UntypedFormControl({value: '', disabled: true}, [Validators.required, this.minDateValidator])
});
type: DatePickerType = 'date';
maxDebounceTime = 500;
@@ -90,12 +98,12 @@ export class ShareDialogComponent implements OnInit, OnDestroy {
this.isLinkWithExpiryDate ? this.time.enable() : this.time.disable();
}
}
this.time.valueChanges.pipe(debounceTime(this.maxDebounceTime), takeUntil(this.onDestroy$)).subscribe((value) => this.onTimeChanged(value));
}
onTimeChanged(date: Date) {
this.updateNode(date);
onTimeChanged() {
if (this.time.valid) {
this.updateNode(this.time.value);
}
}
get time(): AbstractControl {
@@ -137,12 +145,17 @@ export class ShareDialogComponent implements OnInit, OnDestroy {
}
onDatePickerClosed() {
this.datePickerInput.nativeElement.blur();
this.onTimeChanged();
if (!this.time.value) {
this.slideToggleExpirationDate.checked = false;
}
}
preventIncorrectCharacters(e: KeyboardEvent): boolean {
const regex = /[^\d/.-]/;
return e.key.length === 1 ? !regex.test(e.key) : true;
}
private openConfirmationDialog() {
this.isFileShared = false;

View File

@@ -533,7 +533,8 @@
"REMOVE": "Remove"
},
"UNSHARE_ERROR": "Error unsharing this file",
"UNSHARE_PERMISSION_ERROR": "You don't have permission to unshare this file"
"UNSHARE_PERMISSION_ERROR": "You don't have permission to unshare this file",
"INVALID_DATE_ERROR": "Invalid date"
},
"PERMISSION_MANAGER": {
"PERMISSION_DISPLAY": {