From 8442e3d7b0e23c9dbf7bac5653c69d5ec5c45d24 Mon Sep 17 00:00:00 2001
From: NICK BRAIN <nicklausbrain@gmail.com>
Date: Sun, 1 Dec 2024 13:45:18 +0200
Subject: [PATCH] Add/remove sample sentence works

---
 My1kWordsEe/Components/Layout/SampleV2.razor  | 40 ++++++++++++-------
 My1kWordsEe/Components/Pages/WordPage.razor   | 25 +++++++-----
 .../Cqs/RemoveFromFavoritesCommand.cs         | 10 +++++
 My1kWordsEe/wwwroot/app.css                   |  4 ++
 4 files changed, 56 insertions(+), 23 deletions(-)

diff --git a/My1kWordsEe/Components/Layout/SampleV2.razor b/My1kWordsEe/Components/Layout/SampleV2.razor
index c7d026ac..df1e0873 100644
--- a/My1kWordsEe/Components/Layout/SampleV2.razor
+++ b/My1kWordsEe/Components/Layout/SampleV2.razor
@@ -21,6 +21,15 @@
     [Parameter]
     public required SampleSentence Sample { get; init; }
 
+    [Parameter]
+    public required Func<SampleSentence, Task> AddToFavorites { get; init; }
+
+    [Parameter]
+    public required Func<SampleSentence, Task> RemoveFromFavorites { get; init; }
+
+    [Parameter]
+    public bool IsFavorite { get; init; }
+
     private ConfirmDialog DeleteSampleDialog = default!;
 
     [Inject] protected ToastService ToastService { get; set; } = default!;
@@ -108,27 +117,30 @@
                                 </Button>
                                 <audio id="@Sample.EeAudioUrl" src="@Sample.EeAudioUrl"></audio>
                             </li>
-                            @if (IsAdmin)
+                            @if (IsLoggedIn)
                             {
                                 <li class="list-group-item border-0">
-                                    <Button Color="ButtonColor.Danger" Size="ButtonSize.Small" @onclick="ShowDeleteConfirmationAsync">
-                                        <i class="bi bi-trash3-fill"></i>
-                                    </Button>
+                                    @if (IsFavorite)
+                                    {
+                                        <Button Color="ButtonColor.Primary" Size="ButtonSize.Small" @onclick="() => RemoveFromFavorites(Sample)">
+                                            <i role="button" class="bi bi-star-fill"></i>
+                                        </Button>
+                                    }
+                                    else
+                                    {
+                                        <Button Color="ButtonColor.Primary" Size="ButtonSize.Small" @onclick="() => AddToFavorites(Sample)">
+                                            <i role="button" class="bi bi-star"></i>
+                                        </Button>
+                                    }
                                 </li>
                             }
-                            @if (IsLoggedIn)
+                            @if (IsAdmin)
                             {
-                                // todo add phrase to favorites
-                               @*  <li class="list-group-item border-0">
-                                    <Button Color="ButtonColor.Secondary" Size="ButtonSize.Small">
-                                        <i class="bi bi-star"></i>
-                                    </Button>
-                                </li>
                                 <li class="list-group-item border-0">
-                                    <Button Color="ButtonColor.Secondary" Size="ButtonSize.Small">
-                                        <i class="bi bi-star-fill"></i>
+                                    <Button Color="ButtonColor.Danger" Size="ButtonSize.Small" @onclick="ShowDeleteConfirmationAsync">
+                                        <i class="bi bi-trash3-fill"></i>
                                     </Button>
-                                </li> *@
+                                </li>
                             }
                         </ul>
                     </td>
diff --git a/My1kWordsEe/Components/Pages/WordPage.razor b/My1kWordsEe/Components/Pages/WordPage.razor
index 7d2a7afb..ffa3fad6 100644
--- a/My1kWordsEe/Components/Pages/WordPage.razor
+++ b/My1kWordsEe/Components/Pages/WordPage.razor
@@ -65,20 +65,22 @@
         return await commonSample;
     }
 
-    private async Task AddToFavorites()
+    private async Task AddToFavorites(dynamic favorite)
     {
         PreloadService.Show(SpinnerColor.Light, "Saving data...");
         var user = await UserAccessor.GetRequiredUserAsync(User);
-        Favorites = await AddToFavoritesCommand.Invoke(user.Id, Value);
+        Favorites = await AddToFavoritesCommand.Invoke(user.Id, favorite);
         PreloadService.Hide();
+        StateHasChanged();
     }
 
