HardwareSelectionModal.razor 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196
  1. @using System.ComponentModel.DataAnnotations
  2. @using RackPeek.Domain.Persistence
  3. @using RackPeek.Domain.Resources.Hardware
  4. @inject IResourceCollection Repo
  5. @if (IsOpen)
  6. {
  7. <div class="fixed inset-0 z-50 flex items-center justify-center">
  8. <!-- Backdrop -->
  9. <div class="absolute inset-0 bg-black/70" @onclick="Cancel"></div>
  10. <!-- Modal -->
  11. <div class="relative bg-zinc-900 border border-zinc-800 rounded w-full max-w-lg p-4">
  12. <!-- Header -->
  13. <div class="flex justify-between items-center mb-4">
  14. <div class="text-zinc-100 text-sm font-medium">
  15. @Title
  16. </div>
  17. <button
  18. class="text-zinc-400 hover:text-zinc-200"
  19. @onclick="Cancel">
  20. ✕
  21. </button>
  22. </div>
  23. <!-- Form -->
  24. <EditForm Model="_model" OnValidSubmit="HandleAccept">
  25. <DataAnnotationsValidator/>
  26. <div class="space-y-3 text-sm">
  27. <!-- Search -->
  28. <div>
  29. @* ReSharper disable once CSharpWarnings::CS8619 *@
  30. <InputText
  31. class="w-full bg-zinc-800 border border-zinc-700 rounded px-2 py-1 text-zinc-100"
  32. placeholder="Search hardware…"
  33. Value="@_search"
  34. ValueChanged="OnSearchChanged"
  35. ValueExpression="() => _search"
  36. @oninput="OnSearchInput"/>
  37. </div>
  38. <!-- Selection -->
  39. <div>
  40. <InputSelect
  41. class="w-full bg-zinc-800 border border-zinc-700 rounded px-2 py-1 text-zinc-100"
  42. @bind-Value="_model.Value">
  43. <option value="">Select hardware…</option>
  44. @foreach (var group in FilteredHardware)
  45. {
  46. <optgroup label="@group.Key">
  47. @foreach (var hw in group.Value)
  48. {
  49. <option value="@hw.Name">@hw.Name</option>
  50. }
  51. </optgroup>
  52. }
  53. </InputSelect>
  54. </div>
  55. </div>
  56. <!-- Actions -->
  57. <div class="flex justify-end items-center mt-5 gap-2">
  58. <button
  59. type="button"
  60. class="px-3 py-1 rounded border border-zinc-700 text-zinc-300 hover:bg-zinc-800"
  61. @onclick="Cancel">
  62. Cancel
  63. </button>
  64. <button
  65. type="submit"
  66. class="px-3 py-1 rounded bg-emerald-600 text-black hover:bg-emerald-500"
  67. disabled="@(!CanAccept)">
  68. Accept
  69. </button>
  70. </div>
  71. </EditForm>
  72. </div>
  73. </div>
  74. }
  75. @code {
  76. /* ---------- Parameters ---------- */
  77. [Parameter] public bool IsOpen { get; set; }
  78. [Parameter] public EventCallback<bool> IsOpenChanged { get; set; }
  79. [Parameter] [EditorRequired] public string Title { get; set; } = "Select hardware";
  80. /// <summary>
  81. /// Default / pre-selected hardware name (may be null)
  82. /// </summary>
  83. [Parameter]
  84. public string? Value { get; set; }
  85. /// <summary>
  86. /// Called with the selected hardware name
  87. /// </summary>
  88. [Parameter]
  89. public EventCallback<string?> OnAccept { get; set; }
  90. /* ---------- State ---------- */
  91. private SelectionFormModel _model = new();
  92. private string _search = string.Empty;
  93. private List<Hardware> _hardware = new();
  94. private bool CanAccept => !string.IsNullOrWhiteSpace(_model.Value);
  95. /* ---------- Lifecycle ---------- */
  96. protected override async Task OnParametersSetAsync()
  97. {
  98. if (IsOpen)
  99. {
  100. _hardware = (await Repo.GetAllOfTypeAsync<Hardware>())
  101. .OrderBy(h => h.Kind)
  102. .ThenBy(h => h.Name)
  103. .ToList();
  104. _model = new SelectionFormModel
  105. {
  106. Value = Value
  107. };
  108. _search = string.Empty;
  109. }
  110. }
  111. protected override void OnAfterRender(bool firstRender)
  112. {
  113. }
  114. /* ---------- Computed ---------- */
  115. private IReadOnlyDictionary<string, List<Hardware>> FilteredHardware =>
  116. _hardware
  117. .Where(h =>
  118. string.IsNullOrWhiteSpace(_search) ||
  119. h.Name.Contains(_search.Trim(), StringComparison.OrdinalIgnoreCase))
  120. .GroupBy(h => h.Kind)
  121. .ToDictionary(
  122. g => g.Key,
  123. g => g.OrderBy(h => h.Name).ToList());
  124. /* ---------- Actions ---------- */
  125. private async Task HandleAccept()
  126. {
  127. await OnAccept.InvokeAsync(_model.Value);
  128. await Close();
  129. }
  130. private async Task Cancel()
  131. {
  132. await Close();
  133. }
  134. private async Task Close()
  135. {
  136. _model = new SelectionFormModel();
  137. _search = string.Empty;
  138. await IsOpenChanged.InvokeAsync(false);
  139. }
  140. /* ---------- Model ---------- */
  141. private sealed class SelectionFormModel
  142. {
  143. [Required] public string? Value { get; set; }
  144. }
  145. private void OnSearchChanged(string? value)
  146. {
  147. _search = value ?? string.Empty;
  148. }
  149. private void OnSearchInput(ChangeEventArgs e)
  150. {
  151. _search = e.Value?.ToString() ?? string.Empty;
  152. if (FilteredHardware.SelectMany(g => g.Value).All(h => h.Name != _model.Value))
  153. {
  154. _model.Value = null;
  155. }
  156. }
  157. }