feat: enhance product listing and navigation functionality

- Added a wrapper div for product items in the DiscountStore and Store pages to improve layout consistency.
- Implemented state management for URL synchronization and scroll restoration in both product components.
- Refactored product loading logic to streamline data retrieval and improve user experience when navigating between product pages.

These changes enhance the overall functionality and user experience of the product listing pages, ensuring better state management and navigation.

src/FrontOffice.Main/Pages/Store/Products.razor

@@ -118,7 +118,8 @@
             @foreach (var p in _products)
             {
                 <MudItem xs="6" sm="6" md="3"
-                         onclick="@(() => Navigation.NavigateTo($"{RouteConstants.Store.ProductDetail}{p.Id}"))">
+                         onclick="@(() => OpenProduct(p.Id))">
+                    <div id="@($"shop-product-{p.Id}")" class="h-100">
                     <MudCard Class="rounded-lg h-100 d-flex flex-column overflow-hidden"
                              Style="cursor:pointer;">
 
@@ -164,6 +165,7 @@
                             </MudButton>
                         </MudCardActions>
                     </MudCard>
+                    </div>
                 </MudItem>
             }
         </MudGrid>

src/FrontOffice.Main/Pages/Store/Products.razor.cs

@@ -2,19 +2,11 @@ using System.Linq;
 using Microsoft.AspNetCore.Components;
 using Microsoft.AspNetCore.Components.Routing;
 using Microsoft.AspNetCore.Components.Web;
-using Microsoft.AspNetCore.WebUtilities;
+using Microsoft.JSInterop;
 using FrontOffice.Main.Utilities;
 
 namespace FrontOffice.Main.Pages.Store;
 
