Add estimate fee functionality to UI

Breeze.UI/src/app/shared/classes/fee-estimation.ts

@@ -9,10 +9,10 @@ export class FeeEstimation {
     }
     
     walletName: string;
-        accountName: string;
-        destinationAddress: string;
-        amount: string;
-        feeType: string;
-        allowUnconfirmed: boolean;
-    }
+    accountName: string;
+    destinationAddress: string;
+    amount: string;
+    feeType: string;
+    allowUnconfirmed: boolean;
+}
     
\ No newline at end of file

Breeze.UI/src/app/shared/services/api.service.ts

@@ -233,9 +233,17 @@ export class ApiService {
      */
     estimateFee(data: FeeEstimation): Observable<any> {
       this.getCurrentCoin();
+
+      let params: URLSearchParams = new URLSearchParams();
+      params.set('walletName', data.walletName);
+      params.set('accountName', data.accountName);
+      params.set('destinationAddress', data.destinationAddress);
+      params.set('amount', data.amount);
+      params.set('feeType', data.feeType);
+      params.set('allowUnconfirmed', "true");
       
       return this.http
-        .post(this.currentApiUrl + '/wallet/estimate-txfee/', JSON.stringify(data), {headers: this.headers})
+        .get(this.currentApiUrl + '/wallet/estimate-txfee', new RequestOptions({headers: this.headers, search: params}))
         .map((response: Response) => response);
     }
 
@@ -246,7 +254,7 @@ export class ApiService {
       this.getCurrentCoin();
 
       return this.http
-        .post(this.currentApiUrl + '/wallet/build-transaction/', JSON.stringify(data), {headers: this.headers})
+        .post(this.currentApiUrl + '/wallet/build-transaction', JSON.stringify(data), {headers: this.headers})
         .map((response: Response) => response);
     }
 
@@ -257,7 +265,7 @@ export class ApiService {
       this.getCurrentCoin();
 
       return this.http
-        .post(this.currentApiUrl + '/wallet/send-transaction/', JSON.stringify(data), {headers: this.headers})
+        .post(this.currentApiUrl + '/wallet/send-transaction', JSON.stringify(data), {headers: this.headers})
         .map((response: Response) => response);
     }
 

Breeze.UI/src/app/wallet/send/send.component.html

@@ -35,19 +35,18 @@
                 </label>
               </div>
             <!-- /fee buttons -->
-          </div>
-          <div class="form-group clearfix">
-            <label for="walletPassword">Wallet Password</label>
-            <input type="password" class="form-control form-control-success" formControlName="password" id="walletPassword" placeholder="Please enter your wallet password.">
-            <div *ngIf="formErrors.password" class="form-control-feedback">{{formErrors.password}}</div>
-          </div>
           <div class="form-group clearfix">
-            <button type="button" class="btn btn-link" (click)="buildTransaction()" [disabled]="!sendForm.valid">Estimate Fee</button>
             <div *ngIf="estimatedFee">
               <label>Estimated Fee: </label>
               <label>{{ estimatedFee | coinNotation }} {{ coinUnit }}</label>
             </div>
           </div>
+          </div>
+          <div class="form-group clearfix">
+            <label for="walletPassword">Wallet Password</label>
+            <input type="password" class="form-control form-control-success" formControlName="password" id="walletPassword" placeholder="Please enter your wallet password.">
+            <div *ngIf="formErrors.password" class="form-control-feedback">{{formErrors.password}}</div>
+          </div>
         </form>
         <!-- /form-->
       </div>

Breeze.UI/src/app/wallet/send/send.component.ts

@@ -7,6 +7,7 @@ import { ModalService } from '../../shared/services/modal.service';
 
 import { NgbModal, NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
 
+import { FeeEstimation } from '../../shared/classes/fee-estimation';
 import { TransactionBuilding } from '../../shared/classes/transaction-building';
 import { TransactionSending } from '../../shared/classes/transaction-sending';
 
@@ -38,7 +39,7 @@ export class SendComponent implements OnInit {
 
   private buildSendForm(): void {
     this.sendForm = this.fb.group({
-      "address": ["", Validators.required],
+      "address": ["", Validators.compose([Validators.required, Validators.minLength(26)])],
       // "amount": ["", Validators.compose([Validators.required, Validators.pattern(/^[0-9]+(\.[0-9]{0,8})?$/)])],
       "amount": ["", Validators.compose([Validators.required, Validators.pattern(/^([0-9]+)?(\.[0-9]{0,8})?$/)])],
       "fee": ["medium", Validators.required],
@@ -64,6 +65,10 @@ export class SendComponent implements OnInit {
         }
       }
     }
+
+    if(this.sendForm.get("address").valid && this.sendForm.get("amount").valid) {
+      this.estimateFee();
+    }
   }
 
   formErrors = {
@@ -75,7 +80,8 @@ export class SendComponent implements OnInit {
 
   validationMessages = {
     'address': {
-      'required': 'An address is required.'
+      'required': 'An address is required.',
+      'minlength': 'An address is at least 26 characters long.'
     },
     'amount': {
       'required': 'An amount is required.',
@@ -126,6 +132,43 @@ export class SendComponent implements OnInit {
       )
   };
 
+  public estimateFee() {
+    let transaction = new FeeEstimation(
+      this.globalService.getWalletName(),
+      "account 0",
+      this.sendForm.get("address").value.trim(),
+      this.sendForm.get("amount").value,
+      this.sendForm.get("fee").value,
+      true
+    );
+
+    this.apiService.estimateFee(transaction)
+      .subscribe(
+        response => {
+          if (response.status >= 200 && response.status < 400){
+            this.responseMessage = response.json();
+          }
+        },
+        error => {
+          console.log(error);
+          if (error.status === 0) {
+            this.genericModalService.openModal(null, null);
+          } else if (error.status >= 400) {
+            if (!error.json().errors[0]) {
+              console.log(error);
+            }
+            else {
+              this.genericModalService.openModal(null, error.json().errors[0].message);
+            }
+          }
+        },
+        () => {
+          this.estimatedFee = this.responseMessage.fee;
+        }
+      )
+    ;
+  }
+
   public buildTransaction() {
     this.transaction = new TransactionBuilding(
       this.globalService.getWalletName(),
@@ -137,11 +180,14 @@ export class SendComponent implements OnInit {
       true
     );
 
+    let transactionData;
+
     this.apiService
       .buildTransaction(this.transaction)
       .subscribe(
         response => {
           if (response.status >= 200 && response.status < 400){
+            console.log(response);
             this.responseMessage = response.json();
           }
         },