-    private async Task RemoveFromFavorites()
+    private async Task RemoveFromFavorites(dynamic favorite)
     {
         PreloadService.Show(SpinnerColor.Light, "Saving data...");
         var user = await UserAccessor.GetRequiredUserAsync(User);
-        Favorites = await RemoveFromFavoritesCommand.Invoke(user.Id, Value);
+        Favorites = await RemoveFromFavoritesCommand.Invoke(user.Id, favorite);
         PreloadService.Hide();
+        StateHasChanged();
     }
 
     private bool IsSampleGenerationInProgress = false;
@@ -108,7 +110,9 @@
 
     private bool IsLoggedIn => User?.Identity?.IsAuthenticated ?? false;
 
-    private bool IsFavorite => IsDataLoadedOk && IsLoggedIn && Favorites.HasValue && Favorites.Value.IsSuccess && Favorites.Value.Value.Words.ContainsKey(EeWord.ToLower());
+    private bool IsFavorite() => IsDataLoadedOk && IsLoggedIn && Favorites.HasValue && Favorites.Value.IsSuccess && Favorites.Value.Value.Words.ContainsKey(EeWord.ToLower());
+
+    private bool IsFavorite(SampleSentence sentence) => IsDataLoadedOk && IsLoggedIn && Favorites.HasValue && Favorites.Value.IsSuccess && Favorites.Value.Value.Sentences.ContainsKey(sentence.EeSentence.ToLower());
 }
 
 <script>
@@ -123,13 +127,13 @@
         <h1>
             @EeWord
 
-            @if (IsFavorite)
+            @if (IsFavorite())
             {
-                <i role="button" class="bi bi-star-fill" style="color: rebeccapurple" @onclick="RemoveFromFavorites"></i>
+                <i role="button" class="bi bi-star-fill favorite-active" @onclick="() => RemoveFromFavorites(Value)"></i>
             }
             else
             {
-                <i role="button" class="bi bi-star" @onclick="AddToFavorites"></i>
+                <i role="button" class="bi bi-star" @onclick="() => AddToFavorites(Value)"></i>
             }
 
             @if (IsDataLoadedOk && Value.EeAudioUrl != null)
@@ -169,7 +173,10 @@
             @foreach (var sample in Value.Samples)
             {
                 <div class="col col-12 col-sm-6 p-1">
-                    <SampleV2 Sample="@sample">
+                    <SampleV2 Sample="@sample"
+                        AddToFavorites="AddToFavorites"
+                        RemoveFromFavorites="RemoveFromFavorites"
+                        IsFavorite="IsFavorite(sample)" >
                     </SampleV2>
                 </div>
             }
diff --git a/My1kWordsEe/Services/Cqs/RemoveFromFavoritesCommand.cs b/My1kWordsEe/Services/Cqs/RemoveFromFavoritesCommand.cs
index 1e0d49bd..8bb28f0e 100644
--- a/My1kWordsEe/Services/Cqs/RemoveFromFavoritesCommand.cs
+++ b/My1kWordsEe/Services/Cqs/RemoveFromFavoritesCommand.cs
@@ -27,5 +27,15 @@ public async Task<Result<Favorites>> Invoke(string userId, SampleWord sample)
                     Result.Success(favorites));
             });
         }
+
+        public async Task<Result<Favorites>> Invoke(string userId, SampleSentence sample)
+        {
+            return await this.getFavoritesCommand.Invoke(userId).Bind(async favorites =>
+            {
+                favorites.Sentences.Remove(sample.EeSentence.ToLower());
+                return await this.azureBlobService.SaveFavorites(favorites).Bind(_ =>
+                    Result.Success(favorites));
+            });
+        }
     }
 }
diff --git a/My1kWordsEe/wwwroot/app.css b/My1kWordsEe/wwwroot/app.css
index 25fdb389..50b7350e 100644
--- a/My1kWordsEe/wwwroot/app.css
+++ b/My1kWordsEe/wwwroot/app.css
@@ -53,4 +53,8 @@ h1:focus {
 .card:hover {
     /*transform: scale(1.05);*/
     box-shadow: 0 10px 20px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);
+}
+
+.favorite-active {
+    color: rebeccapurple
 }
\ No newline at end of file