Implement Paging.

Author: biswajitpanday

HyperCache.Web/Dtos/CustomPropertyDto.cs

@@ -0,0 +1,14 @@
+namespace HyperCache.Web.Dtos;
+
+public class CustomPropertyDto
+{
+    public Guid Id { get; set; }
+    public Guid ParentId { get; set; }
+    public required string Name { get; set; }
+    public required string Value { get; set; }
+    public DateTime CreatedOn { get; set; }
+    public DateTime ModifiedOn { get; set; }
+    public required string CreatedBy { get; set; }
+    public required string ModifiedBy { get; set; }
+    public required string ParentTable { get; set; }
+}

HyperCache.Web/Dtos/PagedResponseDto.cs

@@ -0,0 +1,10 @@
+namespace HyperCache.Web.Dtos;
+
+public class PagedResponseDto<T>
+{
+    public List<T> Items { get; set; } = [];
+    public int CurrentPage { get; set; }
+    public int TotalPages { get; set; }
+    public bool HasPreviousPage => CurrentPage > 1;
+    public bool HasNextPage => CurrentPage < TotalPages;
+}

HyperCache.Web/Pages/CustomProperties.razor

@@ -1,17 +1,15 @@
 @page "/custom-properties"
-@inject HttpClient Http
-@using HyperCache.Shared.Dtos
 
 <h3 class="mt-4 text-primary">Custom Properties</h3>
 
-@if (properties == null)
+@if (pagedResponse == null)
 {
     <div class="text-center mt-4">
         <div class="spinner-border text-primary" role="status"></div>
         <p>Loading...</p>
     </div>
 }
-else if (!properties.Any())
+else if (!pagedResponse.Items.Any())
 {
     <div class="alert alert-info mt-4" role="alert">
         No properties found.
@@ -28,7 +26,7 @@ else
         </tr>
         </thead>
         <tbody>
-        @foreach (var property in properties)
+        @foreach (var property in pagedResponse.Items)
         {
             <tr>
                 <td>@property.Name</td>
@@ -40,13 +38,74 @@ else
         }
         </tbody>
     </table>
+
+    <nav class="mt-4">
+        <ul class="pagination">
+            <li class="page-item @(pagedResponse.HasPreviousPage ? "" : "disabled")">
+                <button class="page-link" @onclick="PreviousPage">Previous</button>
+            </li>
+            @foreach (var pageNumber in GetPageNumbers())
+            {
+                <li class="page-item @(currentPage == pageNumber ? "active" : "")">
+                    <button class="page-link" @onclick="() => ChangePage(pageNumber)">@pageNumber</button>
+                </li>
+            }
+            <li class="page-item @(pagedResponse.HasNextPage ? "" : "disabled")">
+                <button class="page-link" @onclick="NextPage">Next</button>
+            </li>
+        </ul>
+    </nav>
 }
 
 @code {
-    private List<CustomPropertyDto>? properties;
+    private PagedResponseDto<CustomPropertyDto>? pagedResponse;
+    private int currentPage = 1;
+    private int pageSize = 20;
 
     protected override async Task OnInitializedAsync()
     {
-        properties = await Http.GetFromJsonAsync<List<CustomPropertyDto>>("CustomProperties/paged?page=1&pageSize=20");
+        await LoadProperties();
+    }
+
+    private async Task LoadProperties()
+    {
+        pagedResponse = await Http.GetFromJsonAsync<PagedResponseDto<CustomPropertyDto>>(
+            $"{ApiConstant.CustomPropertiesPaged}?page={currentPage}&pageSize={pageSize}");
+    }
+
+    private async Task ChangePage(int page)
+    {
+        currentPage = page;
+        await LoadProperties();
+    }
+
+    private async Task PreviousPage()
+    {
+        if (pagedResponse?.HasPreviousPage == true)
+        {
+            currentPage--;
+            await LoadProperties();
+        }
+    }
+
+    private async Task NextPage()
+    {
+        if (pagedResponse?.HasNextPage == true)
+        {
+            currentPage++;
+            await LoadProperties();
+        }
+    }
+
+    private IEnumerable<int> GetPageNumbers()
+    {
+        const int maxVisiblePages = 5;
+        int startPage = Math.Max(1, currentPage - maxVisiblePages / 2);
+        int endPage = Math.Min(startPage + maxVisiblePages - 1, pagedResponse?.TotalPages ?? 1);
+
+        for (int i = startPage; i <= endPage; i++)
+        {
+            yield return i;
+        }
     }
-}
+}

HyperCache/Controllers/CustomPropertiesController.cs

@@ -1,4 +1,5 @@
 using HyperCache.Api.Data;
+using HyperCache.Api.Models;
 using Microsoft.AspNetCore.Mvc;
 using Microsoft.EntityFrameworkCore;
 
@@ -12,11 +13,37 @@ public class CustomPropertiesController(AppDbContext context) : ControllerBase
     [HttpGet("paged")]
     public async Task<IActionResult> GetPagedProperties([FromQuery] int page = 1, [FromQuery] int pageSize = 20)
     {
+        if (page < 1 || pageSize < 1)
+        {
+            return BadRequest("Page and PageSize must be greater than 0.");
+        }
+
+        var totalCount = await context.CustomProperties.CountAsync();
+        var totalPages = (int)Math.Ceiling(totalCount / (double)pageSize);
+
         var properties = await context.CustomProperties
             .Skip((page - 1) * pageSize)
             .Take(pageSize)
             .ToListAsync();
-        return Ok(properties);
+
+        var response = new
+        {
+            Items = properties.Select(p => new CustomProperty
+            {
+                Id = p.Id,
+                Name = p.Name,
+                Value = p.Value,
+                ParentTable = p.ParentTable,
+                CreatedBy = p.CreatedBy,
+                ModifiedBy = p.ModifiedBy
+            }).ToList(),
+            CurrentPage = page,
+            TotalPages = totalPages,
+            HasPreviousPage = page > 1,
+            HasNextPage = page < totalPages
+        };
+
+        return Ok(response);
     }
 
     [HttpGet("{id}")]