SystemCardComponent.razor 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617
  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" data-testid="system-type-value">@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. data-testid="system-ip-value">
  170. @EffectiveIp
  171. @if (string.IsNullOrWhiteSpace(System.Ip))
  172. {
  173. <span class="text-zinc-500 text-xs ml-2">(inherited)</span>
  174. }
  175. </div>
  176. }
  177. </div>
  178. <!-- Runs On -->
  179. <div class="text-sm">
  180. <div class="text-zinc-400 mb-1">
  181. Runs On
  182. <button class="hover:text-emerald-400 pl-2"
  183. @onclick="() => _selectParentOpen = true">+
  184. </button>
  185. </div>
  186. @if (System.RunsOn?.Count > 0)
  187. {
  188. @foreach (var parent in System.RunsOn)
  189. {
  190. var kind = (_parentKinds.GetValueOrDefault(parent) ?? "").Trim().ToLower();
  191. var url = "#";
  192. if (Resource.IsHardware(kind))
  193. {
  194. url = $"resources/hardware/{Uri.EscapeDataString(parent)}";
  195. }
  196. else if (kind == "system")
  197. {
  198. url = $"resources/systems/{Uri.EscapeDataString(parent)}";
  199. }
  200. <NavLink href="@url"
  201. class="text-emerald-400 text-sm pr-4">
  202. @parent
  203. </NavLink>
  204. @if (_isEditing)
  205. {
  206. <button class="text-red-400 hover:text-red-300 pr-4"
  207. @onclick="async () => await HandleParentDeleted(parent)">
  208. ✕
  209. </button>
  210. }
  211. }
  212. }
  213. </div>
  214. <div>
  215. <div class="flex items-center justify-between mb-1 group">
  216. <div class="text-zinc-400">Drives
  217. <button
  218. class="hover:text-emerald-400 group-hover:opacity-100 transition"
  219. title="Add Drive"
  220. data-testid="add-drive-button"
  221. @onclick="OpenAddDrive">
  222. +
  223. </button>
  224. </div>
  225. </div>
  226. @if (System.Drives?.Any() == true)
  227. {
  228. @foreach (var drive in System.Drives)
  229. {
  230. <div
  231. class="flex items-center justify-between text-zinc-300 group hover:bg-zinc-800/40 rounded px-1 py-0.5">
  232. <div class="flex gap-2 group-hover:opacity-100 transition">
  233. <button data-testid=@($"drive-item-{drive.Type}-{drive.Size}")
  234. class="hover:text-emerald-400"
  235. title="Edit Drive"
  236. @onclick="() => OpenEditDrives(drive)">
  237. @drive.Type — @drive.Size GB
  238. </button>
  239. </div>
  240. </div>
  241. }
  242. }
  243. </div>
  244. <ResourceTagEditor Resource="System"
  245. TestIdPrefix="system"/>
  246. <ResourceLabelEditor Resource="System"
  247. TestIdPrefix="system"/>
  248. <div class="md:col-span-2">
  249. <div class="text-zinc-400 mb-1">Notes</div>
  250. @if (_isEditing)
  251. {
  252. <MarkdownEditor
  253. @bind-Value="_edit.Notes"
  254. ShowActionButtons="false"
  255. TestIdPrefix="system-notes-editor"/>
  256. }
  257. else
  258. {
  259. <MarkdownViewer
  260. Value="@System.Notes"
  261. ShowEditButton="false"
  262. TestIdPrefix="system-notes-viewer"/>
  263. }
  264. </div>
  265. </div>
  266. </div>
  267. <!-- Parent Selector -->
  268. <HardwareOrSystemSelectionModal
  269. IsOpen="@_selectParentOpen"
  270. IsOpenChanged="v => _selectParentOpen = v"
  271. Title="Select a parent resource"
  272. Value="@SelectedParentName"
  273. OnAccept="HandleParentSelected"/>
  274. <DriveModal
  275. IsOpen="@_driveModalOpen"
  276. IsOpenChanged="v => _driveModalOpen = v"
  277. Value="@_editingDrive"
  278. OnSubmit="HandleDriveSubmit"
  279. OnDelete="HandleDriveDelete"
  280. TestIdPrefix="system"/>
  281. <ConfirmModal
  282. IsOpen="@_confirmDeleteOpen"
  283. IsOpenChanged="v => _confirmDeleteOpen = v"
  284. Title="Delete system"
  285. ConfirmText="Delete"
  286. ConfirmClass="bg-red-600 hover:bg-red-500"
  287. OnConfirm="DeleteServer"
  288. TestIdPrefix="system-delete">
  289. Are you sure you want to delete <strong>@System.Name</strong>?
  290. <br/>
  291. This will detach all dependent systems.
  292. </ConfirmModal>
  293. <StringValueModal
  294. IsOpen="_cloneOpen"
  295. IsOpenChanged="v => _cloneOpen = v"
  296. Title="Clone system"
  297. Description="Enter a name for the cloned system"
  298. Label="New system name"
  299. Value="@($"{System.Name}-copy")"
  300. OnSubmit="HandleCloneSubmit"
  301. TestIdPrefix="system-clone"/>
  302. @code {
  303. [Parameter] [EditorRequired] public SystemResource System { get; set; } = default!;
  304. [Parameter] public EventCallback<SystemEditModel> OnSave { get; set; }
  305. private bool _isEditing;
  306. private SystemEditModel _edit = new();
  307. void BeginEdit()
  308. {
  309. _edit = SystemEditModel.From(System);
  310. _isEditing = true;
  311. }
  312. async Task Save()
  313. {
  314. _isEditing = false;
  315. await OnSave.InvokeAsync(_edit);
  316. }
  317. void Cancel()
  318. {
  319. _isEditing = false;
  320. }
  321. bool _selectParentOpen;
  322. string? SelectedParentName;
  323. private readonly Dictionary<string, string> _parentKinds = new();
  324. protected override async Task OnParametersSetAsync()
  325. {
  326. await RefreshParentKinds();
  327. await ResolveEffectiveIp();
  328. }
  329. private async Task RefreshParentKinds()
  330. {
  331. _parentKinds.Clear();
  332. foreach (var parent in System.RunsOn)
  333. {
  334. var kind = (await ResourceCollection.GetKind(parent))?.ToLower();
  335. _parentKinds[parent] = kind ?? "";
  336. }
  337. }
  338. async Task HandleParentSelected(string? name)
  339. {
  340. if (name == System.Name)
  341. {
  342. return;
  343. }
  344. SelectedParentName = name;
  345. // Start from the edit buffer when editing, otherwise from the persisted model
  346. var runsOn = (_isEditing ? _edit.RunsOn : System.RunsOn) ?? new List<string>();
  347. runsOn = runsOn.Where(x => !string.IsNullOrWhiteSpace(x)).ToList();
  348. if (!string.IsNullOrWhiteSpace(name) && !runsOn.Contains(name))
  349. runsOn.Add(name);
  350. // IMPORTANT: use _edit values when editing so we don't wipe typed fields
  351. var type = _isEditing ? _edit.Type : System.Type;
  352. var os = _isEditing ? _edit.Os : System.Os;
  353. var cores = _isEditing ? _edit.Cores : System.Cores;
  354. var ram = _isEditing ? _edit.Ram : System.Ram;
  355. var ip = _isEditing ? _edit.Ip : System.Ip;
  356. var notes = _isEditing ? _edit.Notes : System.Notes;
  357. await UpdateUseCase.ExecuteAsync(
  358. System.Name,
  359. type,
  360. os,
  361. cores,
  362. ram,
  363. ip,
  364. runsOn,
  365. notes);
  366. System = await GetByNameUseCase.ExecuteAsync(System.Name);
  367. if (_isEditing)
  368. _edit.RunsOn = runsOn;
  369. else
  370. _edit = SystemEditModel.From(System);
  371. await RefreshParentKinds();
  372. }
  373. async Task HandleParentDeleted(string? name)
  374. {
  375. if (string.IsNullOrWhiteSpace(name))
  376. return;
  377. SelectedParentName = name;
  378. var runsOn = (_isEditing ? _edit.RunsOn : System.RunsOn) ?? new List<string>();
  379. System.RunsOn = runsOn = runsOn.Where(x => !string.IsNullOrWhiteSpace(x) && x != name).ToList();
  380. var type = _isEditing ? _edit.Type : System.Type;
  381. var os = _isEditing ? _edit.Os : System.Os;
  382. var cores = _isEditing ? _edit.Cores : System.Cores;
  383. var ram = _isEditing ? _edit.Ram : System.Ram;
  384. var ip = _isEditing ? _edit.Ip : System.Ip;
  385. var notes = _isEditing ? _edit.Notes : System.Notes;
  386. await UpdateUseCase.ExecuteAsync(
  387. System.Name,
  388. type,
  389. os,
  390. cores,
  391. ram,
  392. ip,
  393. runsOn,
  394. notes);
  395. System = await GetByNameUseCase.ExecuteAsync(System.Name);
  396. if (_isEditing)
  397. _edit.RunsOn = runsOn;
  398. else
  399. _edit = SystemEditModel.From(System);
  400. await RefreshParentKinds();
  401. }
  402. #region Drives
  403. bool _driveModalOpen;
  404. int _editingDriveIndex;
  405. Drive? _editingDrive;
  406. void OpenAddDrive()
  407. {
  408. _editingDriveIndex = -1;
  409. _editingDrive = null;
  410. _driveModalOpen = true;
  411. }
  412. void OpenEditDrives(Drive drive)
  413. {
  414. _editingDrive = drive;
  415. System.Drives ??= new List<Drive>();
  416. _editingDriveIndex = System.Drives.IndexOf(drive);
  417. ;
  418. _driveModalOpen = true;
  419. }
  420. async Task HandleDriveSubmit(Drive drive)
  421. {
  422. System.Drives ??= new List<Drive>();
  423. if (_editingDriveIndex < 0)
  424. {
  425. await AddDriveUseCase.ExecuteAsync(System.Name, drive.Type ?? "hdd", drive.Size ?? 0);
  426. }
  427. else
  428. {
  429. await UpdateDriveUseCase.ExecuteAsync(System.Name, _editingDriveIndex, drive.Type ?? "hdd", drive.Size ?? 0);
  430. }
  431. System = await GetByNameUseCase.ExecuteAsync(System.Name);
  432. StateHasChanged();
  433. }
  434. async Task HandleDriveDelete(Drive drive)
  435. {
  436. await RemoveDriveUseCase.ExecuteAsync(System.Name, _editingDriveIndex);
  437. System = await GetByNameUseCase.ExecuteAsync(System.Name);
  438. StateHasChanged();
  439. }
  440. #endregion
  441. }
  442. <StringValueModal
  443. IsOpen="_renameOpen"
  444. IsOpenChanged="v => _renameOpen = v"
  445. Title="Rename system"
  446. Description="Enter a new name for this system"
  447. Label="New system name"
  448. Value="@System.Name"
  449. OnSubmit="HandleRenameSubmit"
  450. TestIdPrefix="system-rename"/>
  451. @code {
  452. private bool _confirmDeleteOpen;
  453. [Parameter] public EventCallback<string> OnDeleted { get; set; }
  454. void ConfirmDelete()
  455. {
  456. _confirmDeleteOpen = true;
  457. }
  458. async Task DeleteServer()
  459. {
  460. _confirmDeleteOpen = false;
  461. await DeleteUseCase.ExecuteAsync(System.Name);
  462. if (OnDeleted.HasDelegate)
  463. await OnDeleted.InvokeAsync(System.Name);
  464. }
  465. }
  466. @code
  467. {
  468. bool _cloneOpen;
  469. void OpenClone()
  470. {
  471. _cloneOpen = true;
  472. }
  473. async Task HandleCloneSubmit(string newName)
  474. {
  475. await CloneUseCase.ExecuteAsync(System.Name, newName);
  476. Nav.NavigateTo($"resources/systems/{Uri.EscapeDataString(newName)}");
  477. }
  478. }
  479. @code
  480. {
  481. bool _renameOpen;
  482. void OpenRename()
  483. {
  484. _renameOpen = true;
  485. }
  486. async Task HandleRenameSubmit(string newName)
  487. {
  488. await RenameUseCase.ExecuteAsync(System.Name, newName);
  489. Nav.NavigateTo($"resources/systems/{Uri.EscapeDataString(newName)}");
  490. }
  491. }
  492. @code{
  493. private string? EffectiveIp;
  494. private async Task ResolveEffectiveIp()
  495. {
  496. // If system has its own IP, use it
  497. if (!string.IsNullOrWhiteSpace(System.Ip))
  498. {
  499. EffectiveIp = System.Ip;
  500. return;
  501. }
  502. // Must have exactly one parent
  503. if (System.RunsOn?.Count != 1)
  504. {
  505. EffectiveIp = null;
  506. return;
  507. }
  508. var parentName = System.RunsOn.First();
  509. // Must be a system
  510. if (!_parentKinds.TryGetValue(parentName, out var kind) ||
  511. kind?.ToLower() != "system")
  512. {
  513. EffectiveIp = null;
  514. return;
  515. }
  516. // Load parent system
  517. var parent = await GetByNameUseCase.ExecuteAsync(parentName);
  518. EffectiveIp = string.IsNullOrWhiteSpace(parent?.Ip)
  519. ? null
  520. : parent.Ip;
  521. }
  522. }