Notify address page of removed transactions

frontend/src/app/components/address/address.component.ts

@@ -174,6 +174,11 @@ export class AddressComponent implements OnInit, OnDestroy {
         this.addTransaction(tx);
       });
 
+    this.stateService.mempoolRemovedTransactions$
+      .subscribe(tx => {
+        this.removeTransaction(tx);
+      });
+
     this.stateService.blockTransactions$
       .subscribe((transaction) => {
         const tx = this.transactions.find((t) => t.txid === transaction.txid);
@@ -222,6 +227,30 @@ export class AddressComponent implements OnInit, OnDestroy {
     return true;
   }
 
+  removeTransaction(transaction: Transaction): boolean {
+    const index = this.transactions.findIndex(((tx) => tx.txid === transaction.txid));
+    if (index === -1) {
+      return false;
+    }
+
+    this.transactions.splice(index, 1);
+    this.transactions = this.transactions.slice();
+    this.txCount--;
+
+    transaction.vin.forEach((vin) => {
+      if (vin?.prevout?.scriptpubkey_address === this.address.address) {
+        this.sent -= vin.prevout.value;
+      }
+    });
+    transaction.vout.forEach((vout) => {
+      if (vout?.scriptpubkey_address === this.address.address) {
+        this.received -= vout.value;
+      }
+    });
+
+    return true;
+  }
+
   loadMore() {
     if (this.isLoadingTransactions || !this.totalConfirmedTxCount || this.loadedConfirmedTxCount >= this.totalConfirmedTxCount) {
       return;

frontend/src/app/services/state.service.ts

@@ -117,6 +117,7 @@ export class StateService {
   difficultyAdjustment$ = new ReplaySubject<DifficultyAdjustment>(1);
   mempoolTransactions$ = new Subject<Transaction>();
   mempoolTxPosition$ = new Subject<{ txid: string, position: MempoolPosition, cpfp: CpfpInfo | null}>();
+  mempoolRemovedTransactions$ = new Subject<Transaction>();
   blockTransactions$ = new Subject<Transaction>();
   isLoadingWebSocket$ = new ReplaySubject<boolean>(1);
   isLoadingMempool$ = new BehaviorSubject<boolean>(true);

frontend/src/app/services/websocket.service.ts

@@ -358,6 +358,12 @@ export class WebsocketService {
       });
     }
 
+    if (response['address-removed-transactions']) {
+      response['address-removed-transactions'].forEach((addressTransaction: Transaction) => {
+        this.stateService.mempoolRemovedTransactions$.next(addressTransaction);
+      });
+    }
+
     if (response['block-transactions']) {
       response['block-transactions'].forEach((addressTransaction: Transaction) => {
         this.stateService.blockTransactions$.next(addressTransaction);