add: thousand seperator, User balance

Frontend/Controllers/BorrowingsController.cs

@@ -1,3 +1,4 @@
+using Frontend.Models;
 using Frontend.Models.Dtos;
 using Frontend.Services;
 using Microsoft.AspNetCore.Authorization;
@@ -39,7 +40,15 @@ namespace Frontend.Controllers
         public async Task<IActionResult> Rewards()
         {
             var rewards = await _apiClient.GetActiveRewardsAsync();
-            return View(rewards);
+            var account = await _apiClient.GetMyLoyaltyAccountAsync();
+            
+            var viewModel = new RewardsViewModel
+            {
+                Rewards = rewards,
+                Account = account
+            };
+            
+            return View(viewModel);
         }
 
         [Authorize(Roles = "Librarian")]

Frontend/Models/RewardsViewModel.cs

@@ -0,0 +1,10 @@
+using Frontend.Models.Dtos;
+
+namespace Frontend.Models
+{
+    public class RewardsViewModel
+    {
+        public IEnumerable<LoyaltyRewardDto> Rewards { get; set; } = Enumerable.Empty<LoyaltyRewardDto>();
+        public LoyaltyAccountDto? Account { get; set; }
+    }
+}

Frontend/Views/Borrowings/Rewards.cshtml

@@ -1,4 +1,4 @@
-@model IEnumerable<Frontend.Models.Dtos.LoyaltyRewardDto>
+@model Frontend.Models.RewardsViewModel
 @{
     ViewData["Title"] = "Loyalty Rewards";
 }
@@ -15,15 +15,14 @@
             </div>
             <div>
                 <p class="text-[10px] font-bold text-amber-600 uppercase tracking-widest mb-0.5">Your Balance</p>
-                @* This would ideally be fetched from a global layout or specific viewbag *@
-                <p class="text-2xl font-black text-slate-900">Points</p>
+                <p class="text-2xl font-black text-slate-900">@(Model.Account?.CurrentBalance.ToString("N0") ?? "0") Points</p>
             </div>
         </div>
     </div>
 </div>
 
 <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
-    @if (!Model.Any())
+    @if (!Model.Rewards.Any())
     {
         <div class="col-span-full py-20 text-center bg-slate-50 rounded-3xl border-2 border-dashed border-slate-200">
             <div class="text-slate-400 mb-4">
@@ -33,7 +32,7 @@
         </div>
     }
 
-    @foreach (var reward in Model)
+    @foreach (var reward in Model.Rewards)
     {
         <div class="group relative card p-6 hover:shadow-2xl hover:-translate-y-1 transition-all duration-300 border-t-4 border-amber-400">
             <div class="flex justify-between items-start mb-6">
@@ -41,7 +40,7 @@
                     <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 3v4M3 5h4M6 17v4m-2-2h4m5-16l2.286 6.857L21 12l-5.714 2.143L13 21l-2.286-6.857L5 12l5.714-2.143L13 3z"></path></svg>
                 </div>
                 <div class="text-right">
-                    <span class="text-3xl font-black text-slate-900">@reward.PointCost</span>
+                    <span class="text-3xl font-black text-slate-900">@reward.PointCost.ToString("N0")</span>
                     <span class="text-[10px] block font-bold text-slate-400 uppercase tracking-tighter">Points Required</span>
                 </div>
             </div>