SystemCardComponent.razor 17 KB

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