Paging on List Users page for big hosting providers like Esky (#905)

BTCPayServer/Controllers/ServerController.cs

@@ -154,17 +154,20 @@ namespace BTCPayServer.Controllers
         }
 
         [Route("server/users")]
-        public IActionResult ListUsers()
+        public IActionResult ListUsers(int skip = 0, int count = 50)
         {
             var users = new UsersViewModel();
             users.StatusMessage = StatusMessage;
-            users.Users
+            users.Users = _UserManager.Users.Skip(skip).Take(count)
-                = _UserManager.Users.Select(u => new UsersViewModel.UserViewModel()
+                .Select(u => new UsersViewModel.UserViewModel
                 {
                     Name = u.UserName,
                     Email = u.Email,
                     Id = u.Id
                 }).ToList();
+            users.Skip = skip;
+            users.Count = count;
+            users.Total = _UserManager.Users.Count();
             return View(users);
         }
 
@@ -479,7 +482,7 @@ namespace BTCPayServer.Controllers
             if (command.StartsWith("remove-domain", StringComparison.InvariantCultureIgnoreCase))
             {
                 ModelState.Clear();
-                var index = int.Parse(command.Substring(command.IndexOf(":",StringComparison.InvariantCultureIgnoreCase) + 1),  CultureInfo.InvariantCulture);
+                var index = int.Parse(command.Substring(command.IndexOf(":", StringComparison.InvariantCultureIgnoreCase) + 1), CultureInfo.InvariantCulture);
                 settings.DomainToAppMapping.RemoveAt(index);
                 return View(settings);
             }
@@ -569,7 +572,7 @@ namespace BTCPayServer.Controllers
             var storageSettings = await _SettingsRepository.GetSettingAsync<StorageSettings>();
             result.ExternalStorageServices.Add(new ServicesViewModel.OtherExternalService()
             {
-                Name = storageSettings == null? "Not set": storageSettings.Provider.ToString(),
+                Name = storageSettings == null ? "Not set" : storageSettings.Provider.ToString(),
                 Link = Url.Action("Storage")
             });
             return View(result);
@@ -577,7 +580,7 @@ namespace BTCPayServer.Controllers
 
         private async Task<List<SelectListItem>> GetAppSelectList()
         {
-// load display app dropdown
+            // load display app dropdown
             using (var ctx = _ContextFactory.CreateContext())
             {
                 var userId = _UserManager.GetUserId(base.User);

BTCPayServer/Models/ServerViewModels/UsersViewModel.cs

@@ -10,25 +10,16 @@ namespace BTCPayServer.Models.ServerViewModels
         public class UserViewModel
         {
             public string Id { get; set; }
-            public string Name
+            public string Name { get; set; }
-            {
+            public string Email { get; set; }
-                get; set;
-            }
-            public string Email
-            {
-                get; set;
-            }
         }
+        
+        public int Skip { get; set; }
+        public int Count { get; set; }
+        public int Total { get; set; }
+        public string StatusMessage { get; set; }
 
-        public string StatusMessage
+        public List<UserViewModel> Users { get; set; } = new List<UserViewModel>();
-        {
-            get; set;
-        }
-
-        public List<UserViewModel> Users
-        {
-            get; set;
-        } = new List<UserViewModel>();
     }
 
 }

BTCPayServer/Views/Server/ListUsers.cshtml

@@ -6,40 +6,84 @@
 <partial name="_StatusMessage" for="StatusMessage" />
 
 <div class="row">
-    <div class="col">
+    <div class="col align-self-center">Total Users: @Model.Total</div>
-
-    </div>
     <div class="col text-right">
-        <a 
+        <a asp-controller="Account"
-            asp-controller="Account" 
+           asp-action="Register"
-            asp-action="Register" 
+           asp-route-returnUrl="@Context.Request.GetCurrentPath()"
-            asp-route-returnUrl="@Context.Request.GetCurrentPath()" 
+           asp-route-logon="false"
-            asp-route-logon="false" 
+           class="btn btn-primary"
-            class="btn btn-primary" 
+           role="button">
-            role="button">
             <span class="fa fa-plus"></span> Add User
         </a>
     </div>
 </div>
 
-<div id="users">
+<table class="table table-sm table-responsive-md">
-    <table class="table table-sm table-responsive-md">
+    <thead>
-        <thead>
+        <tr>
+            <th>Name</th>
+            <th>Email</th>
+            <th>Actions</th>
+        </tr>
+    </thead>
+    <tbody>
+        @foreach (var user in Model.Users)
+        {
             <tr>
-                <th>Name</th>
+                <td>@user.Name</td>
-                <th>Email</th>
+                <td>@user.Email</td>
-                <th>Actions</th>
+                <td><a asp-action="User" asp-route-userId="@user.Id">Edit</a> <span> - </span> <a asp-action="DeleteUser" asp-route-userId="@user.Id">Remove</a></td>
             </tr>
-        </thead>
+        }
-        <tbody>
+    </tbody>
-            @foreach (var user in Model.Users)
+</table>
-            {
+
-                <tr>
+<nav aria-label="..." class="w-100">
-                    <td>@user.Name</td>
+    <ul class="pagination float-left">
-                    <td>@user.Email</td>
+        <li class="page-item @(Model.Skip == 0 ? "disabled" : null)">
-                    <td><a asp-action="User" asp-route-userId="@user.Id">Edit</a> <span> - </span> <a asp-action="DeleteUser" asp-route-userId="@user.Id">Remove</a></td>
+            <a class="page-link" tabindex="-1" href="@listUsers(-1, Model.Count)">&laquo;</a>
-                </tr>
+        </li>
-            }
+        <li class="page-item disabled">
-        </tbody>
+            <span class="page-link">@(Model.Skip + 1) to @(Model.Skip + Model.Users.Count) of @Model.Total</span>
-    </table>
+        </li>
-</div>
+        <li class="page-item @(Model.Total > (Model.Skip + Model.Users.Count) ? null : "disabled")">
+            <a class="page-link" href="@listUsers(1, Model.Count)">&raquo;</a>
+        </li>
+    </ul>
+    <ul class="pagination float-right">
+        <li class="page-item disabled">
+            <span class="page-link">Page Size:</span>
+        </li>
+        <li class="page-item @(Model.Count == 50 ? "active" : null)">
+            <a class="page-link" href="@listUsers(0, 50)">50</a>
+        </li>
+        <li class="page-item @(Model.Count == 100 ? "active" : null)">
+            <a class="page-link" href="@listUsers(0, 100)">100</a>
+        </li>
+        <li class="page-item @(Model.Count == 250 ? "active" : null)">
+            <a class="page-link" href="@listUsers(0, 250)">250</a>
+        </li>
+        <li class="page-item @(Model.Count == 500 ? "active" : null)">
+            <a class="page-link" href="@listUsers(0, 500)">500</a>
+        </li>
+    </ul>
+</nav>
+@{
+    string listUsers(int prevNext, int count)
+    {
+        var skip = Model.Skip;
+        if (prevNext == -1)
+            skip = Math.Max(0, Model.Skip - Model.Count);
+        else if (prevNext == 1)
+            skip = Model.Skip + count;
+
+        var act = Url.Action("ListUsers", new
+        {
+            skip = skip,
+            count = count,
+        });
+
+        return act;
+    }
+}