UI: Improve access token pairing (#4237)

Closes #4133.

BTCPayServer/Controllers/UIStoresController.cs

@@ -109,6 +109,10 @@ namespace BTCPayServer.Controllers
         private readonly EventAggregator _EventAggregator;
         private readonly IOptions<ExternalServicesOptions> _externalServiceOptions;
 
+        public string? GeneratedPairingCode { get; set; }
+        public WebhookSender WebhookNotificationManager { get; }
+        public IDataProtector DataProtector { get; }
+
         [TempData]
         public bool StoreNotConfigured
         {
@@ -736,8 +740,7 @@ namespace BTCPayServer.Controllers
             return new DerivationSchemeSettings(strategy, network);
         }
 
-        [HttpGet]
+        [HttpGet("{storeId}/tokens")]
-        [Route("{storeId}/Tokens")]
         public async Task<IActionResult> ListTokens()
         {
             var model = new TokensViewModel();
@@ -780,8 +783,7 @@ namespace BTCPayServer.Controllers
             return RedirectToAction(nameof(ListTokens), new { storeId = token?.StoreId });
         }
 
-        [HttpGet]
+        [HttpGet("{storeId}/tokens/{tokenId}")]
-        [Route("{storeId}/tokens/{tokenId}")]
         public async Task<IActionResult> ShowToken(string tokenId)
         {
             var token = await _TokenRepository.GetToken(tokenId);
@@ -790,8 +792,18 @@ namespace BTCPayServer.Controllers
             return View(token);
         }
 
-        [HttpPost]
+        [HttpGet("{storeId}/tokens/create")]
-        [Route("{storeId}/Tokens/Create")]
+        public IActionResult CreateToken(string storeId)
+        {
+            var model = new CreateTokenViewModel();
+            ViewBag.HidePublicKey = storeId == null;
+            ViewBag.ShowStores = storeId == null;
+            ViewBag.ShowMenu = storeId != null;
+            model.StoreId = storeId;
+            return View(model);
+        }
+
+        [HttpPost("{storeId}/tokens/create")]
         public async Task<IActionResult> CreateToken(string storeId, CreateTokenViewModel model)
         {
             if (!ModelState.IsValid)
@@ -832,29 +844,12 @@ namespace BTCPayServer.Controllers
             GeneratedPairingCode = pairingCode;
             return RedirectToAction(nameof(RequestPairing), new
             {
-                pairingCode = pairingCode,
+                pairingCode,
                 selectedStore = storeId
             });
         }
 
-        public string? GeneratedPairingCode { get; set; }
+        [HttpGet("/api-tokens")]
-        public WebhookSender WebhookNotificationManager { get; }
-        public IDataProtector DataProtector { get; }
-
-        [HttpGet]
-        [Route("{storeId}/Tokens/Create")]
-        public IActionResult CreateToken(string storeId)
-        {
-            var model = new CreateTokenViewModel();
-            ViewBag.HidePublicKey = storeId == null;
-            ViewBag.ShowStores = storeId == null;
-            ViewBag.ShowMenu = storeId != null;
-            model.StoreId = storeId;
-            return View(model);
-        }
-
-        [HttpGet]
-        [Route("/api-tokens")]
         [AllowAnonymous]
         public async Task<IActionResult> CreateToken()
         {
@@ -875,16 +870,14 @@ namespace BTCPayServer.Controllers
             return View(model);
         }
 
-        [HttpPost]
+        [HttpPost("/api-tokens")]
-        [Route("/api-tokens")]
         [AllowAnonymous]
         public Task<IActionResult> CreateToken2(CreateTokenViewModel model)
         {
             return CreateToken(model.StoreId, model);
         }
 
-        [HttpPost]
+        [HttpPost("{storeId}/tokens/apikey")]
-        [Route("{storeId}/tokens/apikey")]
         public async Task<IActionResult> GenerateAPIKey(string storeId, string command = "")
         {
             var store = HttpContext.GetStoreData();
@@ -907,32 +900,32 @@ namespace BTCPayServer.Controllers
             });
         }
 
