From 23d20f2f04f7f07d929778ff2f92503cbb26bbbf Mon Sep 17 00:00:00 2001
From: Kevin Matsubara <kevin.matsubara@proton.me>
Date: Fri, 28 Mar 2025 23:20:00 +0100
Subject: [PATCH] Allow HTML attributes on SearchBar.

---
 .../Components/Controls/SearchBarComponent.razor            | 6 +++++-
 ServerManagement/Components/Pages/Servers.razor             | 6 +++++-
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/ServerManagement/Components/Controls/SearchBarComponent.razor b/ServerManagement/Components/Controls/SearchBarComponent.razor
index 1e97447..fb8b559 100644
--- a/ServerManagement/Components/Controls/SearchBarComponent.razor
+++ b/ServerManagement/Components/Controls/SearchBarComponent.razor
@@ -1,4 +1,4 @@
-<div class="input-group mb-3 input-width">
+<div class="input-group mb-3 input-width" @attributes="OtherAttributes">
   <input type="text" class="form-control" placeholder="Search servers"
     @bind-value="serverFilter"
     @bind-value:event="oninput" />
@@ -18,6 +18,10 @@
   [Parameter]
   public EventCallback<string> FilterSearchTerm { get; set; }
 
+  [Parameter(CaptureUnmatchedValues = true)]
+  // Enables other HTML attributes like class, style, data-x, etc.
+  public Dictionary<string, object>? OtherAttributes { get; set; }
+
   private void HandleSearch()
   {
     FilterSearchTerm.InvokeAsync(serverFilter);
diff --git a/ServerManagement/Components/Pages/Servers.razor b/ServerManagement/Components/Pages/Servers.razor
index 16fe783..a4f047e 100644
--- a/ServerManagement/Components/Pages/Servers.razor
+++ b/ServerManagement/Components/Pages/Servers.razor
@@ -6,7 +6,11 @@
 <br/>
 <CityListComponent @ref="cityListComponent" SelectCityCallBack="HandleCitySelection"></CityListComponent>
 <br/>
-<SearchBarComponent @ref="searchBarComponent" FilterSearchTerm="HandleSearch"></SearchBarComponent>
+<SearchBarComponent
+  @ref="searchBarComponent"
+  FilterSearchTerm="HandleSearch"
+  style="width: 600px">
+</SearchBarComponent>
 <br/>
 <a href="@($"/servers/add")" class="btn btn-primary">Add</a>
 <br/>