Show warning when trying to override an existing planned withdrawal

raiden-network · Mar 31, 2021 · be3ac60 · be3ac60
1 parent e9d9f77
commit be3ac60
Show file tree

Hide file tree

Showing 5 changed files with 43 additions and 12 deletions.
diff --git a/src/app/components/header/header.component.scss b/src/app/components/header/header.component.scss
@@ -122,7 +122,7 @@
     line-height: 30px;
     color: $white;
     width: 125px;
-    max-height: 170px;
+    max-height: 171px;
     overflow-y: scroll;
 
     &__label {

diff --git a/...p/components/user-deposit-dialog/deposit-withdraw-form/deposit-withdraw-form.component.ts b/...p/components/user-deposit-dialog/deposit-withdraw-form/deposit-withdraw-form.component.ts
@@ -8,12 +8,17 @@ import {
     ViewChild,
 } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { MatDialog } from '@angular/material/dialog';
+import {
+    ConfirmationDialogComponent,
+    ConfirmationDialogPayload,
+} from 'app/components/confirmation-dialog/confirmation-dialog.component';
 import { TokenInputComponent } from 'app/components/token-input/token-input.component';
 import { DepositMode } from 'app/models/deposit-mode.enum';
 import { UserDepositService } from 'app/services/user-deposit.service';
 import BigNumber from 'bignumber.js';
-import { Observable, Subject } from 'rxjs';
-import { map, takeUntil } from 'rxjs/operators';
+import { Observable, of, Subject } from 'rxjs';
+import { first, map, switchMap, takeUntil } from 'rxjs/operators';
 
 @Component({
     selector: 'app-deposit-withdraw-form',
@@ -34,7 +39,8 @@ export class DepositWithdrawFormComponent implements OnInit, OnDestroy {
 
     constructor(
         private fb: FormBuilder,
-        private userDepositService: UserDepositService
+        private userDepositService: UserDepositService,
+        private dialog: MatDialog
     ) {
         this.form = this.fb.group({
             amount: ['', Validators.required],
@@ -74,7 +80,37 @@ export class DepositWithdrawFormComponent implements OnInit, OnDestroy {
     }
 
     submit() {
-        this.accept.emit(this.form.value.amount);
+        let canSubmit$: Observable<boolean>;
+        if (this.depositing) {
+            canSubmit$ = of(true);
+        } else {
+            canSubmit$ = this.userDepositService.withdrawPlan$.pipe(
+                first(),
+                switchMap((withdrawPlan) => {
+                    if (withdrawPlan.amount.isZero()) {
+                        return of(true);
+                    }
+                    const confirmationPayload: ConfirmationDialogPayload = {
+                        title: 'Override Planned Withdrawal',
+                        message:
+                            'There is already a withdrawal planned. This will override the existing plan. Are you sure?',
+                    };
+                    const dialog = this.dialog.open(
+                        ConfirmationDialogComponent,
+                        {
+                            data: confirmationPayload,
+                        }
+                    );
+                    return dialog.afterClosed();
+                })
+            );
+        }
+
+        canSubmit$.subscribe((result) => {
+            if (result) {
+                this.accept.emit(this.form.value.amount);
+            }
+        });
     }
 
     onEnter(event: Event) {

diff --git a/src/app/components/user-deposit-dialog/user-deposit-dialog.component.html b/src/app/components/user-deposit-dialog/user-deposit-dialog.component.html
@@ -98,7 +98,7 @@
             color="accent"
             (click)="showPlanWithdrawInput()"
             [disabled]="planWithdrawPending"
-            matTooltip="Plan withdrawal pending"
+            matTooltip="Plan Withdrawal pending"
             [matTooltipDisabled]="!planWithdrawPending"
         >
             <mat-icon

diff --git a/src/app/components/user-deposit-dialog/user-deposit-dialog.component.scss b/src/app/components/user-deposit-dialog/user-deposit-dialog.component.scss
@@ -151,11 +151,6 @@
         border-radius: 8px !important;
 
         &:disabled {
-            background-color: $bg-label-yellow !important;
-            color: $label-yellow !important;
-            stroke: $label-yellow !important;
-            opacity: 1;
-            border: none;
             cursor: wait;
         }
     }

diff --git a/src/app/services/user-deposit.service.ts b/src/app/services/user-deposit.service.ts
@@ -446,7 +446,7 @@ export class UserDepositService {
                     of(newValue)
                 );
             }, null),
-            shareReplay({ refCount: true, bufferSize: 1 })
+            shareReplay(1)
         );
     }
 }