POC: Add list mode V4V

Proof of concept and WIP: Introduce the concept of "view modes" for the invoices list, which can be toggled — similar to what an OS offers in the Finder/Explorer.
btcpayserver · Jan 6, 2023 · f54e93b · f54e93b
1 parent 7c7aa43
commit f54e93b
Show file tree

Hide file tree

Showing 3 changed files with 48 additions and 13 deletions.
diff --git a/BTCPayServer/Controllers/UIInvoiceController.UI.cs b/BTCPayServer/Controllers/UIInvoiceController.UI.cs
@@ -951,11 +951,13 @@ public async Task<IActionResult> ListInvoices(InvoicesModel? model = null)
                 foreach (var i in l)
                     storeIds.Add(i);
             }
+
             if (storeId is not null)
             {
                 storeIds.Add(storeId);
                 model.StoreId = storeId;
             }
+
             model.StoreIds = storeIds.ToArray();
 
             InvoiceQuery invoiceQuery = GetInvoiceQuery(model.SearchTerm, model.TimezoneOffset ?? 0);
@@ -985,6 +987,13 @@ public async Task<IActionResult> ListInvoices(InvoicesModel? model = null)
                     HasRefund = invoice.Refunds.Any(data => !data.PullPaymentData.Archived)
                 });
             }
+
+            if (model.Mode != "list")
+            {
+                model.PaginationQuery ??= new Dictionary<string, object>();
+                model.PaginationQuery.Add("mode", model.Mode);
+            }
+
             return View(model);
         }
 

diff --git a/BTCPayServer/Models/InvoicingModels/InvoicesModel.cs b/BTCPayServer/Models/InvoicingModels/InvoicesModel.cs
@@ -11,6 +11,7 @@ public class InvoicesModel : BasePagingViewModel
         public override int CurrentPageCount => Invoices.Count;
         public string[] StoreIds { get; set; }
         public string StoreId { get; set; }
+        public string Mode { get; set; } = "list";
         public bool IncludeArchived { get; set; }
     }
 

diff --git a/BTCPayServer/Views/UIInvoice/ListInvoices.cshtml b/BTCPayServer/Views/UIInvoice/ListInvoices.cshtml
@@ -1,5 +1,6 @@
 @using BTCPayServer.Client
 @using BTCPayServer.Client.Models
+@using BTCPayServer.Payments
 @model InvoicesModel
 @{
     ViewData.SetActivePage(InvoiceNavPages.Index, "Invoices");
@@ -181,7 +182,7 @@
         </ul>
     </div>
 </div>
-<form class="@(Model.Invoices.Count > 0 ? "col-xl-7 col-xxl-8 " : "")mb-4" asp-action="ListInvoices" asp-route-storeId="@Model.StoreId" method="get">
+<form class="@(Model.Invoices.Count > 0 ? "col-xl-5 col-xxl-6 " : "")mb-4" asp-action="ListInvoices" asp-route-storeId="@Model.StoreId" method="get">
     <input type="hidden" asp-for="Count" />
     <input asp-for="TimezoneOffset" type="hidden" />
     <div class="input-group">
@@ -219,7 +220,7 @@
 @if (Model.Invoices.Count > 0)
 {
     <form method="post" id="MassAction" asp-action="MassAction" class="">
-        <div class="d-inline-flex align-items-center pb-2 float-xl-end mb-2 gap-3">
+        <div class="d-flex d-xl-inline-flex align-items-center pb-2 float-xl-end mb-2 gap-3">
             <input type="hidden" name="storeId" value="@Model.StoreId" />
             <div class="dropdown order-xl-1">
                 <button class="btn btn-secondary dropdown-toggle" type="button" id="ActionsDropdownToggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
@@ -246,6 +247,10 @@
                     <span class="fa fa-question-circle-o text-secondary" title="More information..."></span>
                 </a>
             </div>
+            <div class="btn-group order-5 ms-auto" role="group" aria-label="View mode">
+                <a asp-route-mode="list" class="btn btn-secondary px-3 @(Model.Mode == "list" ? "active" : "")">List</a>
+                <a asp-route-mode="v4v" class="btn btn-secondary px-3 @(Model.Mode == "v4v" ? "active" : "")">V4V</a>
+            </div>
         </div>
         <div style="clear:both"></div>
         <div class="table-responsive">
@@ -262,7 +267,15 @@
                             </div>
                         </th>
                         <th class="text-nowrap" style="width:13rem">Invoice Id</th>
-                        <th class="text-nowrap">Order Id</th>
+                        @if (Model.Mode == "v4v")
+                        {
+                            <th class="text-nowrap">Address</th>
+                            <th class="text-nowrap">Comment</th>
+                        }
+                        else
+                        {
+                            <th class="text-nowrap">Order Id</th>
+                        }
                         <th class="w-100px">Status</th>
                         <th class="text-end">Amount</th>
                         <th></th>
@@ -280,16 +293,28 @@
                             <td class="text-break">
                                 <a asp-action="Invoice" class="invoice-details-link" asp-route-invoiceId="@invoice.InvoiceId">@invoice.InvoiceId</a>
                             </td>
-                            <td style="max-width:120px;">
-                                @if (invoice.RedirectUrl != string.Empty)
-                                {
-                                    <a href="@invoice.RedirectUrl" class="wraptextAuto" rel="noreferrer noopener">@invoice.OrderId</a>
-                                }
-                                else
-                                {
-                                    <span class="wraptextAuto">@invoice.OrderId</span>
-                                }
-                            </td>
+                            @if (Model.Mode == "v4v")
+                            {
+                                var lnurlId = PaymentMethodId.Parse("BTC_LNURLPAY");
+                                var payment = invoice.Details.CryptoPayments.FirstOrDefault(p => p.PaymentMethodId == lnurlId);
+                                var details = (LNURLPayPaymentMethodDetails)payment?.PaymentMethodRaw.GetPaymentMethodDetails();
+
+                                <td>@(details != null ? details.ConsumedLightningAddress : "")</td>
+                                <td>@(details != null ? details.ProvidedComment : "")</td>
+                            }
+                            else
+                            {
+                                <td style="max-width:120px;">
+                                    @if (invoice.RedirectUrl != string.Empty)
+                                    {
+                                        <a href="@invoice.RedirectUrl" class="wraptextAuto" rel="noreferrer noopener">@invoice.OrderId</a>
+                                    }
+                                    else
+                                    {
+                                        <span class="wraptextAuto">@invoice.OrderId</span>
+                                    }
+                                </td>
+                            }
                             <td>
                                 @if (invoice.Details.Archived)
                                 {