-public enum ProductSortOption
-{
-    PriceDesc,  // گران‌ترین (پیش‌فرض)
-    PriceAsc,   // ارزان‌ترین
-    Newest,     // جدیدترین
-    Title       // الفبایی
-}
-
 public partial class Products : ComponentBase, IDisposable
 {
     [Inject] private ProductService ProductService { get; set; } = default!;
@@ -23,6 +15,7 @@ public partial class Products : ComponentBase, IDisposable
     [Inject] private VATService VAT { get; set; } = default!;
     [Inject] private GuestActionGate GuestGate { get; set; } = default!;
     [Inject] private AuthService AuthService { get; set; } = default!;
+    [Inject] private IJSRuntime Js { get; set; } = default!;
 
     private bool _isAuthenticated;
     private string _query = string.Empty;
@@ -35,8 +28,9 @@ public partial class Products : ComponentBase, IDisposable
     private List<Product> _products = new();
     private long? _activeCategoryId;
     private string? _activeCategoryTitle;
-    
-    private ProductSortOption _sortOption = ProductSortOption.PriceDesc; // پیش‌فرض: گران‌ترین
+    private ProductSortOption _sortOption = ProductSortOption.PriceDesc;
+    private bool _ignoreNextLocationChange;
+    private bool _pendingScrollRestore;
 
     protected override async Task OnInitializedAsync()
     {
@@ -44,80 +38,132 @@ public partial class Products : ComponentBase, IDisposable
         await Cart.EnsureInitializedAsync();
         Cart.OnChange += StateHasChanged;
         Navigation.LocationChanged += HandleLocationChanged;
-        await LoadInitial();
+        ApplyStateFromUri();
+        await LoadPages(_currentPage);
+        _pendingScrollRestore = true;
     }
 
     protected override async Task OnAfterRenderAsync(bool firstRender)
     {
         if (firstRender)
-        {
-            // بارگذاری نرخ VAT
             await VAT.LoadAsync();
+
+        if (_pendingScrollRestore && !_loading && _products.Count > 0)
+        {
+            _pendingScrollRestore = false;
+            var payload = await ShopListScrollRestore.TakeAsync(Js, ShopListScrollRestore.StoreKey);
+            if (payload is not null)
+                await ShopListScrollRestore.RestoreAsync(Js, payload);
         }
+
         await base.OnAfterRenderAsync(firstRender);
     }
 
-    private async Task LoadInitial()
+    private void ApplyStateFromUri()
+    {
+        var state = ShopListQueryState.Parse(Navigation.ToAbsoluteUri(Navigation.Uri));
+        _query = state.Query;
+        _sortOption = ShopListQueryState.ParseSortOption(state.Sort);
+        _activeCategoryId = state.CategoryId;
+        _currentPage = state.Pages;
+    }
+
+    private ShopListQueryState CaptureState() => new()
+    {
+        Query = _query,
+        Sort = ShopListQueryState.ToSortKey(_sortOption),
+        CategoryId = _activeCategoryId,
+        Pages = Math.Max(1, _currentPage)
+    };
+
+    private void SyncUrl()
+    {
+        var target = CaptureState().ToRelativeUrl(RouteConstants.Store.Products);
+        var currentPathAndQuery = Navigation.ToAbsoluteUri(Navigation.Uri).PathAndQuery;
+        if (string.Equals(currentPathAndQuery, target, StringComparison.OrdinalIgnoreCase)
+            || string.Equals(currentPathAndQuery, target + "/", StringComparison.OrdinalIgnoreCase))
+            return;
+
+        _ignoreNextLocationChange = true;
+        Navigation.NavigateTo(target, replace: true);
+    }
+
+    private async Task LoadPages(int pagesToLoad)
     {
         _loading = true;
-        _currentPage = 1;
         _products.Clear();
-        UpdateCategoryFilterFromUri();
-        var sortBy = GetSortByValue();
-        var result = await ProductService.GetProductsPagedAsync(_query, _activeCategoryId, sortBy, _currentPage, PageSize);
-        _products = result.Products;
-        _hasMore = result.HasNext;
-        _totalCount = result.TotalCount;
+        _hasMore = true;
+        pagesToLoad = Math.Max(1, pagesToLoad);
+        var sortBy = ShopListQueryState.ToApiSortBy(_sortOption);
+
+        for (var page = 1; page <= pagesToLoad; page++)
+        {
+            var result = await ProductService.GetProductsPagedAsync(
+                _query, _activeCategoryId, sortBy, page, PageSize);
+            if (page == 1)
+            {
+                _products = result.Products;
+                _totalCount = result.TotalCount;
+            }
+            else
+            {
+                _products.AddRange(result.Products);
+            }
+
+            _currentPage = page;
+            _hasMore = result.HasNext;
+            if (!_hasMore)
+                break;
+        }
+
         _activeCategoryTitle = _activeCategoryId is { } categoryId
             ? (await CategoryService.GetByIdAsync(categoryId))?.Title
             : null;
         _loading = false;
     }
 
+    private async Task ReloadFromFilters()
+    {
+        _currentPage = 1;
+        await LoadPages(1);
+        SyncUrl();
+        StateHasChanged();
+    }
+
     private async Task LoadMore()
     {
         if (_loadingMore || !_hasMore) return;
-        
+
         _loadingMore = true;
         StateHasChanged();
-        
+
         _currentPage++;
-        var sortBy = GetSortByValue();
-        var result = await ProductService.GetProductsPagedAsync(_query, _activeCategoryId, sortBy, _currentPage, PageSize);
+        var sortBy = ShopListQueryState.ToApiSortBy(_sortOption);
+        var result = await ProductService.GetProductsPagedAsync(
+            _query, _activeCategoryId, sortBy, _currentPage, PageSize);
         _products.AddRange(result.Products);
         _hasMore = result.HasNext;
-        
+        SyncUrl();
+
         _loadingMore = false;
         StateHasChanged();
     }
 
-    private string GetSortByValue()
-    {
-        return _sortOption switch
-        {
-            ProductSortOption.PriceDesc => "price desc",
-            ProductSortOption.PriceAsc => "price asc",
-            ProductSortOption.Newest => "id desc",
-            ProductSortOption.Title => "title asc",
-            _ => "price desc"
-        };
-    }
+    private async Task OnSortChanged() => await ReloadFromFilters();
 
-    private async Task OnSortChanged()
-    {
-        await LoadInitial();
-    }
-
-    private async Task OnQueryChanged(KeyboardEventArgs _)
-    {
-        await LoadInitial();
-    }
+    private async Task OnQueryChanged(KeyboardEventArgs _) => await ReloadFromFilters();
 
     private async Task AddToCart(Product p)
     {
         await GuestGate.RunAsync(() => Cart.Add(p, 1));
     }
 
+    private async Task OpenProduct(long productId)
+    {
+        await ShopListScrollRestore.SaveAsync(Js, ShopListScrollRestore.StoreKey, productId);
+        Navigation.NavigateTo($"{RouteConstants.Store.ProductDetail}{productId}");
+    }
+
     private string FormatPrice(long price) => $"{VAT.AddVAT(price):N0} تومان";
 
     public void Dispose()
@@ -128,24 +174,33 @@ public partial class Products : ComponentBase, IDisposable
 
     private void HandleLocationChanged(object? sender, LocationChangedEventArgs args)
     {
-        _ = InvokeAsync(LoadInitial);
-    }
-
-    private void UpdateCategoryFilterFromUri()
-    {
-        var uri = Navigation.ToAbsoluteUri(Navigation.Uri);
-        if (QueryHelpers.ParseQuery(uri.Query).TryGetValue("category", out var values) &&
-            long.TryParse(values.FirstOrDefault(), out var categoryId))
+        if (_ignoreNextLocationChange)
         {
-            _activeCategoryId = categoryId;
+            _ignoreNextLocationChange = false;
             return;
         }
 
-        _activeCategoryId = null;
+        var uri = Navigation.ToAbsoluteUri(args.Location);
+        if (!uri.AbsolutePath.Equals(RouteConstants.Store.Products, StringComparison.OrdinalIgnoreCase))
+            return;
+
+        var incoming = ShopListQueryState.Parse(uri);
+        if (incoming.Matches(CaptureState()))
+            return;
+
+        _ = InvokeAsync(async () =>
+        {
+            ApplyStateFromUri();
+            await LoadPages(_currentPage);
+            _pendingScrollRestore = true;
+            StateHasChanged();
+        });
     }
 
-    private void ClearCategoryFilter()
+    private async Task ClearCategoryFilter()
     {
-        Navigation.NavigateTo(RouteConstants.Store.Products);
+        _activeCategoryId = null;
+        _activeCategoryTitle = null;
+        await ReloadFromFilters();
     }
 }