Merge branch 'Q4-DISPLAY-EXACT-AMOUNT' into FYLE-86cx5qh03

android/app/src/main/res/drawable/ic_launcher_new_splash_foreground.xml

@@ -16,19 +16,19 @@
         android:fillType="evenOdd"/>
     <path
         android:pathData="M29.629,4.657V7.149H33.45V9.688H29.629V16.883H27V4.657C27,3.199 28.217,2 29.75,2H34.473V4.563H29.75C29.677,4.539 29.629,4.586 29.629,4.657Z"
-        android:fillColor="#F3F5F7"
+        android:fillColor="#000000"
         android:fillType="evenOdd"/>
     <path
         android:pathData="M44.744,22H37.637V19.437H44.744C44.793,19.437 44.866,19.39 44.866,19.32V17.533H38.465C36.955,17.533 35.714,16.334 35.714,14.876V6.389H38.343V14.9C38.343,14.97 38.391,15.041 38.489,15.041H44.744C44.793,15.041 44.866,14.994 44.866,14.9V6.389H47.495V19.343C47.471,20.801 46.254,22 44.744,22Z"
-        android:fillColor="#F3F5F7"
+        android:fillColor="#000000"
         android:fillType="evenOdd"/>
     <path
         android:pathData="M52.193,2V14.226C52.193,14.296 52.242,14.367 52.314,14.367H54.651V16.906H52.314C50.805,16.906 49.564,15.707 49.564,14.249V2.024H52.193V2Z"
-        android:fillColor="#F3F5F7"
+        android:fillColor="#000000"
         android:fillType="evenOdd"/>
     <path
         android:pathData="M67.868,12.533V8.325C67.868,6.867 66.627,5.668 65.118,5.691H58.862C57.353,5.691 56.112,6.89 56.112,8.348V14.226C56.112,15.684 57.353,16.883 58.862,16.883H67.868V14.343H58.838C58.741,14.343 58.692,14.273 58.692,14.202V12.533H67.868ZM65.264,8.325V9.994H58.716V8.325C58.716,8.23 58.789,8.183 58.862,8.183H65.118C65.215,8.183 65.264,8.254 65.264,8.325Z"
-        android:fillColor="#F3F5F7"
+        android:fillColor="#000000"
         android:fillType="evenOdd"/>
   </group>
 </vector>

android/app/src/main/res/values/ic_launcher_new_splash_background.xml

@@ -1,4 +1,4 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <color name="ic_launcher_new_splash_background">#220033</color>
+    <color name="ic_launcher_new_splash_background">#FFFFFF</color>
 </resources>

android/app/src/main/res/values/styles.xml

@@ -18,6 +18,6 @@
 
     <style name="AppTheme.NoActionBarLaunch" parent="Theme.SplashScreen">
         <item name="windowSplashScreenAnimatedIcon">@mipmap/ic_launcher_new_splash</item>
-        <item name="windowSplashScreenBackground">#220033</item>
+        <item name="windowSplashScreenBackground">#ffffff</item>
     </style>
 </resources>

capacitor.config.json

@@ -0,0 +1 @@
+{}

ios/App/App/Base.lproj/LaunchScreen.storyboard

@@ -22,7 +22,7 @@
                             </imageView>
                         </subviews>
                         <viewLayoutGuide key="safeArea" id="Bcu-3y-fUS"/>
-                        <color key="backgroundColor" red="0.13333333333333333" green="0.0" blue="0.20000000000000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                        <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                     </view>
                 </viewController>
                 <placeholder placeholderIdentifier="IBFirstResponder" id="iYj-Kq-Ea1" userLabel="First Responder" sceneMemberID="firstResponder"/>

src/app/auth/disabled/disabled.page.html

@@ -25,7 +25,7 @@ <h1 class="disabled-user__header">Account disabled</h1>
       >
         <div class="disabled-user__cta-content">
           <ion-icon class="disabled-user__arrow-icon" [src]="'/assets/svg/arrow-left.svg'" slot="icon-only"></ion-icon>
-          <span class="disabled-user__cta-text">Back to Sign In</span>
+          <span class="disabled-user__cta-text">Back to sign in</span>
         </div>
       </ion-button>
     </div>

src/app/auth/new-password/new-password.page.html

@@ -1,106 +1,116 @@
-<div class="new-password">
-  <div>
-    <ion-icon
-      class="fy-icon new-password__back-icon"
-      src="../../../assets/svg/arrow-tail-left.svg"
-      (click)="redirectToSignIn()"
-    ></ion-icon>
+<ion-content scroll-y="false" class="no-keyboard-adjust">
+  <div class="new-password">
     <div>
-      <div class="new-password__form-header">Reset Password</div>
+      <ion-icon
+        class="fy-icon new-password__back-icon"
+        src="../../../assets/svg/arrow-tail-left.svg"
+        (click)="redirectToSignIn()"
+      ></ion-icon>
       <div>
