From d313e1dab1aaea583685112f47b335397e9915af Mon Sep 17 00:00:00 2001
From: Liam Morrow <ldmorrow@outlook.com>
Date: Wed, 16 Oct 2024 09:54:42 +1100
Subject: [PATCH] Specify a key when rendering the list of stats

The default behaviour was to reuse the same component as the list changes, however we should not be reusing the stats cards as they do not rerender on changes. Fixes: #295
---
 LiftLog.Ui/Pages/StatsPage.razor              | 2 +-
 LiftLog.Ui/Shared/Presentation/CardList.razor | 6 ++++++
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/LiftLog.Ui/Pages/StatsPage.razor b/LiftLog.Ui/Pages/StatsPage.razor
index 19f6f918..12d0ac2e 100644
--- a/LiftLog.Ui/Pages/StatsPage.razor
+++ b/LiftLog.Ui/Pages/StatsPage.razor
@@ -77,7 +77,7 @@ else if (!StatsState.Value.IsLoading && StatsState.Value.OverallView is not null
         <Card class=@CardClass>
             <StatGraphCardContent Title="Sessions" Statistics="overallStats.SessionStats" RenderDelay="TimeSpan.FromMilliseconds(200)"/>
         </Card>
-        <CardList Items="@(UnpinnedExercisesToShow.IndexedTuples())">
+        <CardList KeySelector="context=>context.Item.ExerciseName" Items="@(UnpinnedExercisesToShow.IndexedTuples())" >
             <StatGraphCardContent Title="@context.Item.ExerciseName" Statistics="[context.Item.Statistics, context.Item.OneRepMaxStatistics]" RenderDelay="TimeSpan.FromMilliseconds(200 + context.Index * 200)"/>
         </CardList>
         @if(SearchTerm != "" && !UnpinnedExercisesToShow.Any())
diff --git a/LiftLog.Ui/Shared/Presentation/CardList.razor b/LiftLog.Ui/Shared/Presentation/CardList.razor
index bbbd0a57..9edb626f 100644
--- a/LiftLog.Ui/Shared/Presentation/CardList.razor
+++ b/LiftLog.Ui/Shared/Presentation/CardList.razor
@@ -1,9 +1,13 @@
 @typeparam TItem
 
 <div @attributes="AdditionalAttributes" class=" @(AdditionalAttributes?.GetValueOrDefault("class")) flex flex-col gap-2 p-2 cardlist">
+    @{
+        var index = 0;
+    }
     @foreach (var item in Items)
     {
         <Card
+            @key="KeySelector?.Invoke(item) ?? index++"
             class="@CardClass"
             Type="CardType"
             OnLongPress=@(OnLongPress.HasDelegate ? ()=>OnLongPress.InvokeAsync(item) : default!)
@@ -30,6 +34,8 @@
 
     [Parameter] public Card.CardType CardType { get; set; } = Card.CardType.Outlined;
 
+    [Parameter] public Func<TItem, object>? KeySelector { get; set; }
+
     [Parameter(CaptureUnmatchedValues = true)]
     public Dictionary<string, object>? AdditionalAttributes { get; set; }
 }