From e951ecb65002410a6a46fc9446dbe9f1bddcade3 Mon Sep 17 00:00:00 2001
From: Jason Dove <jason@jasondove.me>
Date: Thu, 15 Apr 2021 19:54:19 -0500
Subject: [PATCH] fix lag when typing in search bar (#169)

---
 ErsatzTV/Shared/MainLayout.razor | 31 +++++++++++++++++++++----------
 ErsatzTV/wwwroot/css/site.css    |  4 ++++
 2 files changed, 25 insertions(+), 10 deletions(-)

diff --git a/ErsatzTV/Shared/MainLayout.razor b/ErsatzTV/Shared/MainLayout.razor
index ad04aa4aa..c6a79f905 100644
--- a/ErsatzTV/Shared/MainLayout.razor
+++ b/ErsatzTV/Shared/MainLayout.razor
@@ -10,21 +10,21 @@
 <MudSnackbarProvider/>
 
 <MudLayout>
-    <MudAppBar Elevation="1">
+    <MudAppBar Elevation="1" Class="app-bar">
         <div style="min-width: 240px">
             <a href="/">
                 <img src="/images/ersatztv.png" alt="ErsatzTV"/>
             </a>
         </div>
-        <MudTextField T="string"
-                      @bind-Value="@_query"
-                      AdornmentIcon="@Icons.Material.Filled.Search"
-                      Adornment="Adornment.Start"
-                      Variant="Variant.Outlined"
-                      Class="search-bar"
-                      OnKeyDown="@OnSearchKeyDown"
-                      Immediate="true">
-        </MudTextField>
+        <EditForm Model="@_dummyModel" OnSubmit="@(_ => PerformSearch())">
+            <MudTextField T="string"
+                          @bind-Value="@_query"
+                          AdornmentIcon="@Icons.Material.Filled.Search"
+                          Adornment="Adornment.Start"
+                          Variant="Variant.Outlined"
+                          Class="search-bar">
+            </MudTextField>
+        </EditForm>
         <MudAppBarSpacer/>
         <MudLink Color="Color.Info" Href="/iptv/channels.m3u" Target="_blank" Underline="Underline.None">M3U</MudLink>
         <MudLink Color="Color.Info" Href="/iptv/xmltv.xml" Target="_blank" Class="mx-4" Underline="Underline.None">XMLTV</MudLink>
@@ -74,6 +74,10 @@
 
     private string _query;
 
+    private record SearchModel;
+
+    private SearchModel _dummyModel = new();
+
     private MudTheme _ersatzTvTheme => new()
     {
         Palette = new Palette
@@ -122,4 +126,11 @@
         }
     }
 
+    private void PerformSearch()
+    {
+        string query = HttpUtility.UrlEncode(_query);
+        NavigationManager.NavigateTo($"/search?query={query}", true);
+        StateHasChanged();
+    }
+
 }
\ No newline at end of file
diff --git a/ErsatzTV/wwwroot/css/site.css b/ErsatzTV/wwwroot/css/site.css
index c881b83cb..b68551fbb 100644
--- a/ErsatzTV/wwwroot/css/site.css
+++ b/ErsatzTV/wwwroot/css/site.css
@@ -74,6 +74,10 @@
     border-radius: 4px;
 }
 
+.app-bar form {
+    flex-grow: 1;
+}
+
 .fanart-container {
     position: relative;
     width: 100%;