Moved Date Filter into collapsable filter list, renamed a few variabl…

…es to be clearer about intent
microsoft · May 24, 2023 · 1d10d91 · 1d10d91
1 parent 6e59217
commit 1d10d91
Show file tree

Hide file tree

Showing 2 changed files with 50 additions and 45 deletions.
diff --git a/src/EventLogExpert/Components/FilterPane.razor b/src/EventLogExpert/Components/FilterPane.razor
@@ -1,5 +1,4 @@
 @using EventLogExpert.Shared.Components
-
 @inherits FluxorComponent
 
 @inject IState<AvailableFilterState> AvailableFilterState
@@ -10,11 +9,17 @@
 <div class="filter-pane">
 
     <div class="filter-row">
-
         <div>
             <button class="button-primary" @onclick="AddFilter">
                 <i class="bi bi-plus-circle"></i> Add Filter
             </button>
+
+            @if (!_isDateFilterVisible)
+            {
+                <button class="button-primary" @onclick="AddDateFilter">
+                    <i class="bi bi-plus-circle"></i> Add Date Filter
+                </button>
+            }
         </div>
 
         <div class="header-center">
@@ -28,33 +33,21 @@
             <i class="bi bi-caret-up"></i>
         </span>
     </div>
+
     <div class="filter-content" data-toggle="@MenuState">
-        @foreach (var item in FilterPaneState.Value.CurrentFilters)
+        @if (_isDateFilterVisible)
         {
-            <FilterRow Value="@item" />
-        }
-    </div>
-
-    @if (FilterPaneState.Value.FilteredDateRange == null && !_editingDateRange)
-    {
-        <div>
-            <button class="button-primary" @onclick="AddDateFilter">
-                <i class="bi bi-plus-circle"></i> Add Date Filter
-            </button>
-        </div>
-    }
-    else
-    {
-        <div>
             <EditForm id="filter-form" Model="_model">
                 <span>
-                    After: <InputDate class="input-filter-datetime" Type="InputDateType.DateTimeLocal" @bind-Value="_model.After" disabled="@IsEditingDisabled" />
+                    After: <InputDate class="input-filter-datetime" Type="InputDateType.DateTimeLocal" 
+                               @bind-Value="_model.After" disabled="@(!_canEditDate)" />
                 </span>
                 <span>
-                    Before: <InputDate class="input-filter-datetime" Type="InputDateType.DateTimeLocal" @bind-Value="_model.Before" disabled="@IsEditingDisabled" />
+                    Before: <InputDate class="input-filter-datetime" Type="InputDateType.DateTimeLocal" 
+                                @bind-Value="_model.Before" disabled="@(!_canEditDate)" />
                 </span>
 
-                @if (_editingDateRange)
+                @if (_canEditDate)
                 {
                     <button class="button-save" @onclick="ApplyDateFilter">
                         <i class="bi bi-check-circle"></i> Apply
@@ -70,6 +63,12 @@
                     <i class="bi bi-dash-circle"></i> Remove
                 </button>
             </EditForm>
-        </div>
-    }
+        }
+
+        @foreach (var item in FilterPaneState.Value.CurrentFilters)
+        {
+            <FilterRow Value="@item" />
+        }
+    </div>
+
 </div>
diff --git a/src/EventLogExpert/Components/FilterPane.razor.cs b/src/EventLogExpert/Components/FilterPane.razor.cs
@@ -8,51 +8,57 @@ namespace EventLogExpert.Components;
 
 public partial class FilterPane
 {
-    private FilterDateModel _model = new();
+    private readonly FilterDateModel _model = new();
 
-    private bool _editingDateRange = false;
+    private bool _canEditDate = true;
+    private bool _isDateFilterVisible;
+    private bool _isFilterListVisible;
 
-    private bool _expandMenu;
+    private string MenuState => _isFilterListVisible.ToString().ToLower();
 
-    private string MenuState => _expandMenu.ToString().ToLower();
-
-    private void AddFilter()
+    private void AddDateFilter()
     {
-        Dispatcher.Dispatch(new FilterPaneAction.AddFilter());
-        _expandMenu = true;
+        _isFilterListVisible = true;
+        _canEditDate = true;
+
+        // Offset by 1 minute to make sure we don't drop events
+        // since HTML input DateTime does not go lower than minutes
+        _model.Before = EventLogState.Value.Events.FirstOrDefault()?.TimeCreated
+                .AddMinutes(1).ConvertTimeZone(SettingsState.Value.TimeZone) ??
+            DateTime.Now;
+
+        _model.After = EventLogState.Value.Events.LastOrDefault()?.TimeCreated
+                .AddMinutes(-1).ConvertTimeZone(SettingsState.Value.TimeZone) ??
+            DateTime.Now;
+
+        _isDateFilterVisible = true;
     }
 
-    private void AddDateFilter()
+    private void AddFilter()
     {
-        _model.Before = EventLogState.Value.Events.FirstOrDefault()?.TimeCreated.AddMinutes(1).ConvertTimeZone(SettingsState.Value.TimeZone) ?? DateTime.Now;
-        _model.After = EventLogState.Value.Events.LastOrDefault()?.TimeCreated.AddMinutes(-1).ConvertTimeZone(SettingsState.Value.TimeZone) ?? DateTime.Now;
-        _editingDateRange = true;
+        Dispatcher.Dispatch(new FilterPaneAction.AddFilter());
+        _isFilterListVisible = true;
     }
 
     private void ApplyDateFilter()
     {
         FilterDateModel model = new()
         {
-            After = _model.After.ToUniversalTime(), 
+            After = _model.After.ToUniversalTime(),
             Before = _model.Before.ToUniversalTime()
         };
 
         Dispatcher.Dispatch(new FilterPaneAction.SetFilterDateRange(model));
-        _editingDateRange = false;
+        _canEditDate = false;
     }
 
     private void RemoveDateFilter()
     {
         Dispatcher.Dispatch(new FilterPaneAction.SetFilterDateRange(null));
-        _editingDateRange = false;
-    }
-
-    private void EditDateFilter()
-    {
-        _editingDateRange = true;
+        _isDateFilterVisible = false;
     }
 
-    public bool IsEditingDisabled => _editingDateRange == false;
+    private void EditDateFilter() => _canEditDate = true;
 
-    private void ToggleMenu() => _expandMenu = !_expandMenu;
+    private void ToggleMenu() => _isFilterListVisible = !_isFilterListVisible;
 }