SystemCardComponent.razor 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616
  1. @using RackPeek.Domain.Persistence
  2. @using RackPeek.Domain.Resources
  3. @using RackPeek.Domain.Resources.SubResources
  4. @using RackPeek.Domain.Resources.SystemResources
  5. @using RackPeek.Domain.Resources.SystemResources.UseCases
  6. @using RackPeek.Domain.UseCases.Drives
  7. @inject UpdateSystemUseCase UpdateUseCase
  8. @inject IGetResourceByNameUseCase<SystemResource> GetByNameUseCase
  9. @inject IAddDriveUseCase<SystemResource> AddDriveUseCase
  10. @inject IUpdateDriveUseCase<SystemResource> UpdateDriveUseCase
  11. @inject IRemoveDriveUseCase<SystemResource> RemoveDriveUseCase
  12. @inject IDeleteResourceUseCase<SystemResource> DeleteUseCase
  13. @inject ICloneResourceUseCase<SystemResource> CloneUseCase
  14. @inject NavigationManager Nav
  15. @inject IRenameResourceUseCase<SystemResource> RenameUseCase
  16. @inject IResourceCollection ResourceCollection
  17. <div class="border border-zinc-800 rounded p-4 bg-zinc-900"
  18. data-testid=@($"system-item-{System.Name.Replace(" ", "-")}")>
  19. <div class="flex justify-between items-center mb-3">
  20. <NavLink href="@($"resources/systems/{Uri.EscapeDataString(System.Name)}")" class="block"
  21. data-testid=@($"system-item-{System.Name.Replace(" ", "-")}-link")>
  22. <div class="text-zinc-100 hover:text-emerald-300">
  23. @System.Name
  24. </div>
  25. </NavLink>
  26. <div class="flex gap-3 text-xs">
  27. @if (!_isEditing)
  28. {
  29. <button data-testid="edit-system-button"
  30. class="text-zinc-400 hover:text-zinc-200"
  31. @onclick="BeginEdit">
  32. Edit
  33. </button>
  34. <button data-testid="rename-system-button"
  35. class="text-xs text-blue-400 hover:text-blue-300 transition"
  36. @onclick="OpenRename">
  37. Rename
  38. </button>
  39. <button data-testid="clone-system-button"
  40. class="text-xs text-emerald-400 hover:text-emerald-300 transition"
  41. @onclick="OpenClone">
  42. Clone
  43. </button>
  44. <button data-testid="delete-system-button"
  45. class="text-xs text-red-400 hover:text-red-300 transition"
  46. @onclick="ConfirmDelete">
  47. Delete
  48. </button>
  49. }
  50. else
  51. {
  52. <button data-testid="save-system-button"
  53. class="text-emerald-400 hover:text-emerald-300"
  54. @onclick="Save">
  55. Save
  56. </button>
  57. <button data-testid="cancel-system-button"
  58. class="text-zinc-500 hover:text-zinc-300"
  59. @onclick="Cancel">
  60. Cancel
  61. </button>
  62. }
  63. </div>
  64. </div>
  65. <div class="grid grid-cols-1 md:grid-cols-2 gap-3 text-sm">
  66. <div>
  67. <div class="text-zinc-400 mb-1">Type</div>
  68. @if (_isEditing)
  69. {
  70. <select class="w-full px-3 py-2 rounded-md
  71. bg-zinc-800 text-zinc-100
  72. border border-zinc-600
  73. placeholder-zinc-500
  74. focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500
  75. hover:border-zinc-400
  76. transition-colors duration-150
  77. cursor-text"
  78. data-testid="system-type-select"
  79. @bind="_edit.Type">
  80. @foreach (var type in SystemResource.ValidSystemTypes)
  81. {
  82. <option value="@type">@type</option>
  83. }
  84. </select>
  85. }
  86. else if (!string.IsNullOrWhiteSpace(System.Type))
  87. {
  88. <div class="text-zinc-300">@System.Type</div>
  89. }
  90. </div>
  91. <!-- OS -->
  92. <div>
  93. <div class="text-zinc-400 mb-1">OS</div>
  94. @if (_isEditing)
  95. {
  96. <input
  97. class="w-full px-3 py-2 rounded-md
  98. bg-zinc-800 text-zinc-100
  99. border border-zinc-600
  100. placeholder-zinc-500
  101. focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500
  102. hover:border-zinc-400
  103. transition-colors duration-150
  104. cursor-text"
  105. data-testid="system-os-input"
  106. @bind="_edit.Os"/>
  107. }
  108. else if (!string.IsNullOrWhiteSpace(System.Os))
  109. {
  110. <div class="text-zinc-300">@System.Os</div>
  111. }
  112. </div>
  113. <!-- Cores -->
  114. <div>
  115. <div class="text-zinc-400 mb-1">Cores</div>
  116. @if (_isEditing)
  117. {
  118. <input type="number"
  119. class="w-full px-3 py-2 rounded-md
  120. bg-zinc-800 text-zinc-100
  121. border border-zinc-600
  122. placeholder-zinc-500
  123. focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500
  124. hover:border-zinc-400
  125. transition-colors duration-150
  126. cursor-text"
  127. data-testid="system-cores-input"
  128. @bind="_edit.Cores"/>
  129. }
  130. else if (System.Cores.HasValue)
  131. {
  132. <div class="text-zinc-300">@System.Cores</div>
  133. }
  134. </div>
  135. <!-- RAM -->
  136. <div>
  137. <div class="text-zinc-400 mb-1">RAM (GB)</div>
  138. @if (_isEditing)
  139. {
  140. <input type="number"
  141. class="w-full px-3 py-2 rounded-md
  142. bg-zinc-800 text-zinc-100
  143. border border-zinc-600
  144. placeholder-zinc-500
  145. focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500
  146. hover:border-zinc-400
  147. transition-colors duration-150
  148. cursor-text"
  149. data-testid="system-ram-input"
  150. @bind="_edit.Ram"/>
  151. }
  152. else if (System.Ram.HasValue)
  153. {
  154. <div class="text-zinc-300">@System.Ram GB</div>
  155. }
  156. </div>
  157. <!-- IP -->
  158. <div>
  159. <div class="text-zinc-400 mb-1">IP Address</div>
  160. @if (_isEditing)
  161. {
  162. <input class="w-full px-3 py-2 rounded-md bg-zinc-800 text-zinc-100 border border-zinc-600"
  163. data-testid="system-ip-input"
  164. @bind="_edit.Ip"/>
  165. }
  166. else if (!string.IsNullOrWhiteSpace(EffectiveIp))
  167. {
  168. <div class="text-zinc-300">
  169. @EffectiveIp
  170. @if (string.IsNullOrWhiteSpace(System.Ip))
  171. {
  172. <span class="text-zinc-500 text-xs ml-2">(inherited)</span>
  173. }
  174. </div>
  175. }
  176. </div>
  177. <!-- Runs On -->
  178. <div class="text-sm">
  179. <div class="text-zinc-400 mb-1">
  180. Runs On
  181. <button class="hover:text-emerald-400 pl-2"
  182. @onclick="() => _selectParentOpen = true">+
  183. </button>
  184. </div>
  185. @if (System.RunsOn?.Count > 0)
  186. {
  187. @foreach (var parent in System.RunsOn)
  188. {
  189. var kind = (_parentKinds.GetValueOrDefault(parent) ?? "").Trim().ToLower();
  190. var url = "#";
  191. if (Resource.IsHardware(kind))
  192. {
  193. url = $"resources/hardware/{Uri.EscapeDataString(parent)}";
  194. }
  195. else if (kind == "system")
  196. {
  197. url = $"resources/systems/{Uri.EscapeDataString(parent)}";
  198. }
  199. <NavLink href="@url"
  200. class="text-emerald-400 text-sm pr-4">
  201. @parent
  202. </NavLink>
  203. @if (_isEditing)
  204. {
  205. <button class="text-red-400 hover:text-red-300 pr-4"
  206. @onclick="async () => await HandleParentDeleted(parent)">
  207. </button>
  208. }
  209. }
  210. }
  211. </div>
  212. <div>
  213. <div class="flex items-center justify-between mb-1 group">
  214. <div class="text-zinc-400">Drives
  215. <button
  216. class="hover:text-emerald-400 group-hover:opacity-100 transition"
  217. title="Add Drive"
  218. data-testid="add-drive-button"
  219. @onclick="OpenAddDrive">
  220. +
  221. </button>
  222. </div>
  223. </div>
  224. @if (System.Drives?.Any() == true)
  225. {
  226. @foreach (var drive in System.Drives)
  227. {
  228. <div
  229. class="flex items-center justify-between text-zinc-300 group hover:bg-zinc-800/40 rounded px-1 py-0.5">
  230. <div class="flex gap-2 group-hover:opacity-100 transition">
  231. <button data-testid=@($"drive-item-{drive.Type}-{drive.Size}")
  232. class="hover:text-emerald-400"
  233. title="Edit Drive"
  234. @onclick="() => OpenEditDrives(drive)">
  235. @drive.Type — @drive.Size GB
  236. </button>
  237. </div>
  238. </div>
  239. }
  240. }
  241. </div>
  242. <ResourceTagEditor Resource="System"
  243. TestIdPrefix="system"/>
  244. <ResourceLabelEditor Resource="System"
  245. TestIdPrefix="system"/>
  246. <div class="md:col-span-2">
  247. <div class="text-zinc-400 mb-1">Notes</div>
  248. @if (_isEditing)
  249. {
  250. <MarkdownEditor
  251. @bind-Value="_edit.Notes"
  252. ShowActionButtons="false"
  253. TestIdPrefix="system-notes-editor"/>
  254. }
  255. else
  256. {
  257. <MarkdownViewer
  258. Value="@System.Notes"
  259. ShowEditButton="false"
  260. TestIdPrefix="system-notes-viewer"/>
  261. }
  262. </div>
  263. </div>
  264. </div>
  265. <!-- Parent Selector -->
  266. <HardwareOrSystemSelectionModal
  267. IsOpen="@_selectParentOpen"
  268. IsOpenChanged="v => _selectParentOpen = v"
  269. Title="Select a parent resource"
  270. Value="@SelectedParentName"
  271. OnAccept="HandleParentSelected"/>
  272. <DriveModal
  273. IsOpen="@_driveModalOpen"
  274. IsOpenChanged="v => _driveModalOpen = v"
  275. Value="@_editingDrive"
  276. OnSubmit="HandleDriveSubmit"
  277. OnDelete="HandleDriveDelete"
  278. TestIdPrefix="system"/>
  279. <ConfirmModal
  280. IsOpen="@_confirmDeleteOpen"
  281. IsOpenChanged="v => _confirmDeleteOpen = v"
  282. Title="Delete system"
  283. ConfirmText="Delete"
  284. ConfirmClass="bg-red-600 hover:bg-red-500"
  285. OnConfirm="DeleteServer"
  286. TestIdPrefix="system-delete">
  287. Are you sure you want to delete <strong>@System.Name</strong>?
  288. <br/>
  289. This will detach all dependent systems.
  290. </ConfirmModal>
  291. <StringValueModal
  292. IsOpen="_cloneOpen"
  293. IsOpenChanged="v => _cloneOpen = v"
  294. Title="Clone system"
  295. Description="Enter a name for the cloned system"
  296. Label="New system name"
  297. Value="@($"{System.Name}-copy")"
  298. OnSubmit="HandleCloneSubmit"
  299. TestIdPrefix="system-clone"/>
  300. @code {
  301. [Parameter] [EditorRequired] public SystemResource System { get; set; } = default!;
  302. [Parameter] public EventCallback<SystemEditModel> OnSave { get; set; }
  303. private bool _isEditing;
  304. private SystemEditModel _edit = new();
  305. void BeginEdit()
  306. {
  307. _edit = SystemEditModel.From(System);
  308. _isEditing = true;
  309. }
  310. async Task Save()
  311. {
  312. _isEditing = false;
  313. await OnSave.InvokeAsync(_edit);
  314. }
  315. void Cancel()
  316. {
  317. _isEditing = false;
  318. }
  319. bool _selectParentOpen;
  320. string? SelectedParentName;
  321. private readonly Dictionary<string, string> _parentKinds = new();
  322. protected override async Task OnParametersSetAsync()
  323. {
  324. await RefreshParentKinds();
  325. await ResolveEffectiveIp();
  326. }
  327. private async Task RefreshParentKinds()
  328. {
  329. _parentKinds.Clear();
  330. foreach (var parent in System.RunsOn)
  331. {
  332. var kind = (await ResourceCollection.GetKind(parent))?.ToLower();
  333. _parentKinds[parent] = kind ?? "";
  334. }
  335. }
  336. async Task HandleParentSelected(string? name)
  337. {
  338. if (name == System.Name)
  339. {
  340. return;
  341. }
  342. SelectedParentName = name;
  343. // Start from the edit buffer when editing, otherwise from the persisted model
  344. var runsOn = (_isEditing ? _edit.RunsOn : System.RunsOn) ?? new List<string>();
  345. runsOn = runsOn.Where(x => !string.IsNullOrWhiteSpace(x)).ToList();
  346. if (!string.IsNullOrWhiteSpace(name) && !runsOn.Contains(name))
  347. runsOn.Add(name);
  348. // IMPORTANT: use _edit values when editing so we don't wipe typed fields
  349. var type = _isEditing ? _edit.Type : System.Type;
  350. var os = _isEditing ? _edit.Os : System.Os;
  351. var cores = _isEditing ? _edit.Cores : System.Cores;
  352. var ram = _isEditing ? _edit.Ram : System.Ram;
  353. var ip = _isEditing ? _edit.Ip : System.Ip;
  354. var notes = _isEditing ? _edit.Notes : System.Notes;
  355. await UpdateUseCase.ExecuteAsync(
  356. System.Name,
  357. type,
  358. os,
  359. cores,
  360. ram,
  361. ip,
  362. runsOn,
  363. notes);
  364. System = await GetByNameUseCase.ExecuteAsync(System.Name);
  365. if (_isEditing)
  366. _edit.RunsOn = runsOn;
  367. else
  368. _edit = SystemEditModel.From(System);
  369. await RefreshParentKinds();
  370. }
  371. async Task HandleParentDeleted(string? name)
  372. {
  373. if (string.IsNullOrWhiteSpace(name))
  374. return;
  375. SelectedParentName = name;
  376. var runsOn = (_isEditing ? _edit.RunsOn : System.RunsOn) ?? new List<string>();
  377. System.RunsOn = runsOn = runsOn.Where(x => !string.IsNullOrWhiteSpace(x) && x != name).ToList();
  378. var type = _isEditing ? _edit.Type : System.Type;
  379. var os = _isEditing ? _edit.Os : System.Os;
  380. var cores = _isEditing ? _edit.Cores : System.Cores;
  381. var ram = _isEditing ? _edit.Ram : System.Ram;
  382. var ip = _isEditing ? _edit.Ip : System.Ip;
  383. var notes = _isEditing ? _edit.Notes : System.Notes;
  384. await UpdateUseCase.ExecuteAsync(
  385. System.Name,
  386. type,
  387. os,
  388. cores,
  389. ram,
  390. ip,
  391. runsOn,
  392. notes);
  393. System = await GetByNameUseCase.ExecuteAsync(System.Name);
  394. if (_isEditing)
  395. _edit.RunsOn = runsOn;
  396. else
  397. _edit = SystemEditModel.From(System);
  398. await RefreshParentKinds();
  399. }
  400. #region Drives
  401. bool _driveModalOpen;
  402. int _editingDriveIndex;
  403. Drive? _editingDrive;
  404. void OpenAddDrive()
  405. {
  406. _editingDriveIndex = -1;
  407. _editingDrive = null;
  408. _driveModalOpen = true;
  409. }
  410. void OpenEditDrives(Drive drive)
  411. {
  412. _editingDrive = drive;
  413. System.Drives ??= new List<Drive>();
  414. _editingDriveIndex = System.Drives.IndexOf(drive);
  415. ;
  416. _driveModalOpen = true;
  417. }
  418. async Task HandleDriveSubmit(Drive drive)
  419. {
  420. System.Drives ??= new List<Drive>();
  421. if (_editingDriveIndex < 0)
  422. {
  423. await AddDriveUseCase.ExecuteAsync(System.Name, drive.Type ?? "hdd", drive.Size ?? 0);
  424. }
  425. else
  426. {
  427. await UpdateDriveUseCase.ExecuteAsync(System.Name, _editingDriveIndex, drive.Type ?? "hdd", drive.Size ?? 0);
  428. }
  429. System = await GetByNameUseCase.ExecuteAsync(System.Name);
  430. StateHasChanged();
  431. }
  432. async Task HandleDriveDelete(Drive drive)
  433. {
  434. await RemoveDriveUseCase.ExecuteAsync(System.Name, _editingDriveIndex);
  435. System = await GetByNameUseCase.ExecuteAsync(System.Name);
  436. StateHasChanged();
  437. }
  438. #endregion
  439. }
  440. <StringValueModal
  441. IsOpen="_renameOpen"
  442. IsOpenChanged="v => _renameOpen = v"
  443. Title="Rename system"
  444. Description="Enter a new name for this system"
  445. Label="New system name"
  446. Value="@System.Name"
  447. OnSubmit="HandleRenameSubmit"
  448. TestIdPrefix="system-rename"/>
  449. @code {
  450. private bool _confirmDeleteOpen;
  451. [Parameter] public EventCallback<string> OnDeleted { get; set; }
  452. void ConfirmDelete()
  453. {
  454. _confirmDeleteOpen = true;
  455. }
  456. async Task DeleteServer()
  457. {
  458. _confirmDeleteOpen = false;
  459. await DeleteUseCase.ExecuteAsync(System.Name);
  460. if (OnDeleted.HasDelegate)
  461. await OnDeleted.InvokeAsync(System.Name);
  462. }
  463. }
  464. @code
  465. {
  466. bool _cloneOpen;
  467. void OpenClone()
  468. {
  469. _cloneOpen = true;
  470. }
  471. async Task HandleCloneSubmit(string newName)
  472. {
  473. await CloneUseCase.ExecuteAsync(System.Name, newName);
  474. Nav.NavigateTo($"resources/systems/{Uri.EscapeDataString(newName)}");
  475. }
  476. }
  477. @code
  478. {
  479. bool _renameOpen;
  480. void OpenRename()
  481. {
  482. _renameOpen = true;
  483. }
  484. async Task HandleRenameSubmit(string newName)
  485. {
  486. await RenameUseCase.ExecuteAsync(System.Name, newName);
  487. Nav.NavigateTo($"resources/systems/{Uri.EscapeDataString(newName)}");
  488. }
  489. }
  490. @code{
  491. private string? EffectiveIp;
  492. private async Task ResolveEffectiveIp()
  493. {
  494. // If system has its own IP, use it
  495. if (!string.IsNullOrWhiteSpace(System.Ip))
  496. {
  497. EffectiveIp = System.Ip;
  498. return;
  499. }
  500. // Must have exactly one parent
  501. if (System.RunsOn?.Count != 1)
  502. {
  503. EffectiveIp = null;
  504. return;
  505. }
  506. var parentName = System.RunsOn.First();
  507. // Must be a system
  508. if (!_parentKinds.TryGetValue(parentName, out var kind) ||
  509. kind?.ToLower() != "system")
  510. {
  511. EffectiveIp = null;
  512. return;
  513. }
  514. // Load parent system
  515. var parent = await GetByNameUseCase.ExecuteAsync(parentName);
  516. EffectiveIp = string.IsNullOrWhiteSpace(parent?.Ip)
  517. ? null
  518. : parent.Ip;
  519. }
  520. }