[PM-12403] - Implement Remove Send policy on Add/edit screen (#11178)

* disable edit send if policy requires

* remove unused var

* don't display free bitwarden families button

* Revert "don't display free bitwarden families button"

This reverts commit 832564d705.

* use config instead of policy service

* Revert "don't display free bitwarden families button"

This reverts commit 832564d705.

* remove unnecessary code

* Use short when transforming deletionDate instead of fixed format

---------

Co-authored-by: Daniel James Smith <djsmith85@users.noreply.github.com>

libs/tools/send/send-ui/src/send-form/components/options/send-options.component.ts

@@ -97,6 +97,7 @@ export class SendOptionsComponent implements OnInit {
       });
     });
   }
+
   ngOnInit() {
     if (this.sendFormContainer.originalSendView) {
       this.sendOptionsForm.patchValue({
@@ -107,5 +108,8 @@ export class SendOptionsComponent implements OnInit {
         notes: this.sendFormContainer.originalSendView.notes,
       });
     }
+    if (!this.config.areSendsAllowed) {
+      this.sendOptionsForm.disable();
+    }
   }
 }

libs/tools/send/send-ui/src/send-form/components/send-details/base-send-details.component.ts

@@ -1,107 +0,0 @@
-import { DatePipe } from "@angular/common";
-import { Component, Input, OnInit } from "@angular/core";
-import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
-import { FormBuilder, FormControl, Validators } from "@angular/forms";
-
-import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
-import { SendView } from "@bitwarden/common/tools/send/models/view/send.view";
-
-import { SendFormConfig } from "../../abstractions/send-form-config.service";
-import { SendFormContainer } from "../../send-form-container";
-
-// Value = hours
-export enum DatePreset {
-  OneHour = 1,
-  OneDay = 24,
-  TwoDays = 48,
-  ThreeDays = 72,
-  SevenDays = 168,
-  FourteenDays = 336,
-  ThirtyDays = 720,
-}
-
-export interface DatePresetSelectOption {
-  name: string;
-  value: DatePreset | string;
-}
-
-@Component({
-  selector: "base-send-details-behavior",
-  template: "",
-})
-export class BaseSendDetailsComponent implements OnInit {
-  @Input() config: SendFormConfig;
-  @Input() originalSendView?: SendView;
-
-  customDeletionDateOption: DatePresetSelectOption | null = null;
-  datePresetOptions: DatePresetSelectOption[] = [];
-
-  sendDetailsForm = this.formBuilder.group({
-    name: new FormControl("", Validators.required),
-    selectedDeletionDatePreset: new FormControl(DatePreset.SevenDays || "", Validators.required),
-  });
-
-  constructor(
-    protected sendFormContainer: SendFormContainer,
-    protected formBuilder: FormBuilder,
-    protected i18nService: I18nService,
-    protected datePipe: DatePipe,
-  ) {
-    this.sendDetailsForm.valueChanges.pipe(takeUntilDestroyed()).subscribe((value) => {
-      this.sendFormContainer.patchSend((send) => {
-        return Object.assign(send, {
-          name: value.name,
-          deletionDate: new Date(this.formattedDeletionDate),
-          expirationDate: new Date(this.formattedDeletionDate),
-        } as SendView);
-      });
-    });
-
-    this.sendFormContainer.registerChildForm("sendDetailsForm", this.sendDetailsForm);
-  }
-
-  async ngOnInit() {
-    this.setupDeletionDatePresets();
-
-    if (this.originalSendView) {
-      this.sendDetailsForm.patchValue({
-        name: this.originalSendView.name,
-        selectedDeletionDatePreset: this.originalSendView.deletionDate.toString(),
-      });
-
-      if (this.originalSendView.deletionDate) {
-        this.customDeletionDateOption = {
-          name: this.datePipe.transform(this.originalSendView.deletionDate, "MM/dd/yyyy, hh:mm a"),
-          value: this.originalSendView.deletionDate.toString(),
-        };
-        this.datePresetOptions.unshift(this.customDeletionDateOption);
-      }
-    }
-  }
-
-  setupDeletionDatePresets() {
-    const defaultSelections: DatePresetSelectOption[] = [
-      { name: this.i18nService.t("oneHour"), value: DatePreset.OneHour },
-      { name: this.i18nService.t("oneDay"), value: DatePreset.OneDay },
-      { name: this.i18nService.t("days", "2"), value: DatePreset.TwoDays },
-      { name: this.i18nService.t("days", "3"), value: DatePreset.ThreeDays },
-      { name: this.i18nService.t("days", "7"), value: DatePreset.SevenDays },
-      { name: this.i18nService.t("days", "14"), value: DatePreset.FourteenDays },
-      { name: this.i18nService.t("days", "30"), value: DatePreset.ThirtyDays },
-    ];
-
-    this.datePresetOptions = defaultSelections;
-  }
-
-  get formattedDeletionDate(): string {
-    const now = new Date();
-    const selectedValue = this.sendDetailsForm.controls.selectedDeletionDatePreset.value;
-
-    if (typeof selectedValue === "string") {
-      return selectedValue;
-    }
-
-    const milliseconds = now.setTime(now.getTime() + (selectedValue as number) * 60 * 60 * 1000);
-    return new Date(milliseconds).toString();
-  }
-}

