add predefined time frames for delete and expire (#765)

src/app/send/add-edit.component.html

@@ -52,22 +52,45 @@
                         </div>
                     </div>
                 </ng-container>
-                <h3 class="mt-4">{{'options' | i18n}}</h3>
+                <h3 class="mt-5">{{'options' | i18n}}</h3>
                 <div class="row">
                     <div class="col-6 form-group">
                         <label for="deletionDate">{{'deletionDate' | i18n}}</label>
-                        <input id="deletionDate" class="form-control" type="datetime-local" name="DeletionDate"
-                            [(ngModel)]="deletionDate" required>
+                        <div *ngIf="!editMode">
+                            <select id="deletionDate" name="DeletionDateSelect" [(ngModel)]="deletionDateSelect"
+                                class="form-control" required>
+                                <option *ngFor="let o of deletionDateOptions" [ngValue]="o.value">{{o.name}}</option>
+                            </select>
+                            <input id="deletionDateCustom" class="form-control mt-1" type="datetime-local"
+                                name="DeletionDate" [(ngModel)]="deletionDate" required
+                                *ngIf="deletionDateSelect === 0">
+                        </div>
+                        <div *ngIf="editMode">
+                            <input id="deletionDate" class="form-control" type="datetime-local" name="DeletionDate"
+                                [(ngModel)]="deletionDate" required>
+                        </div>
                     </div>
                     <div class="col-6 form-group">
                         <div class="d-flex">
                             <label for="expirationDate">{{'expirationDate' | i18n}}</label>
-                            <a href="#" appStopClick (click)="clearExpiration()" class="ml-auto">
+                            <a href="#" appStopClick (click)="clearExpiration()" class="ml-auto" *ngIf="editMode">
                                 {{'clear' | i18n}}
                             </a>
                         </div>
-                        <input id="expirationDate" class="form-control" type="datetime-local" name="ExpirationDate"
-                            [(ngModel)]="expirationDate">
+                        <div *ngIf="!editMode">
+                            <select id="expirationDate" name="ExpirationDateSelect" [(ngModel)]="expirationDateSelect"
+                                class="form-control" required>
+                                <option *ngFor="let o of expirationDateOptions" [ngValue]="o.value">{{o.name}}
+                                </option>
+                            </select>
+                            <input id="expirationDateCustom" class="form-control mt-1" type="datetime-local"
+                                name="ExpirationDate" [(ngModel)]="expirationDate" required
+                                *ngIf="expirationDateSelect === 0">
+                        </div>
+                        <div *ngIf="editMode">
+                            <input id="expirationDate" class="form-control" type="datetime-local" name="ExpirationDate"
+                                [(ngModel)]="expirationDate">
+                        </div>
                     </div>
                 </div>
                 <div class="row">

src/app/send/add-edit.component.ts

@@ -48,14 +48,30 @@ export class AddEditComponent {
     deletePromise: Promise<any>;
     sendType = SendType;
     typeOptions: any[];
+    deletionDateOptions: any[];
+    expirationDateOptions: any[];
+    deletionDateSelect = 168;
+    expirationDateSelect: number = null;
 
     constructor(private i18nService: I18nService, private platformUtilsService: PlatformUtilsService,
-        private apiService: ApiService, private environmentService: EnvironmentService,
-        private datePipe: DatePipe, private sendService: SendService) {
+        private environmentService: EnvironmentService, private datePipe: DatePipe,
+        private sendService: SendService) {
         this.typeOptions = [
             { name: i18nService.t('sendTypeFile'), value: SendType.File },
             { name: i18nService.t('sendTypeText'), value: SendType.Text },
         ];
+        this.deletionDateOptions = this.expirationDateOptions = [
+            { name: i18nService.t('oneHour'), value: 1 },
+            { name: i18nService.t('oneDay'), value: 24 },
+            { name: i18nService.t('days', '2'), value: 48 },
+            { name: i18nService.t('days', '3'), value: 72 },
+            { name: i18nService.t('days', '7'), value: 168 },
+            { name: i18nService.t('days', '30'), value: 720 },
+            { name: i18nService.t('custom'), value: 0 },
+        ];
+        this.expirationDateOptions = [
+            { name: i18nService.t('never'), value: null }
+        ].concat([...this.deletionDateOptions]);
     }
 
     async ngOnInit() {
@@ -88,10 +104,8 @@ export class AddEditComponent {
         this.hasPassword = this.send.password != null && this.send.password.trim() !== '';
 
         // Parse dates
-        this.deletionDate = this.send.deletionDate == null ? null :
-            this.datePipe.transform(this.send.deletionDate, 'yyyy-MM-ddTHH:mm');
-        this.expirationDate = this.send.expirationDate == null ? null :
-            this.datePipe.transform(this.send.expirationDate, 'yyyy-MM-ddTHH:mm');
+        this.deletionDate = this.dateToString(this.send.deletionDate);
+        this.expirationDate = this.dateToString(this.send.expirationDate);
 
         if (this.editMode) {
             let webVaultUrl = this.environmentService.getWebVaultUrl();
@@ -127,6 +141,20 @@ export class AddEditComponent {
             }
         }
 
+        if (!this.editMode) {
+            const now = new Date();
+            if (this.deletionDateSelect > 0) {
+                const d = new Date();
+                d.setHours(now.getHours() + this.deletionDateSelect);
+                this.deletionDate = this.dateToString(d);
+            }
+            if (this.expirationDateSelect != null && this.expirationDateSelect > 0) {
+                const d = new Date();
+                d.setHours(now.getHours() + this.expirationDateSelect);
+                this.expirationDate = this.dateToString(d);
+            }
+        }
+
         const encSend = await this.encryptSend(file);
         try {
             this.formPromise = this.sendService.saveWithServer(encSend);
@@ -158,7 +186,7 @@ export class AddEditComponent {
         }
 
         try {
-            this.deletePromise = this.apiService.deleteSend(this.send.id);
+            this.deletePromise = this.sendService.deleteWithServer(this.send.id);
             await this.deletePromise;
             this.platformUtilsService.showToast('success', null, this.i18nService.t('deletedSend'));
             await this.load();
@@ -167,9 +195,7 @@ export class AddEditComponent {
     }
 
     protected async loadSend(): Promise<Send> {
-        const response = await this.apiService.getSend(this.sendId);
-        const data = new SendData(response);
-        return new Send(data);
+        return this.sendService.get(this.sendId);
     }
 
     protected async encryptSend(file: File): Promise<[Send, ArrayBuffer]> {
@@ -189,4 +215,8 @@ export class AddEditComponent {
 
         return sendData;
     }
+
+    protected dateToString(d: Date) {
+        return d == null ? null : this.datePipe.transform(d, 'yyyy-MM-ddTHH:mm');
+    }
 }

src/locales/en/messages.json

@@ -3443,10 +3443,10 @@
     "message": "Time required before automatically granting access."
   },
   "oneDay": {
-    "message": "1 Day"
+    "message": "1 day"
   },
   "days": {
-    "message": "$DAYS$ Days",
+    "message": "$DAYS$ days",
     "placeholders": {
       "days": {
         "content": "$1",
@@ -3559,5 +3559,8 @@
   },
   "disableRequireSsoError": {
     "message": "You must manually disable the Single Sign-On Authentication policy before this policy can be disabled."
+  },
+  "custom": {
+    "message": "Custom"
   }
 }