diff --git a/index.html b/index.html
index aeab64c..6c8cc14 100644
--- a/index.html
+++ b/index.html
@@ -1083,7 +1083,9 @@
                 </div>
                 <div class="flex justify-right gap-0-3">
                     <button class="button" onclick="showChildElement('confirm_topup_wrapper', 1)">Decline</button>
-                    <button class="button" onclick="confirmTopUp()">Confirm</button>
+                    <div class="multi-state-button">
+                        <button class="button" onclick="confirmTopUp(this)">Confirm</button>
+                    </div>
                 </div>
             </div>
             <div class="flex flex-direction-column gap-1-5 hide" style="height: 24rem;">
diff --git a/scripts/fn_ui.js b/scripts/fn_ui.js
index 5512f7f..18ef5e4 100644
--- a/scripts/fn_ui.js
+++ b/scripts/fn_ui.js
@@ -368,8 +368,9 @@ function completeCashToTokenRequest(request) {
     })
 }
 
-function confirmTopUp() {
+function confirmTopUp(button) {
     const { message: { amount }, vectorClock, senderID } = floGlobals.cashierProcessingRequest;
+    buttonLoader(button, true);
     User.sendToken(senderID, amount, 'for cash-to-token').then(txid => {
         console.warn(`${amount} cash-to-token for ${senderID}`, txid);
         Cashier.finishRequest(floGlobals.cashierProcessingRequest, txid).then(result => {
@@ -378,6 +379,7 @@ function confirmTopUp() {
             notify("Completed request", 'success');
             hidePopup()
         }).catch(error => console.error(error))
+            .finally(() => buttonLoader(button, false))
     }).catch(error => console.error(error))
 }