-        <form *ngIf="fg" [formGroup]="fg">
-          <div class="new-password__input-container">
-            <div
-              class="new-password__text new-password__text-block"
-              [ngClass]="{'new-password__text__invalid': fg.controls.password.touched && !fg.controls.password.valid}"
-            >
-              <div class="new-password__text-label">New password</div>
-              <div class="new-password__password-container">
-                <input
-                  placeholder="Enter password"
-                  [required]="true"
-                  [type]="hide ? 'text': 'password'"
-                  class="new-password__text-input smartlook-show"
-                  formControlName="password"
-                  (focus)="setPasswordTooltip(true)"
-                  (blur)="setPasswordTooltip(false)"
-                />
-                <div class="new-password__password-icon-container" matSuffix (click)="hide = !hide">
-                  <ion-icon
-                    class="fy-icon new-password__password-icon"
-                    src="{{hide ? '/assets/svg/eye.svg' : '/assets/svg/eye-slash.svg'}}"
-                  ></ion-icon>
+        <div class="new-password__form-header">Reset password</div>
+        <div>
+          <form *ngIf="fg" [formGroup]="fg">
+            <div class="new-password__input-container">
+              <div
+                class="new-password__text new-password__text-block"
+                [ngClass]="{'new-password__text__invalid': fg.controls.password.touched && !fg.controls.password.valid}"
+              >
+                <div class="new-password__text-label">New password</div>
+                <div class="new-password__password-container">
+                  <input
+                    placeholder="Enter password"
+                    [required]="true"
+                    [type]="hide ? 'password': 'text'"
+                    class="new-password__text-input smartlook-show"
+                    formControlName="password"
+                    (focus)="setPasswordTooltip(true)"
+                    (blur)="setPasswordTooltip(false)"
+                  />
+                  <div class="new-password__password-icon-container" matSuffix (click)="hide = !hide">
+                    <ion-icon
+                      class="fy-icon new-password__password-icon"
+                      src="{{hide ? '/assets/svg/eye-slash.svg' : '/assets/svg/eye.svg'}}"
+                    ></ion-icon>
+                  </div>
                 </div>
+                <app-password-check-tooltip
+                  *ngIf="showPasswordTooltip"
+                  [password]="fg.controls.password.value"
+                  (isPasswordValid)="onPasswordValid($event)"
+                ></app-password-check-tooltip>
+              </div>
+              <div
+                *ngIf="fg.controls.password.touched && fg.controls.password.invalid && fg.controls.password.errors.required"
+                class="new-password__error"
+              >
+                Password cannot be empty
+              </div>
+              <div
+                *ngIf="fg.controls.password.touched && fg.controls.password.invalid && fg.controls.password.errors.invalidPassword && !fg.controls.password.errors.required"
+                class="new-password__error"
+              >
+                Please enter a valid password.
               </div>
-              <app-password-check-tooltip
-                *ngIf="showPasswordTooltip"
-                [password]="fg.controls.password.value"
-                (isPasswordValid)="onPasswordValid($event)"
-              ></app-password-check-tooltip>
-            </div>
-            <div
-              *ngIf="fg.controls.password.touched && fg.controls.password.invalid && fg.controls.password.errors.required"
-              class="new-password__error"
-            >
-              Password cannot be empty
-            </div>
-            <div
-              *ngIf="fg.controls.password.touched && fg.controls.password.invalid && fg.controls.password.errors.invalidPassword && !fg.controls.password.errors.required"
-              class="new-password__error"
-            >
-              Please enter a valid password.
             </div>
-          </div>
-          <div class="new-password__input-container">
-            <div
-              class="new-password__text new-password__text-block"
-              [ngClass]="{'new-password__text__invalid': fg.controls.confirmPassword.touched && !fg.controls.confirmPassword.valid}"
-            >
-              <div class="new-password__text-label">Confirm new password</div>
-              <div class="new-password__password-container">
-                <input
-                  placeholder="Re-enter password"
-                  [required]="true"
-                  [type]="hideConfirmPassword ? 'text': 'password'"
-                  class="new-password__text-input smartlook-show"
-                  formControlName="confirmPassword"
-                />
-                <div
-                  class="new-password__password-icon-container"
-                  matSuffix
-                  (click)="hideConfirmPassword = !hideConfirmPassword"
-                >
-                  <ion-icon
-                    class="fy-icon new-password__password-icon"
-                    src="{{hideConfirmPassword ? '/assets/svg/eye.svg' : '/assets/svg/eye-slash.svg'}}"
-                  ></ion-icon>
+            <div class="new-password__input-container">
+              <div
+                class="new-password__text new-password__text-block"
+                [ngClass]="{'new-password__text__invalid': fg.controls.confirmPassword.touched && !fg.controls.confirmPassword.valid}"
+              >
+                <div class="new-password__text-label">Confirm new password</div>
+                <div class="new-password__password-container">
+                  <input
+                    placeholder="Re-enter password"
+                    [required]="true"
+                    [type]="hideConfirmPassword ? 'password' : 'text'"
+                    class="new-password__text-input smartlook-show"
+                    formControlName="confirmPassword"
+                  />
+                  <div
+                    class="new-password__password-icon-container"
+                    matSuffix
+                    (click)="hideConfirmPassword = !hideConfirmPassword"
+                  >
+                    <ion-icon
+                      class="fy-icon new-password__password-icon"
+                      src="{{hideConfirmPassword ? '/assets/svg/eye-slash.svg' : '/assets/svg/eye.svg' }}"
+                    ></ion-icon>
+                  </div>
                 </div>
               </div>
