feat: Search dialog styled

WotBlitzStatisticsPro.Blazor/Pages/SearchDialog.razor

@@ -1,4 +1,16 @@
-@inherits SearchDialogTypeBase
-<h3>SearchDialog</h3>
-@DialogType
-<RadzenButton Click=@(args => OnClick()) Text="Ok" Style="margin-bottom: 20px; width: 150px" />
+@using WotBlitzStatisticsPro.Blazor.Model
+@inherits SearchDialogTypeBase
+<!--Realm type selection-->
+<RadzenTextBox Placeholder=@($"{Localizer["Search"]}...") Change=@OnSearchTextChange Style="width: 100%;" />
+
+<RadzenListBox 
+    @bind-Value=@CurrentValue 
+     Data=@FilteredList 
+     ValueProperty="ItemId"
+     Style="height:335px; width: 100%; margin-top: 10px;">
+    <Template>
+        <!--ToDo: Create new component that will show nick[clan] {WinRate with color}, {battles count with translatable word "battles"}. And another component for Clans-->
+        @(((SearchItem) context).ItemName) | accountId: @(((SearchItem) context).ItemId)
+    </Template>
+</RadzenListBox>
+<RadzenButton Click=@(args => OnOkButtonClick()) Text="Ok" Style="margin: 10px auto 10px auto; display: block; width: 150px; " />

WotBlitzStatisticsPro.Blazor/Pages/SearchDialogTypeBase.cs

@@ -1,6 +1,8 @@
-using System.Threading.Tasks;
+using System.Collections.Generic;
+using System.Threading.Tasks;
 using MediatR;
 using Microsoft.AspNetCore.Components;
+using Microsoft.Extensions.Localization;
 using Radzen;
 using WotBlitzStatisticsPro.Blazor.Messages;
 using WotBlitzStatisticsPro.Blazor.Model;
@@ -15,12 +17,66 @@ namespace WotBlitzStatisticsPro.Blazor.Pages
         [Inject]
         private IMediator Mediator { get; set; }
 
+        [Inject]
+        public IStringLocalizer<App> Localizer { get; set; }
+
         [Parameter]
         public DialogType DialogType { get; set; }
 
-        public async Task OnClick()
+        public List<SearchItem> FilteredList { get; set; } = new();
+
+        //public RealmType CurrentRealmType { get; set; } = RealmType.Eu;
+
+        public long CurrentValue { get; set; }
+
+        public async Task OnSearchTextChange(string value)
         {
-            await Mediator.Publish(new OpenPlayerInfoMessage(123456789, false));
+            if (DialogType == DialogType.FindPlayer && value.Length < 3)
+            {
+                return;
+            }
+
+            FilteredList.Clear();
+            await InvokeAsync(StateHasChanged);
+
+            // ToDo: Call GraphQL Backend CurrentRealmType + value
+            await Task.Delay(1000);
+            for (int i = 0; i < 15; i++)
+            {
+                FilteredList.Add(new SearchItem(i, $"Item number {i}"));
+            }
+
+            await InvokeAsync(StateHasChanged);
+
+        }
+
+        public async Task OnLoadSearchData(LoadDataArgs args)
+        {
+            if (DialogType == DialogType.FindPlayer && args.Filter.Length < 3)
+            {
+                return;
+            }
+
+            FilteredList.Clear();
+            await InvokeAsync(StateHasChanged);
+
+            // ToDo: Call GraphQL Backend CurrentRealmType + args.Filter
+            await Task.Delay(1000);
+            for (int i = 0; i < 15; i++)
+            {
+                FilteredList.Add(new SearchItem(i, $"Item number {i}"));
+            }
+
+            await InvokeAsync(StateHasChanged);
+        }
+
+        public async Task OnOkButtonClick()
+        {
+            if (CurrentValue > 0)
+            {
+                await Mediator.Publish(new OpenPlayerInfoMessage(CurrentValue, false));
+            }
+
             DialogService.Close(true);
         }
     }