From 95d746504d7b371fc00611c9d6438ef0365ee905 Mon Sep 17 00:00:00 2001
From: rockstardev <rockstardev@users.noreply.github.com>
Date: Fri, 3 May 2019 14:54:40 -0500
Subject: [PATCH] Changing invoice state and updating display from js

---
 .../Controllers/InvoiceController.UI.cs       | 53 ++++++-----------
 .../Views/Invoice/ListInvoices.cshtml         | 58 +++++++++++++------
 2 files changed, 59 insertions(+), 52 deletions(-)

diff --git a/BTCPayServer/Controllers/InvoiceController.UI.cs b/BTCPayServer/Controllers/InvoiceController.UI.cs
index 3ad35738f..260355592 100644
--- a/BTCPayServer/Controllers/InvoiceController.UI.cs
+++ b/BTCPayServer/Controllers/InvoiceController.UI.cs
@@ -673,61 +673,46 @@ namespace BTCPayServer.Controllers
             }
         }
 
-        [HttpGet]
-        [Route("invoices/{invoiceId}/changestate/{newState}")]
-        [Authorize(AuthenticationSchemes = Policies.CookieAuthentication)]
-        [BitpayAPIConstraint(false)]
-        public IActionResult ChangeInvoiceState(string invoiceId, string newState)
-        {
-            if (newState == "invalid")
-            {
-                return View("Confirm", new ConfirmModel()
-                {
-                    Action = "Make invoice invalid",
-                    Title = "Change invoice state",
-                    Description = $"You will transition the state of this invoice to \"invalid\", do you want to continue?",
-                });
-            }
-            else if (newState == "complete")
-            {
-                return View("Confirm", new ConfirmModel()
-                {
-                    Action = "Make invoice complete",
-                    Title = "Change invoice state",
-                    Description = $"You will transition the state of this invoice to \"complete\", do you want to continue?",
-                    ButtonClass = "btn-primary"
-                });
-            }
-            else
-                return NotFound();
-        }
-
         [HttpPost]
         [Route("invoices/{invoiceId}/changestate/{newState}")]
         [Authorize(AuthenticationSchemes = Policies.CookieAuthentication)]
         [BitpayAPIConstraint(false)]
-        public async Task<IActionResult> ChangeInvoiceStateConfirm(string invoiceId, string newState)
+        public async Task<IActionResult> ChangeInvoiceState(string invoiceId, string newState)
         {
             var invoice = (await _InvoiceRepository.GetInvoices(new InvoiceQuery()
             {
                 InvoiceId = invoiceId,
                 UserId = GetUserId()
             })).FirstOrDefault();
+
+            var model = new InvoiceStateChangeModel();
             if (invoice == null)
-                return NotFound();
+            {
+                model.NotFound = true;
+                return NotFound(model);
+            }
+
+
             if (newState == "invalid")
             {
                 await _InvoiceRepository.UpdatePaidInvoiceToInvalid(invoiceId);
                 _EventAggregator.Publish(new InvoiceEvent(invoice, 1008, InvoiceEvent.MarkedInvalid));
-                StatusMessage = "Invoice marked invalid";
+                model.StatusString = new InvoiceState("invalid", "marked").ToString();
             }
             else if (newState == "complete")
             {
                 await _InvoiceRepository.UpdatePaidInvoiceToComplete(invoiceId);
                 _EventAggregator.Publish(new InvoiceEvent(invoice, 2008, InvoiceEvent.MarkedCompleted));
-                StatusMessage = "Invoice marked complete";
+                model.StatusString = new InvoiceState("complete", "marked").ToString();
             }
-            return RedirectToAction(nameof(ListInvoices));
+
+            return Json(model);
+        }
+
+        public class InvoiceStateChangeModel
+        {
+            public bool NotFound { get; set; }
+            public string StatusString { get; set; }
         }
 
         [TempData]