-        [HttpGet]
+        [HttpGet("/api-access-request")]
-        [Route("/api-access-request")]
         [AllowAnonymous]
         public async Task<IActionResult> RequestPairing(string pairingCode, string? selectedStore = null)
         {
             var userId = GetUserId();
             if (userId == null)
                 return Challenge(AuthenticationSchemes.Cookie);
+            
             if (pairingCode == null)
                 return NotFound();
+            
             if (selectedStore != null)
             {
                 var store = await _Repo.FindStore(selectedStore, userId);
                 if (store == null)
                     return NotFound();
                 HttpContext.SetStoreData(store);
-                ViewBag.ShowStores = false;
             }
+            
             var pairing = await _TokenRepository.GetPairingAsync(pairingCode);
             if (pairing == null)
             {
                 TempData[WellKnownTempData.ErrorMessage] = "Unknown pairing code";
                 return RedirectToAction(nameof(UIHomeController.Index), "UIHome");
             }
-            else
+            
-            {
             var stores = await _Repo.GetStoresByUserId(userId);
             return View(new PairingModel
             {
@@ -940,17 +933,15 @@ namespace BTCPayServer.Controllers
                 Label = pairing.Label,
                 SIN = pairing.SIN ?? "Server-Initiated Pairing",
                 StoreId = selectedStore ?? stores.FirstOrDefault()?.Id,
-                    Stores = stores.Where(u => u.Role == StoreRoles.Owner).Select(s => new PairingModel.StoreViewModel()
+                Stores = stores.Where(u => u.Role == StoreRoles.Owner).Select(s => new PairingModel.StoreViewModel
                 {
                     Id = s.Id,
                     Name = string.IsNullOrEmpty(s.StoreName) ? s.Id : s.StoreName
                 }).ToArray()
             });
         }
-        }
 
-        [HttpPost]
+        [HttpPost("/api-access-request")]
-        [Route("/api-access-request")]
         public async Task<IActionResult> Pair(string pairingCode, string storeId)
         {
             if (pairingCode == null)

BTCPayServer/Views/UIStores/RequestPairing.cshtml

@@ -1,12 +1,22 @@
 @model PairingModel
 @{
-    Layout = "../Shared/_NavLayout.cshtml";
+    var store = Context.GetStoreData();
-    ViewData.SetActivePage(StoreNavPages.Tokens, "Pairing Permission", Context.GetStoreData()?.Id);
+    Layout = store is null ? "_LayoutWizard" : "_NavLayout";
+    ViewData.SetActivePage(StoreNavPages.Tokens, "Pairing Permission", store?.Id);
+}
+
+@if (store is null)
+{
+    @section Navbar {
+        <button type="button" class="cancel" onclick="history.back()">
+            <vc:icon symbol="close" />
+        </button>
+    }
 }
 
-<h3 class="mb-0">@ViewData["Title"]</h3>
 <div class="row">
-    <div class="col-md-4">
+    <div class="col-sm-8 col-md-6 @(store is null ? "mx-auto" : "")">
+        <h3 class="mb-0">@ViewData["Title"]</h3>
         <table class="table table-hover">
             <tr>
                 <th>Label</th>
@@ -17,17 +27,21 @@
                 <td class="text-end">@Model.SIN</td>
             </tr>
         </table>
-    </div>
+        
-</div>
-<div class="row">
-    <div class="col-md-4">
         <form asp-action="Pair" method="post">
+            @if (store is null)
+            {
                 <div class="form-group">
                     <label asp-for="StoreId" class="form-label">Pair To Store</label>
-                <select asp-for="StoreId" asp-items="@(new SelectList(Model.Stores,"Id","Name"))" class="form-select"></select>
+                    <select asp-for="StoreId" asp-items="@(new SelectList(Model.Stores, "Id", "Name"))" class="form-select"></select>
                     <span asp-validation-for="StoreId" class="text-danger"></span>
                 </div>
-            <input type="hidden" name="pairingCode" value="@Model.Id" />
+            }
+            else
+            {
+                <input asp-for="StoreId" type="hidden" />
+            }
+            <input type="hidden" name="pairingCode" value="@Model.Id"/>
             <button id="ApprovePairing" type="submit" class="btn btn-primary mt-3" title="Approve this pairing demand">Approve</button>
         </form>
     </div>