From 058b4d890a129bd46d63df5edf595080ea98d651 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marek=20Fi=C5=A1era?= <mara@neptuo.com>
Date: Sat, 26 Nov 2022 11:02:09 +0100
Subject: [PATCH] #444 - Collapsible templates selection.

---
 .../Components/OutcomeCreate.razor            | 81 ++++++++++---------
 .../Components/OutcomeCreate.razor.cs         |  6 +-
 .../ExpenseTemplateEntity.cs                  |  2 +-
 3 files changed, 50 insertions(+), 39 deletions(-)

diff --git a/src/Money.Blazor.Host/Components/OutcomeCreate.razor b/src/Money.Blazor.Host/Components/OutcomeCreate.razor
index e9d3cfd1..3b092f2e 100644
--- a/src/Money.Blazor.Host/Components/OutcomeCreate.razor
+++ b/src/Money.Blazor.Host/Components/OutcomeCreate.razor
@@ -4,48 +4,55 @@
     <ChildContent>
         @if (Templates != null)
         {
-            <style>
-                .card.card-hover {
-                    height: calc(100% - 15px);
-                }
-            </style>
-            <div class="form-row">
-                @foreach (var model in Templates)
-                {
-                    <div class="col-6 col-sm-6 col-md-4">
-                        <div class="card card-hover cursor-pointer" @onclick="(() => ApplyTemplate(model))">
-                            <div class="card-body">
-                                <div>
-                                    <strong>
-                                        @CurrencyFormatter.Format(model.Amount, CurrencyFormatter.FormatZero.Placehoder)
-                                    </strong>
-                                </div>
+            <button class="btn btn-light btn-block text-left mb-3" @onclick="(() => AreTemplatesOpened = !AreTemplatesOpened)">
+                <Icon Identifier="redo" />
+                Templates
+            </button>
+            @if (AreTemplatesOpened)
+            {
+                <style>
+                    .card.card-hover {
+                        height: calc(100% - 15px);
+                    }
+                </style>
+                <div class="form-row">
+                    @foreach (var model in Templates)
+                    {
+                        <div class="col-6 col-sm-6 col-md-4">
+                            <div class="card card-hover cursor-pointer" @onclick="(() => ApplyTemplate(model))">
+                                <div class="card-body">
+                                    <div>
+                                        <strong>
+                                            @CurrencyFormatter.Format(model.Amount, CurrencyFormatter.FormatZero.Placehoder)
+                                        </strong>
+                                    </div>
 
-                                @if (!model.CategoryKey.IsEmpty)
-                                {
-                                    <p class="m-0 @FindCategoryColor(model.CategoryKey)?.SelectAccent("back-dark", "back-light")">
-                                        <span class="badge" style="background-color: @FindCategoryColor(model.CategoryKey)?.ToHashCode()">@FindCategoryName(model.CategoryKey)</span>
-                                    </p>
-                                }
+                                    @if (!model.CategoryKey.IsEmpty)
+                                    {
+                                        <p class="m-0 @FindCategoryColor(model.CategoryKey)?.SelectAccent("back-dark", "back-light")">
+                                            <span class="badge" style="background-color: @FindCategoryColor(model.CategoryKey)?.ToHashCode()">@FindCategoryName(model.CategoryKey)</span>
+                                        </p>
+                                    }
 
-                                @if (!String.IsNullOrEmpty(model.Description))
-                                {
-                                    <p class="text-truncate">
-                                        <small>
-                                            @model.Description
+                                    @if (!String.IsNullOrEmpty(model.Description))
+                                    {
+                                        <p class="text-truncate">
+                                            <small>
+                                                @model.Description
 
-                                            @if (model.IsFixed)
-                                            {
-                                                <em class="text-muted ml-1">Fixed</em>
-                                            }
-                                        </small>
-                                    </p>
-                                }
+                                                @if (model.IsFixed)
+                                                {
+                                                    <em class="text-muted ml-1">Fixed</em>
+                                                }
+                                            </small>
+                                        </p>
+                                    }
+                                </div>
                             </div>
                         </div>
-                    </div>
-                }
-            </div>
+                    }
+                </div>
+            }
         }
         <Validation ErrorMessages="@ErrorMessages" />
         <div class="form-group">
diff --git a/src/Money.Blazor.Host/Components/OutcomeCreate.razor.cs b/src/Money.Blazor.Host/Components/OutcomeCreate.razor.cs
index 51b76757..150f85bf 100644
--- a/src/Money.Blazor.Host/Components/OutcomeCreate.razor.cs
+++ b/src/Money.Blazor.Host/Components/OutcomeCreate.razor.cs
@@ -71,6 +71,8 @@ public partial class OutcomeCreate : System.IDisposable
         [Parameter]
         public bool IsFixed { get; set; }
 
+        protected bool AreTemplatesOpened { get; set; }
+
         private bool isAttachedToComponentContainer;
 
         protected override void OnInitialized()
@@ -192,7 +194,6 @@ protected void ApplyTemplate(ExpenseTemplateModel model)
             {
                 Amount = model.Amount.Value;
                 Currency = model.Amount.Currency;
-                IsFixed = model.IsFixed;
             }
 
             if (!String.IsNullOrEmpty(model.Description))
@@ -200,6 +201,9 @@ protected void ApplyTemplate(ExpenseTemplateModel model)
 
             if (!model.CategoryKey.IsEmpty)
                 CategoryKey = model.CategoryKey;
+
+            IsFixed = model.IsFixed;
+            AreTemplatesOpened = false;
         }
 
         protected string FindCategoryName(IKey categoryKey)
diff --git a/src/Money.Models.EntityFrameworkCore/ExpenseTemplateEntity.cs b/src/Money.Models.EntityFrameworkCore/ExpenseTemplateEntity.cs
index cffedcda..c1dea998 100644
--- a/src/Money.Models.EntityFrameworkCore/ExpenseTemplateEntity.cs
+++ b/src/Money.Models.EntityFrameworkCore/ExpenseTemplateEntity.cs
@@ -37,7 +37,7 @@ public ExpenseTemplateEntity(ExpenseTemplateCreated payload)
             if (!payload.CategoryKey.IsEmpty)
                 CategoryId = payload.CategoryKey.AsGuidKey().Guid;
 
-            IsFixed = true;
+            IsFixed = payload.IsFixed;
         }
 
         public ExpenseTemplateModel ToModel(int version) => version == 1