diff --git a/BTCPayServer/Views/Invoice/ListInvoices.cshtml b/BTCPayServer/Views/Invoice/ListInvoices.cshtml
index 27ba44da9..057065f74 100644
--- a/BTCPayServer/Views/Invoice/ListInvoices.cshtml
+++ b/BTCPayServer/Views/Invoice/ListInvoices.cshtml
@@ -91,7 +91,7 @@
                         </th>
                         <th style="max-width: 180px;">OrderId</th>
                         <th>InvoiceId</th>
-                        <th>Status</th>
+                        <th style="min-width: 140px;">Status</th>
                         <th style="text-align:right">Amount</th>
                         <th style="text-align:right">Actions</th>
                     </tr>
@@ -119,23 +119,25 @@
                             <td>
                                 @if (invoice.CanMarkStatus)
                                 {
-                                    <span class="dropdown-toggle dropdown-toggle-split pavpill pavpil-@invoice.Status.ToString().ToLower()"
-                                          data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                                        @invoice.StatusString
-                                    </span>
-                                    <div class="dropdown-menu pull-right">
-                                        @if (invoice.CanMarkInvalid)
-                                        {
-                                            <form method="get" asp-action="ChangeInvoiceState" asp-route-invoiceId="@invoice.InvoiceId" asp-route-newState="invalid">
-                                                <button class="dropdown-item small">Mark as invalid <span class="fa fa-times"></span></button>
-                                            </form>
-                                        }
-                                        @if (invoice.CanMarkComplete)
-                                        {
-                                            <form method="get" asp-action="ChangeInvoiceState" asp-route-invoiceId="@invoice.InvoiceId" asp-route-newState="complete">
-                                                <button class="dropdown-item small">Mark as complete <span class="fa fa-check-circle"></span></button>
-                                            </form>
-                                        }
+                                    <div id="pavpill_@invoice.InvoiceId">
+                                        <span class="dropdown-toggle dropdown-toggle-split pavpill pavpil-@invoice.Status.ToString().ToLower()"
+                                              data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                                            @invoice.StatusString
+                                        </span>
+                                        <div class="dropdown-menu pull-right">
+                                            @if (invoice.CanMarkInvalid)
+                                            {
+                                                <button class="dropdown-item small cursorPointer" onclick="changeInvoiceState(this, '@invoice.InvoiceId', 'invalid')">
+                                                    Mark as invalid <span class="fa fa-times"></span>
+                                                </button>
+                                            }
+                                            @if (invoice.CanMarkComplete)
+                                            {
+                                                <button class="dropdown-item small cursorPointer" onclick="changeInvoiceState(this, '@invoice.InvoiceId', 'complete')">
+                                                    Mark as complete <span class="fa fa-check-circle"></span>
+                                                </button>
+                                            }
+                                        </div>
                                     </div>
                                 }
                                 else
@@ -251,6 +253,22 @@
             });
             return false;
         }
+
+        function changeInvoiceState(sender, invoiceId, newState) {
+            var pavpill = $("#pavpill_" + invoiceId);
+            var originalHtml = pavpill.html();
+            pavpill.html("<span class='fa fa-bitcoin fa-spin' style='margin-left:16px;'></span>");
+
+            $.post("invoices/" + invoiceId + "/changestate/" + newState)
+                .done(function (data) {
+                    var statusHtml = "<span class='pavpill pavpil-" + newState + "'>" + data.statusString + "</span>";
+                    pavpill.html(statusHtml);
+                })
+                .fail(function (data) {
+                    pavpill.html(originalHtml.replace("dropdown-menu pull-right show", "dropdown-menu pull-right"));
+                    alert("Invoice state update failed");
+                });
+        }
     </script>
 
     <style type="text/css">
@@ -283,6 +301,10 @@
                 cursor: pointer;
             }
 
+        .dropdown-item {
+            cursor: pointer;
+        }
+
         .pavpil-new {
             background: #d4edda;
             color: #000;