Flush Cache / Txs implementation

everoddandeven · Oct 19, 2024 · 7ed673a · 7ed673a
1 parent f5e74b6
commit 7ed673a
Show file tree

Hide file tree

Showing 2 changed files with 122 additions and 21 deletions.
diff --git a/src/app/pages/transactions/transactions.component.html b/src/app/pages/transactions/transactions.component.html
@@ -273,21 +273,35 @@ <h4 class="mb-3">Get coinbase tx sum</h4>
   </div>
 
   <div class="tab-pane fade" id="pills-flush-tx-pool" role="tabpanel" aria-labelledby="pills-flush-tx-pool-tab" tabindex="0">
+    <div *ngIf="flushSuccess" class="alert alert-success d-flex align-items-center justify-content-center text-center" role="alert">
+      <h4><i class="bi bi-send-check m-2"></i></h4>&nbsp;&nbsp;
+      <div>
+        Successfully flushed txs
+      </div>
+    </div>
+
+    <div *ngIf="flushError !== ''" class="alert alert-danger d-flex align-items-center justify-content-center text-center" role="alert">
+      <h4><i class="bi bi-exclamation-triangle m-2"></i></h4>&nbsp;&nbsp;
+      <div>
+        {{flushError}}
+      </div>
+    </div>
+
     <div class="row g-5 p-2">
         <div class="col-md-7 col-lg-10">
           <h4 class="mb-3">Flush a list of transaction IDs</h4>
           <form class="needs-validation" novalidate="">
             <div class="row g-3">
 
               <div class="col-12">
-                  <label for="tx_ids" class="form-label">Tx Ids</label>
-                  <textarea type="text" class="form-control" id="tx_ids" placeholder="[
+                  <label for="flush-tx-ids" class="form-label">Tx Ids</label>
+                  <textarea type="text" class="form-control" id="flush-tx-ids" placeholder="[
   'tx_hash_1',
   'tx_hash_2',
   ... ,
   'tx_hash_n'
 ]" 
-                    rows="15" cols="15"></textarea>
+                    rows="15" cols="15" [(ngModel)]="flushTxIdsJsonString" [ngModelOptions]="{ standalone: true }"></textarea>
                   <small class="text-body-secondary">List of transaction IDs to flush in tx pool</small>
               </div>
 
@@ -297,35 +311,54 @@ <h4 class="mb-3">Flush a list of transaction IDs</h4>
           </form>
         </div>
     </div>
-    <button class="w-100 btn btn-primary btn-lg" type="button" [disabled]="!canRelay" (click)="onFlush()">Flush Tx Pool</button>
+
+    <button *ngIf="!flushing" class="w-100 btn btn-primary btn-lg" type="button" (click)="flush()">Flush Tx Pool</button>
   </div>
 
   <div class="tab-pane fade" id="pills-flush-cache" role="tabpanel" aria-labelledby="pills-flush-cache-tab" tabindex="0">
+    <div *ngIf="flushCacheSuccess" class="alert alert-success d-flex align-items-center justify-content-center text-center" role="alert">
+      <h4><i class="bi bi-send-check m-2"></i></h4>&nbsp;&nbsp;
+      <div>
+        Successfully flushed cache
+      </div>
+    </div>
+
+    <div *ngIf="flushCacheError !== ''" class="alert alert-danger d-flex align-items-center justify-content-center text-center" role="alert">
+      <h4><i class="bi bi-exclamation-triangle m-2"></i></h4>&nbsp;&nbsp;
+      <div>
+        {{flushCacheError}}
+      </div>
+    </div>
+
     <div class="row g-5 p-2">
         <div class="col-md-7 col-lg-10">
-          <h4 class="mb-3">Flush a list of bad transaction IDs from cache</h4>
+          <h4 class="mb-3">Flush bad transactions / blocks from the cache</h4>
           <form class="needs-validation" novalidate="">
