Merge pull request #1672 from bitwarden/SendDateQaFixes

Send Date Fallback QA Fixes

jslib

@@ -1 +1 @@
-Subproject commit 125de0dd4704909f036dbad374a4cd71719de09e
+Subproject commit f29afc7cf7bbd514d07c0354b3c45491dcae3c14

src/_locales/en/messages.json

@@ -1651,5 +1651,32 @@
   },
   "sendFileCalloutHeader": {
     "message": "Before you start"
+  },
+  "sendFirefoxCustomDatePopoutMessage1": {
+    "message": "To use a calendar style date picker",
+    "description": "This will be used as part of a larger sentence, broken up to include links. The full sentence will read '**To use a calendar style date picker ** click here to pop out your window.'"
+  },
+  "sendFirefoxCustomDatePopoutMessage2": {
+    "message": "click here",
+    "description": "This will be used as part of a larger sentence, broken up to include links. The full sentence will read 'To use a calendar style date picker **click here** to pop out your window.'"
+  },
+  "sendFirefoxCustomDatePopoutMessage3": {
+    "message": "to pop out your window.",
+    "description": "This will be used as part of a larger sentence, broken up to include links. The full sentence will read 'To use a calendar style date picker click here **to pop out your window.**'"
+  },
+  "expirationDateIsInvalid": {
+    "message": "The expiration date provided is not valid."
+  },
+  "deletionDateIsInvalid": {
+    "message": "The deletion date provided is not valid."
+  },
+  "expirationDateAndTimeRequired": {
+    "message": "An expiration date and time are required."
+  },
+  "deletionDateAndTimeRequired": {
+    "message": "A deletion date and time are required."
+  },
+  "dateParsingError": {
+    "message": "There was an error saving your deletion and expiration dates."
   }
 }

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

@@ -154,6 +154,9 @@
                 </div>
                 <div class="box-footer">
                     {{'deletionDateDesc' | i18n}}
+                    <ng-container *ngIf="(!inPopout && isFirefox) && (this.editMode || (deletionDateSelect === 0 && !editMode))">
+                        <br>{{'sendFirefoxCustomDatePopoutMessage1' | i18n}} <a (click)="popOutWindow()">{{'sendFirefoxCustomDatePopoutMessage2' | i18n}}</a> {{'sendFirefoxCustomDatePopoutMessage3' | i18n}}
+                    </ng-container>
                 </div>
             </div>
             <!-- Expiration Date -->
@@ -168,7 +171,7 @@
                         <div class="flex flex-grow" *ngIf="!isDateTimeLocalSupported">
                             <input id="expirationDateCustomFallback" type="date"
                                 name="ExpirationDateFallback" [(ngModel)]="expirationDateFallback" [required]="!editMode"
-                                placeholder="MM/DD/YYYY" [readOnly]="disableSend">
+                                placeholder="MM/DD/YYYY" [readOnly]="disableSend" (change)="expirationDateFallbackChanged()">
                             <input *ngIf="!isSafari" id="expirationTimeCustomFallback" type="time"
                                 name="ExpirationTimeFallback" [(ngModel)]="expirationTimeFallback" [required]="!editMode"
                                 placeholder="HH:MM AM/PM" [readOnly]="disableSend">
@@ -200,6 +203,9 @@
                 </div>
                 <div class="box-footer">
                     {{'expirationDateDesc' | i18n}}
+                    <ng-container *ngIf="(!inPopout && isFirefox) && (this.editMode || (deletionDateSelect === 0 && !editMode))">
+                        <br>{{'sendFirefoxCustomDatePopoutMessage1' | i18n}} <a (click)="popOutWindow()">{{'sendFirefoxCustomDatePopoutMessage2' | i18n}}</a> {{'sendFirefoxCustomDatePopoutMessage3' | i18n}}
+                    </ng-container>
                 </div>
             </div>
             <!-- Maximum Access Count -->