From 52554d0d69157643ac4b6ab77e9e02aa425676cf Mon Sep 17 00:00:00 2001
From: NICK BRAIN <nicklausbrain@gmail.com>
Date: Sun, 1 Dec 2024 14:16:18 +0200
Subject: [PATCH] + list favorite sentences

---
 .../Components/Layout/GameComposite.razor     | 14 ++++----------
 My1kWordsEe/Components/Layout/SampleV2.razor  | 15 ++++-----------
 .../Components/Pages/FavoritesPage.razor      | 19 +++++++++++++++++--
 .../Pages/Games/ListenToEeGamePage.razor      |  8 --------
 .../Pages/Games/TranslateToEnGamePage.razor   |  8 --------
 My1kWordsEe/wwwroot/app.css                   |  5 +++++
 6 files changed, 30 insertions(+), 39 deletions(-)

diff --git a/My1kWordsEe/Components/Layout/GameComposite.razor b/My1kWordsEe/Components/Layout/GameComposite.razor
index ed4e8514..181b6adb 100644
--- a/My1kWordsEe/Components/Layout/GameComposite.razor
+++ b/My1kWordsEe/Components/Layout/GameComposite.razor
@@ -16,6 +16,7 @@
     {
         public string Title { get; set; }
     }
+
     class GameCompositeModel
     {
         public Slide[] Slides { get; set; } = new Slide[] { };
@@ -24,9 +25,10 @@
 
         public Slide CurrentSlide { get; set; }
     }
+
     GameCompositeModel Game = new();
 
-    private void OnNext() { }// Game.NextSlide();
+    private void OnNext() { } // Game.NextSlide();
 
     private void OnPrevious() { } //Game.PrevSlide();
 
@@ -34,9 +36,8 @@
 
     private Task OnSubmit()
     {
-
         return Task.CompletedTask;
-    } //=> { }; Game.CurrentSlide.Submit(CheckEnTranslationCommand);
+    }
 }
 
 
@@ -49,13 +50,6 @@
     })
 </script>
 
-<style>
-    .img-max-w-256 {
-        max-width: 256px;
-        width: 100%;
-    }
-</style>
-
 <h3>GameComposite</h3>
 
 <div class="text-left">
diff --git a/My1kWordsEe/Components/Layout/SampleV2.razor b/My1kWordsEe/Components/Layout/SampleV2.razor
index df1e0873..435a1921 100644
--- a/My1kWordsEe/Components/Layout/SampleV2.razor
+++ b/My1kWordsEe/Components/Layout/SampleV2.razor
@@ -22,10 +22,10 @@
     public required SampleSentence Sample { get; init; }
 
     [Parameter]
-    public required Func<SampleSentence, Task> AddToFavorites { get; init; }
+    public Func<SampleSentence, Task>? AddToFavorites { get; init; }
 
     [Parameter]
-    public required Func<SampleSentence, Task> RemoveFromFavorites { get; init; }
+    public Func<SampleSentence, Task>? RemoveFromFavorites { get; init; }
 
     [Parameter]
     public bool IsFavorite { get; init; }
@@ -94,13 +94,6 @@
     };
 </script>
 
-<style>
-    .img-max-w-256 {
-        max-width: 256px;
-        width: 100%;
-    }
-</style>
-
 <Card>
     <CardBody>
         <table class="table">
@@ -120,13 +113,13 @@
                             @if (IsLoggedIn)
                             {
                                 <li class="list-group-item border-0">
-                                    @if (IsFavorite)
+                                    @if (IsFavorite && RemoveFromFavorites != null)
                                     {
                                         <Button Color="ButtonColor.Primary" Size="ButtonSize.Small" @onclick="() => RemoveFromFavorites(Sample)">
                                             <i role="button" class="bi bi-star-fill"></i>
                                         </Button>
                                     }
-                                    else
+                                    else if (AddToFavorites != null)
                                     {
                                         <Button Color="ButtonColor.Primary" Size="ButtonSize.Small" @onclick="() => AddToFavorites(Sample)">
                                             <i role="button" class="bi bi-star"></i>
diff --git a/My1kWordsEe/Components/Pages/FavoritesPage.razor b/My1kWordsEe/Components/Pages/FavoritesPage.razor
index 422750d1..28fd13b6 100644
--- a/My1kWordsEe/Components/Pages/FavoritesPage.razor
+++ b/My1kWordsEe/Components/Pages/FavoritesPage.razor
@@ -67,14 +67,29 @@
                         }
                         else
                         {
-                            <h3>No favorites yet!</h3>
+                            <p class="mt-3">No favorite words yet</p>
                         }
                     </div>
                 </Content>
             </Tab>
             <Tab Title="Sentences">
                 <Content>
-                    <p class="mt-3">No sentences yet</p>
+                    <div class="row">
+                        @if (favorites.Words.Any())
+                        {
+                            @foreach (var sentencePair in favorites.Sentences)
+                            {
+                                var sentence = sentencePair.Value;
+                                <div class="col col-12 col-sm-6 p-1">
+                                    <SampleV2 Sample="sentence"></SampleV2>
+                                </div>
+                            }
+                        }
+                        else
+                        {
+                            <p class="mt-3">No favorite sentences yet</p>
+                        }
+                    </div>
                 </Content>
             </Tab>
         </Tabs>
diff --git a/My1kWordsEe/Components/Pages/Games/ListenToEeGamePage.razor b/My1kWordsEe/Components/Pages/Games/ListenToEeGamePage.razor
index b0280514..970d199e 100644
--- a/My1kWordsEe/Components/Pages/Games/ListenToEeGamePage.razor
+++ b/My1kWordsEe/Components/Pages/Games/ListenToEeGamePage.razor
@@ -48,14 +48,6 @@
     };
 </script>
 
-@* todo: extract style *@
-<style>
-    .img-max-w-256 {
-        max-width: 256px;
-        width: 100%;
-    }
-</style>
-
 <div class="text-left">
     <div class="row">
         <div class="col-7">
diff --git a/My1kWordsEe/Components/Pages/Games/TranslateToEnGamePage.razor b/My1kWordsEe/Components/Pages/Games/TranslateToEnGamePage.razor
index 6e254ce5..e425b65b 100644
--- a/My1kWordsEe/Components/Pages/Games/TranslateToEnGamePage.razor
+++ b/My1kWordsEe/Components/Pages/Games/TranslateToEnGamePage.razor
@@ -48,14 +48,6 @@
     };
 </script>
 
-@* todo: extract style *@
-<style>
-    .img-max-w-256 {
-        max-width: 256px;
-        width: 100%;
-    }
-</style>
-
 <div class="text-left">
     <div class="row">
         <div class="col-7">
diff --git a/My1kWordsEe/wwwroot/app.css b/My1kWordsEe/wwwroot/app.css
index 50b7350e..eccdf21b 100644
--- a/My1kWordsEe/wwwroot/app.css
+++ b/My1kWordsEe/wwwroot/app.css
@@ -55,6 +55,11 @@ h1:focus {
     box-shadow: 0 10px 20px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);
 }
 
+.img-max-w-256 {
+    max-width: 256px;
+    width: 100%;
+}
+
 .favorite-active {
     color: rebeccapurple
 }
\ No newline at end of file