-            <div class="row g-3">
+            <div class="row gy-3">
+
+
+            <div class="form-check form-switch col-md-6">
+              <label for="flush-cache-bad-txs" class="form-check-label">Bad txs</label>
+              <input class="form-control form-check-input" type="checkbox" role="switch" id="flush-cache-bad-txs" [checked]="flushCacheBadTxs" [(ngModel)]="flushCacheBadTxs" [ngModelOptions]="{standalone: true}">
+              <br>
+              <small class="text-body-secondary">Flush bad transactions</small>
+            </div>
+
 
-              <div class="col-12">
-                  <label for="tx_ids" class="form-label">Tx Ids</label>
-                  <textarea type="text" class="form-control" id="tx_ids" placeholder="[
-  'tx_hash_1',
-  'tx_hash_2',
-  ... ,
-  'tx_hash_n'
-]" 
-                    rows="15" cols="15"></textarea>
-                  <small class="text-body-secondary">List of bad transaction IDs to flush from cache</small>
-              </div>
-
+            <div class="form-check form-switch col-md-6">
+              <label for="flush-cache-bad-blocks" class="form-check-label">Bad blocks</label>
+              <input class="form-control form-check-input" type="checkbox" role="switch" id="flush-cache-bad-blocks" [checked]="flushCacheBadBlocks" [(ngModel)]="flushCacheBadBlocks" [ngModelOptions]="{standalone: true}">
+              <br>
+              <small class="text-body-secondary">Flush bad blocks</small>
+            </div>
+
             <hr class="my-4">
             </div>
 
           </form>
         </div>
     </div>
-    <button class="w-100 btn btn-primary btn-lg" type="button" [disabled]="!canRelay" (click)="onFlushFromCache()">Flush Bad Txs</button>
+    <button *ngIf="!flushingCache" class="w-100 btn btn-primary btn-lg" type="button" [disabled]="!canRelay" (click)="flushCache()">Flush Cache</button>
   </div>
 
 

diff --git a/src/app/pages/transactions/transactions.component.ts b/src/app/pages/transactions/transactions.component.ts
@@ -165,12 +165,80 @@ export class TransactionsComponent extends BasePageComponent implements AfterVie
     await this.daemonService.relayTx(...txIds);
   }
 
-  public async onFlush(): Promise<void> {
+  public flushing: boolean = false;
+  public flushSuccess: boolean = true;
+  public flushError: string = '';
+  public flushTxIdsJsonString: string = '';
 
+  public get validFlushTxIds(): boolean {
+    try {
+      const txIds: any[] = JSON.parse(this.flushTxIdsJsonString);
+
+      if (!Array.isArray(txIds) || txIds.length == 0) {
+        return false;
+      }
+
+      let valid: boolean = true;
+
+      txIds.forEach((txId: string) => {
+        if (typeof txId != 'string' || txId == '') {
+          valid = false;
+        }
+      });
+
+      return valid;
+    }
+    catch {
+      return false;
+    }
   }
 
-  public async onFlushFromCache(): Promise<void> {
+  private get flushTxIds(): string[] {
+    if (!this.validFlushTxIds) {
+      return [];
+    }
+
+    const txIds: string[] = JSON.parse(this.flushTxIdsJsonString);
+
+    return txIds;
+  }
+
+  public async flush(): Promise<void> {
+    this.flushing = true;
+
+    try {
+      await this.daemonService.flushTxPool(...this.flushTxIds);
+      this.flushError = '';
+      this.flushSuccess = true;
+    }
+    catch(error) {
+      this.flushSuccess = false;
+      this.flushError = `${error}`;
+    }
+
+    this.flushing = false;
+  }
+
+  public flushingCache: boolean = false;
+  public flushCacheBadTxs: boolean = false;
+  public flushCacheBadBlocks: boolean = false;
+  public flushCacheSuccess: boolean = false;
+  public flushCacheError: string = '';
+
+  public async flushCache(): Promise<void> {
+    this.flushingCache = true;
+
+    try {
+      await this.daemonService.flushCache(this.flushCacheBadTxs, this.flushCacheBadBlocks);
+      this.flushCacheError = '';
+      this.flushCacheSuccess = true;
+    }
+    catch(error) {
+      this.flushCacheSuccess = false;
+      this.flushCacheError = `${error}`;
+    }
 
+    this.flushingCache = false;
   }