Broadcast transaction form

fixes #878

frontend/src/app/components/push-transaction/push-transaction.component.html

@@ -0,0 +1,12 @@
+<div class="container-xl">
+  <h1 i18n="shared.broadcast-transaction|Broadcast Transaction">Broadcast Transaction</h1>
+
+  <form [formGroup]="pushTxForm" (submit)="pushTxForm.valid && postTx()" novalidate>
+    <div class="mb-3">
+      <textarea formControlName="txHash" class="form-control" rows="5" i18n-placeholder="transaction.hex" placeholder="Transaction Hex"></textarea>
+    </div>
+    <button [disabled]="isLoading" type="submit" class="btn btn-primary mr-2" i18n="shared.broadcast-transaction|Broadcast Transaction">Broadcast Transaction</button>
+    <p class="red-color d-inline">{{ error }}</p> <a *ngIf="txId" [routerLink]="['/tx/' | relativeUrl, txId]">{{ txId }}</a>
+  </form>
+
+</div>

frontend/src/app/components/push-transaction/push-transaction.component.ts

@@ -0,0 +1,48 @@
+import { Component, OnInit } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { ApiService } from 'src/app/services/api.service';
+
+@Component({
+  selector: 'app-push-transaction',
+  templateUrl: './push-transaction.component.html',
+  styleUrls: ['./push-transaction.component.scss']
+})
+export class PushTransactionComponent implements OnInit {
+  pushTxForm: FormGroup;
+  error: string = '';
+  txId: string = '';
+  isLoading = false;
+
+  constructor(
+    private formBuilder: FormBuilder,
+    private apiService: ApiService,
+  ) { }
+
+  ngOnInit(): void {
+    this.pushTxForm = this.formBuilder.group({
+      txHash: ['', Validators.required],
+    });
+  }
+
+  postTx() {
+    this.isLoading = true;
+    this.error = '';
+    this.txId = '';
+    this.apiService.postTransaction$(this.pushTxForm.get('txHash').value)
+      .subscribe((result) => {
+        this.isLoading = false;
+        this.txId = result;
+        this.pushTxForm.reset();
+      },
+      (error) => {
+        if (typeof error.error === 'string') {
+          const matchText = error.error.match('"message":"(.*?)"');
+          this.error = matchText && matchText[1] || error.error;
+        } else if (error.message) {
+          this.error = error.message;
+        }
+        this.isLoading = false;
+      });
+  }
+
+}