+              <div
+                *ngIf="fg.controls.confirmPassword.touched && fg.controls.confirmPassword.invalid && fg.controls.confirmPassword.errors.required"
+                class="new-password__error"
+              >
+                Password cannot be empty
+              </div>
+              <div
+                *ngIf="fg.controls.confirmPassword.touched && fg.controls.confirmPassword.invalid && fg.controls.confirmPassword.errors.passwordMismatch"
+                class="new-password__error"
+              >
+                Passwords do not match
+              </div>
             </div>
-            <div
-              *ngIf="fg.controls.confirmPassword.touched && fg.controls.confirmPassword.invalid && fg.controls.confirmPassword.errors.required"
-              class="new-password__error"
-            >
-              Password cannot be empty
-            </div>
-            <div
-              *ngIf="fg.controls.confirmPassword.touched && fg.controls.confirmPassword.invalid && fg.controls.confirmPassword.errors.passwordMismatch"
-              class="new-password__error"
-            >
-              Passwords do not match
-            </div>
-          </div>
-        </form>
+          </form>
+        </div>
       </div>
     </div>
-  </div>
-  <div *ngIf="fg">
-    <ion-button (click)="changePassword()" class="btn-primary" fill="clear" [disabled]="!fg.valid">
-      Reset password
-    </ion-button>
-    <div class="new-password__cta-secondary" (click)="redirectToSignIn()">
-      <ion-icon class="new-password__arrow-icon" [src]="'/assets/svg/arrow-left.svg'" slot="icon-only"></ion-icon>
-      <span class="new-password__cta-text">Back to Sign In</span>
+    <div *ngIf="fg">
+      <ion-button
+        (click)="changePassword()"
+        class="btn-primary"
+        fill="clear"
+        [disabled]="!fg.valid"
+        appFormButtonValidation
+        [loading]="isLoading"
+        [loadingText]="'Resetting'"
+      >
+        Reset password
+      </ion-button>
+      <div class="new-password__cta-secondary" (click)="redirectToSignIn()">
+        <ion-icon class="new-password__arrow-icon" [src]="'/assets/svg/arrow-left.svg'" slot="icon-only"></ion-icon>
+        <span class="new-password__cta-text">Back to sign in</span>
+      </div>
     </div>
   </div>
-</div>
+</ion-content>

src/app/auth/new-password/new-password.page.scss

@@ -3,7 +3,7 @@
 .new-password {
   display: flex;
   flex-direction: column;
-  padding: 24px 20px;
+  padding: 24px 20px 44px 20px;
   margin-top: 18px;
   height: 100%;
   justify-content: space-between;
@@ -19,6 +19,8 @@
   &__error {
     color: $red;
     font-size: 12px;
+    display: flex;
+    align-items: center;
   }
 
   &__text {
@@ -75,6 +77,7 @@
     position: relative;
     margin-bottom: 24px;
     color: $black;
+    font-weight: 500;
   }
 
   &__save {
@@ -85,7 +88,7 @@
   }
 
   &__back-icon {
-    margin-bottom: 20px;
+    margin-bottom: 16px;
     width: 28px;
     height: 28px;
   }

src/app/auth/new-password/new-password.page.ts

@@ -33,12 +33,14 @@ export class NewPasswordPage implements OnInit {
 
   isPasswordValid = false;
 
-  hide = false;
+  hide = true;
 
-  hideConfirmPassword = false;
+  hideConfirmPassword = true;
 
   showPasswordTooltip = false;
 
+  isLoading = false;
+
   constructor(
     private fb: FormBuilder,
     private activatedRoute: ActivatedRoute,
@@ -62,7 +64,7 @@ export class NewPasswordPage implements OnInit {
 
   changePassword(): void {
     const refreshToken = this.activatedRoute.snapshot.params.refreshToken as string;
-
+    this.isLoading = true;
     from(this.loaderService.showLoader())
       .pipe(
         switchMap(() => this.routerAuthService.resetPassword(refreshToken, this.fg.controls.password.value as string)),
@@ -73,7 +75,10 @@ export class NewPasswordPage implements OnInit {
           this.trackingService.resetPassword();
           await this.trackLoginInfo();
         }),
-        finalize(() => from(this.loaderService.hideLoader()))
+        finalize(() => {
+          this.isLoading = false;
+          return from(this.loaderService.hideLoader());
+        })
       )
       .subscribe(
         () => {
@@ -109,6 +114,8 @@ export class NewPasswordPage implements OnInit {
 
   onPasswordValid(isValid: boolean): void {
     this.isPasswordValid = isValid;
+    this.fg.controls.password.updateValueAndValidity();
+    this.fg.controls.confirmPassword.updateValueAndValidity();
   }
 
   redirectToSignIn(): void {