From 3bbdf6fb250d66d1d8a309af6c5410371752bfcb Mon Sep 17 00:00:00 2001
From: nymkappa <1612910616@pm.me>
Date: Fri, 17 May 2024 20:45:39 +0200
Subject: [PATCH] [faucet] improve feedback upon success

---
 frontend/src/app/components/faucet/faucet.component.html | 9 ++++++++-
 frontend/src/app/components/faucet/faucet.component.ts   | 2 ++
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/frontend/src/app/components/faucet/faucet.component.html b/frontend/src/app/components/faucet/faucet.component.html
index 349c51826..877bbda6b 100644
--- a/frontend/src/app/components/faucet/faucet.component.html
+++ b/frontend/src/app/components/faucet/faucet.component.html
@@ -6,7 +6,14 @@
 
   <div class="faucet-container text-center">
   
-    @if (loading) {
+    @if (txid) {
+      <div class="alert alert-success w-100 text-truncate">
+        <fa-icon [icon]="['fas', 'circle-check']"></fa-icon>
+        Sent!
+        <a class="text-primary" [href]="'/testnet4/txid/' + txid">{{ txid }}</a>
+      </div>
+    }
+    @else if (loading) {
       <p>Loading faucet...</p>
       <div class="spinner-border text-light"></div>
     } @else if (!user) {
diff --git a/frontend/src/app/components/faucet/faucet.component.ts b/frontend/src/app/components/faucet/faucet.component.ts
index afe9e9241..af4bb34b4 100644
--- a/frontend/src/app/components/faucet/faucet.component.ts
+++ b/frontend/src/app/components/faucet/faucet.component.ts
@@ -103,6 +103,7 @@ export class FaucetComponent implements OnInit, OnDestroy {
 
   requestCoins(): void {
     this.error = null;
+    this.txid = '';
     this.stateService.markBlock$.next({});
     this.servicesApiService.requestTestnet4Coins$(this.faucetForm.get('address')?.value, parseInt(this.faucetForm.get('satoshis')?.value))
     .subscribe({
@@ -110,6 +111,7 @@ export class FaucetComponent implements OnInit, OnDestroy {
         this.txid = response.txid;
         this.websocketService.startTrackTransaction(this.txid);
         this.audioService.playSound('cha-ching');
+        this.cd.markForCheck();
       }),
       error: (response: HttpErrorResponse) => {
         this.error = response.error;