libs/tools/send/send-ui/src/send-form/components/send-details/send-details.component.ts

@@ -1,12 +1,14 @@
 import { CommonModule, DatePipe } from "@angular/common";
-import { Component, OnInit } from "@angular/core";
+import { Component, OnInit, Input } from "@angular/core";
-import { FormBuilder, ReactiveFormsModule } from "@angular/forms";
+import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
+import { FormBuilder, FormControl, ReactiveFormsModule, Validators } from "@angular/forms";
 import { firstValueFrom } from "rxjs";
 
 import { JslibModule } from "@bitwarden/angular/jslib.module";
 import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
 import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
 import { SendType } from "@bitwarden/common/tools/send/enums/send-type";
+import { SendView } from "@bitwarden/common/tools/send/models/view/send.view";
 import {
   SectionComponent,
   SectionHeaderComponent,
@@ -18,13 +20,29 @@ import {
   SelectModule,
 } from "@bitwarden/components";
 
+import { SendFormConfig } from "../../abstractions/send-form-config.service";
 import { SendFormContainer } from "../../send-form-container";
 import { SendOptionsComponent } from "../options/send-options.component";
 
-import { BaseSendDetailsComponent } from "./base-send-details.component";
 import { SendFileDetailsComponent } from "./send-file-details.component";
 import { SendTextDetailsComponent } from "./send-text-details.component";
 
+// Value = hours
+export enum DatePreset {
+  OneHour = 1,
+  OneDay = 24,
+  TwoDays = 48,
+  ThreeDays = 72,
+  SevenDays = 168,
+  FourteenDays = 336,
+  ThirtyDays = 720,
+}
+
+export interface DatePresetSelectOption {
+  name: string;
+  value: DatePreset | string;
+}
+
 @Component({
   selector: "tools-send-details",
   templateUrl: "./send-details.component.html",
@@ -46,10 +64,20 @@ import { SendTextDetailsComponent } from "./send-text-details.component";
     SelectModule,
   ],
 })
