From 069acf029742fcd6d8a5c8181e298a61f00f3f7f Mon Sep 17 00:00:00 2001
From: "nicolas.dorier" <nicolas.dorier@gmail.com>
Date: Mon, 5 Oct 2020 12:17:18 +0900
Subject: [PATCH] Add Retry button if a BTCPay Vault operation fails

---
 .../Views/Shared/VaultElements.cshtml         |  2 +-
 ...vationSchemes_HardwareWalletDialogs.cshtml |  3 +-
 .../Views/Wallets/WalletSendVault.cshtml      | 10 +++---
 .../wwwroot/js/StoreAddDerivationScheme.js    |  6 ++--
 BTCPayServer/wwwroot/js/vaultbridge.ui.js     | 33 ++++++++++++++++++-
 5 files changed, 44 insertions(+), 10 deletions(-)

diff --git a/BTCPayServer/Views/Shared/VaultElements.cshtml b/BTCPayServer/Views/Shared/VaultElements.cshtml
index 33e66ec08..78e52a664 100644
--- a/BTCPayServer/Views/Shared/VaultElements.cshtml
+++ b/BTCPayServer/Views/Shared/VaultElements.cshtml
@@ -1,4 +1,4 @@
-<script id="VaultConnection" type="text/template">
+<script id="VaultConnection" type="text/template">
     <div class="vault-feedback vault-feedback1">
         <span class="vault-feedback-icon"></span> <span class="vault-feedback-content"></span>
     </div>
diff --git a/BTCPayServer/Views/Stores/AddDerivationSchemes_HardwareWalletDialogs.cshtml b/BTCPayServer/Views/Stores/AddDerivationSchemes_HardwareWalletDialogs.cshtml
index 4b90954c7..231df990a 100644
--- a/BTCPayServer/Views/Stores/AddDerivationSchemes_HardwareWalletDialogs.cshtml
+++ b/BTCPayServer/Views/Stores/AddDerivationSchemes_HardwareWalletDialogs.cshtml
@@ -95,8 +95,9 @@
                 </div>
             </div>
             <div class="modal-footer">
-                <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
+                <button class="btn btn-primary vault-retry" style="display:none;" type="button">Retry</button>
                 <button id="vault-confirm" class="btn btn-primary" style="display:none;"></button>
+                <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
             </div>
         </form>
     </div>
diff --git a/BTCPayServer/Views/Wallets/WalletSendVault.cshtml b/BTCPayServer/Views/Wallets/WalletSendVault.cshtml
index 0a66ea9cc..bad3c064b 100644
--- a/BTCPayServer/Views/Wallets/WalletSendVault.cshtml
+++ b/BTCPayServer/Views/Wallets/WalletSendVault.cshtml
@@ -1,4 +1,4 @@
-@model WalletSendVaultModel
+@model WalletSendVaultModel
 @{
     Layout = "../Shared/_NavLayout.cshtml";
     ViewData["Title"] = "Manage wallet";
@@ -26,6 +26,7 @@
             <partial name="SigningContext" for="SigningContext" />
         </form>
         <div id="vaultPlaceholder"></div>
+        <button class="btn btn-primary vault-retry" style="display:none;" type="button">Retry</button>
         <button id="vault-confirm" class="btn btn-primary" style="display:none;"></button>
     </div>
 </div>
@@ -50,13 +51,14 @@
             var html = $("#VaultConnection").html();
             $("#vaultPlaceholder").html(html);
             var vaultUI = new vaultui.VaultBridgeUI(ws_uri);
-            if (await vaultUI.askForDevice() && await vaultUI.askSignPSBT({
+            
+            while (!await vaultUI.askForDevice() || !await vaultUI.askSignPSBT({
                 walletId: $("#WalletId").val(),
                 psbt: $("#SigningContext_PSBT").val()
             })) {
-                $("#SigningContext_PSBT").val(vaultUI.psbt);
-                $("#broadcastForm").submit();
             }
+            $("#SigningContext_PSBT").val(vaultUI.psbt);
+            $("#broadcastForm").submit();
         }
         $(function () {
             askSign();
diff --git a/BTCPayServer/wwwroot/js/StoreAddDerivationScheme.js b/BTCPayServer/wwwroot/js/StoreAddDerivationScheme.js
index 21e0abcb0..8173d0f44 100644
--- a/BTCPayServer/wwwroot/js/StoreAddDerivationScheme.js
+++ b/BTCPayServer/wwwroot/js/StoreAddDerivationScheme.js
@@ -1,4 +1,4 @@
-function getVaultUI() {
+function getVaultUI() {
     var websocketPath = $("#WebsocketPath").text();
     var loc = window.location, ws_uri;
     if (loc.protocol === "https:") {
@@ -51,8 +51,8 @@ $(document).ready(function () {
         $('#btcpayservervault').on('hidden.bs.modal', function () {
             vaultUI.closeBridge();
         });
-        if (await vaultUI.askForDevice() && await vaultUI.askForXPubs()) {
-            displayXPubs(vaultUI.xpub);
+        while (! await vaultUI.askForDevice() || ! await vaultUI.askForXPubs()) {
         }
+        displayXPubs(vaultUI.xpub);
     });
 });
diff --git a/BTCPayServer/wwwroot/js/vaultbridge.ui.js b/BTCPayServer/wwwroot/js/vaultbridge.ui.js
index facf8988c..987bfb99f 100644
--- a/BTCPayServer/wwwroot/js/vaultbridge.ui.js
+++ b/BTCPayServer/wwwroot/js/vaultbridge.ui.js
@@ -1,4 +1,4 @@
-/// <reference path="vaultbridge.js" />
+/// <reference path="vaultbridge.js" />
 /// file: vaultbridge.js
 
 var vaultui = (function () {
@@ -73,6 +73,15 @@ var vaultui = (function () {
         this.psbt = null;
 
         this.xpub = null;
+
+        this.retryShowing = false;
+
+        function showRetry() {
+            var button = $(".vault-retry");
+            self.retryShowing = true;
+            button.show();
+        }
+
         /**
         * @param {VaultFeedback} feedback
         */
@@ -88,6 +97,7 @@ var vaultui = (function () {
             }
             else if (feedback.type == "failed") {
                 icon.addClass("fa fa-times-circle feedback-icon-failed");
+                showRetry();
             }
             var content = $(".vault-feedback." + feedback.category + " " + ".vault-feedback-content");
             content.html(feedback.txt);
@@ -149,7 +159,28 @@ var vaultui = (function () {
             return false;
         }
 
+        this.waitRetryPushed = function () {
+            var button = $(".vault-retry");
+            return new Promise(function (resolve) {
+                button.click(function () {
+                    // Cleanup old feedback
+                    var icon = $(".vault-feedback-icon");
+                    icon.removeClass();
+                    icon.addClass("vault-feedback-icon");
+                    var content = $(".vault-feedback-content");
+                    content.html('');
+                    ///////////////////
+                    button.hide();
+                    self.retryShowing = false;
+                    resolve(true);
+                });
+            });
+        };
+
         this.ensureConnectedToBackend = async function () {
+            if (self.retryShowing) {
+                await self.waitRetryPushed();
+            }
             if (!self.bridge) {
                 $("#vault-dropdown").css("display", "none");
                 show(VaultFeedbacks.vaultLoading);