-export class SendDetailsComponent extends BaseSendDetailsComponent implements OnInit {
+export class SendDetailsComponent implements OnInit {
+  @Input() config: SendFormConfig;
+  @Input() originalSendView?: SendView;
+
   FileSendType = SendType.File;
   TextSendType = SendType.Text;
   sendLink: string | null = null;
+  customDeletionDateOption: DatePresetSelectOption | null = null;
+  datePresetOptions: DatePresetSelectOption[] = [];
+
+  sendDetailsForm = this.formBuilder.group({
+    name: new FormControl("", Validators.required),
+    selectedDeletionDatePreset: new FormControl(DatePreset.SevenDays || "", Validators.required),
+  });
 
   constructor(
     protected sendFormContainer: SendFormContainer,
@@ -58,18 +86,69 @@ export class SendDetailsComponent extends BaseSendDetailsComponent implements On
     protected datePipe: DatePipe,
     protected environmentService: EnvironmentService,
   ) {
-    super(sendFormContainer, formBuilder, i18nService, datePipe);
+    this.sendDetailsForm.valueChanges.pipe(takeUntilDestroyed()).subscribe((value) => {
-  }
+      this.sendFormContainer.patchSend((send) => {
+        return Object.assign(send, {
+          name: value.name,
+          deletionDate: new Date(this.formattedDeletionDate),
+          expirationDate: new Date(this.formattedDeletionDate),
+        } as SendView);
+      });
+    });
 
-  async getSendLink() {}
+    this.sendFormContainer.registerChildForm("sendDetailsForm", this.sendDetailsForm);
+  }
 
   async ngOnInit() {
-    await super.ngOnInit();
+    this.setupDeletionDatePresets();
-    if (!this.originalSendView) {
+
-      return;
+    if (this.originalSendView) {
+      this.sendDetailsForm.patchValue({
+        name: this.originalSendView.name,
+        selectedDeletionDatePreset: this.originalSendView.deletionDate.toString(),
+      });
+
+      if (this.originalSendView.deletionDate) {
+        this.customDeletionDateOption = {
+          name: this.datePipe.transform(this.originalSendView.deletionDate, "short"),
+          value: this.originalSendView.deletionDate.toString(),
+        };
+        this.datePresetOptions.unshift(this.customDeletionDateOption);
+      }
+
+      const env = await firstValueFrom(this.environmentService.environment$);
+      this.sendLink =
+        env.getSendUrl() + this.originalSendView.accessId + "/" + this.originalSendView.urlB64Key;
     }
-    const env = await firstValueFrom(this.environmentService.environment$);
+
-    this.sendLink =
+    if (!this.config.areSendsAllowed) {
-      env.getSendUrl() + this.originalSendView.accessId + "/" + this.originalSendView.urlB64Key;
+      this.sendDetailsForm.disable();
+    }
+  }
+
+  setupDeletionDatePresets() {
+    const defaultSelections: DatePresetSelectOption[] = [
+      { name: this.i18nService.t("oneHour"), value: DatePreset.OneHour },
+      { name: this.i18nService.t("oneDay"), value: DatePreset.OneDay },
+      { name: this.i18nService.t("days", "2"), value: DatePreset.TwoDays },
+      { name: this.i18nService.t("days", "3"), value: DatePreset.ThreeDays },
+      { name: this.i18nService.t("days", "7"), value: DatePreset.SevenDays },
+      { name: this.i18nService.t("days", "14"), value: DatePreset.FourteenDays },
+      { name: this.i18nService.t("days", "30"), value: DatePreset.ThirtyDays },
+    ];
+
+    this.datePresetOptions = defaultSelections;
+  }
+
+  get formattedDeletionDate(): string {
+    const now = new Date();
+    const selectedValue = this.sendDetailsForm.controls.selectedDeletionDatePreset.value;
+
+    if (typeof selectedValue === "string") {
+      return selectedValue;
+    }
+
+    const milliseconds = now.setTime(now.getTime() + (selectedValue as number) * 60 * 60 * 1000);
+    return new Date(milliseconds).toString();
   }
 }

libs/tools/send/send-ui/src/send-form/components/send-details/send-file-details.component.ts

@@ -73,5 +73,9 @@ export class SendFileDetailsComponent implements OnInit {
         file: this.originalSendView.file,
       });
     }
+
+    if (!this.config.areSendsAllowed) {
+      this.sendFileDetailsForm.disable();
+    }
   }
 }

libs/tools/send/send-ui/src/send-form/components/send-details/send-text-details.component.ts

@@ -57,5 +57,9 @@ export class SendTextDetailsComponent implements OnInit {
         hidden: this.originalSendView.text?.hidden || false,
       });
     }
+
+    if (!this.config.areSendsAllowed) {
+      this.sendTextDetailsForm.disable();
+    }
   }
 }