DesktopCardComponent.razor 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621
  1. @using RackPeek.Domain.Resources.Desktops
  2. @using RackPeek.Domain.Resources.SubResources
  3. @using RackPeek.Domain.UseCases.Cpus
  4. @using RackPeek.Domain.UseCases.Drives
  5. @using RackPeek.Domain.UseCases.Gpus
  6. @using RackPeek.Domain.UseCases.Nics
  7. @inject IGetResourceByNameUseCase<Desktop> GetByNameUseCase
  8. @inject UpdateDesktopUseCase UpdateUseCase
  9. @inject IDeleteResourceUseCase<Desktop> DeleteUseCase
  10. @inject IAddCpuUseCase<Desktop> AddCpuUseCase
  11. @inject IUpdateCpuUseCase<Desktop> UpdateCpuUseCase
  12. @inject IRemoveCpuUseCase<Desktop> RemoveCpuUseCase
  13. @inject IAddDriveUseCase<Desktop> AddDriveUseCase
  14. @inject IUpdateDriveUseCase<Desktop> UpdateDriveUseCase
  15. @inject IRemoveDriveUseCase<Desktop> RemoveDriveUseCase
  16. @inject IAddNicUseCase<Desktop> AddNicUseCase
  17. @inject IUpdateNicUseCase<Desktop> UpdateNicUseCase
  18. @inject IRemoveNicUseCase<Desktop> RemoveNicUseCase
  19. @inject IAddGpuUseCase<Desktop> AddGpuUseCase
  20. @inject IUpdateGpuUseCase<Desktop> UpdateGpuUseCase
  21. @inject IRemoveGpuUseCase<Desktop> RemoveGpuUseCase
  22. @inject ICloneResourceUseCase<Desktop> CloneUseCase
  23. @inject IRenameResourceUseCase<Desktop> RenameUseCase
  24. @inject NavigationManager Nav
  25. <div class="border border-zinc-800 rounded p-4 bg-zinc-900"
  26. data-testid=@($"desktop-item-{Desktop.Name.Replace(" ", "-")}")>
  27. <div class="flex justify-between items-center mb-3">
  28. <div class="text-zinc-100 hover:text-emerald-300">
  29. <NavLink href="@($"resources/hardware/{Uri.EscapeDataString(Desktop.Name)}")"
  30. class="block"
  31. data-testid=@($"desktop-item-{Desktop.Name.Replace(" ", "-")}-link")>
  32. @Desktop.Name
  33. </NavLink>
  34. </div>
  35. <div class="flex items-center gap-2">
  36. @if (!string.IsNullOrWhiteSpace(Desktop.Model))
  37. {
  38. <span class="text-xs text-zinc-400"
  39. data-testid="desktop-model-badge">
  40. @Desktop.Model
  41. </span>
  42. }
  43. <button data-testid="rename-desktop-button"
  44. class="text-xs text-blue-400 hover:text-blue-300 transition"
  45. @onclick="OpenRename">
  46. Rename
  47. </button>
  48. <button data-testid="clone-desktop-button"
  49. class="text-xs text-emerald-400 hover:text-emerald-300 transition"
  50. @onclick="OpenClone">
  51. Clone
  52. </button>
  53. <button data-testid="delete-desktop-button"
  54. class="text-xs text-red-400 hover:text-red-300 transition"
  55. @onclick="ConfirmDelete">
  56. Delete
  57. </button>
  58. </div>
  59. </div>
  60. <div class="grid grid-cols-1 md:grid-cols-2 gap-3 text-sm">
  61. <!-- CPU -->
  62. <div data-testid="desktop-cpu-section">
  63. <div class="flex items-center justify-between mb-1 group">
  64. <div class="text-zinc-400">
  65. CPU
  66. <button data-testid="add-cpu-button"
  67. class="hover:text-emerald-400 transition"
  68. @onclick="OpenAddCpu">
  69. +
  70. </button>
  71. </div>
  72. </div>
  73. @if (Desktop.Cpus?.Any() == true)
  74. {
  75. @foreach (var cpu in Desktop.Cpus)
  76. {
  77. <div
  78. class="flex items-center justify-between text-zinc-300 group hover:bg-zinc-800/40 rounded px-1 py-0.5">
  79. <button data-testid=@($"edit-cpu-{cpu.ToString().Replace(" ", "-")}")
  80. class="hover:text-emerald-400"
  81. @onclick="() => OpenEditCpu(cpu)">
  82. @cpu.Model — @cpu.Cores cores / @cpu.Threads threads
  83. </button>
  84. </div>
  85. }
  86. }
  87. </div>
  88. <!-- RAM -->
  89. <div data-testid="desktop-ram-section">
  90. <div class="text-zinc-400 mb-1">
  91. RAM
  92. <button data-testid="edit-ram-button"
  93. class="hover:text-emerald-400 transition"
  94. @onclick="EditRam">
  95. +
  96. </button>
  97. </div>
  98. @if (Desktop.Ram is not null)
  99. {
  100. <div
  101. class="flex items-center justify-between text-zinc-300 group hover:bg-zinc-800/40 rounded px-1 py-0.5">
  102. <button data-testid="ram-value-button"
  103. class="hover:text-emerald-400"
  104. @onclick="EditRam">
  105. @($"{Desktop.Ram.Size} GB {Desktop.Ram.Mts} MT/s")
  106. </button>
  107. </div>
  108. }
  109. </div>
  110. <!-- Drives -->
  111. <div data-testid="desktop-drive-section">
  112. <div class="flex items-center justify-between mb-1 group">
  113. <div class="text-zinc-400">
  114. Drives
  115. <button data-testid="add-drive-button"
  116. class="hover:text-emerald-400 transition"
  117. @onclick="OpenAddDrive">
  118. +
  119. </button>
  120. </div>
  121. </div>
  122. @if (Desktop.Drives?.Any() == true)
  123. {
  124. @foreach (var drive in Desktop.Drives)
  125. {
  126. <div
  127. class="flex items-center justify-between text-zinc-300 group hover:bg-zinc-800/40 rounded px-1 py-0.5">
  128. <button data-testid=@($"edit-drive-{drive.Type}-{drive.Size}")
  129. class="hover:text-emerald-400"
  130. @onclick="() => OpenEditDrive(drive)">
  131. @drive.Type — @drive.Size GB
  132. </button>
  133. </div>
  134. }
  135. }
  136. </div>
  137. <!-- NICs -->
  138. <div data-testid="desktop-nic-section">
  139. <div class="flex items-center justify-between mb-1 group">
  140. <div class="text-zinc-400">
  141. NICs
  142. <button data-testid="add-nic-button"
  143. class="hover:text-emerald-400 transition"
  144. @onclick="OpenAddNic">
  145. +
  146. </button>
  147. </div>
  148. </div>
  149. @if (Desktop.Nics?.Any() == true)
  150. {
  151. @foreach (var nic in Desktop.Nics)
  152. {
  153. <div
  154. class="flex items-center justify-between text-zinc-300 group hover:bg-zinc-800/40 rounded px-1 py-0.5">
  155. <button data-testid=@($"edit-nic-{nic.Type}-{nic.Speed}")
  156. class="hover:text-emerald-400"
  157. @onclick="() => OpenEditNic(nic)">
  158. @nic.Type — @nic.Speed Gbps (@nic.Ports ports)
  159. </button>
  160. </div>
  161. }
  162. }
  163. </div>
  164. <!-- GPUs -->
  165. <div data-testid="desktop-gpu-section">
  166. <div class="flex items-center justify-between mb-1 group">
  167. <div class="text-zinc-400">
  168. GPUs
  169. <button data-testid="add-gpu-button"
  170. class="hover:text-emerald-400 transition"
  171. @onclick="OpenAddGpu">
  172. +
  173. </button>
  174. </div>
  175. </div>
  176. @if (Desktop.Gpus?.Any() == true)
  177. {
  178. @foreach (var gpu in Desktop.Gpus)
  179. {
  180. <div
  181. class="flex items-center justify-between text-zinc-300 group hover:bg-zinc-800/40 rounded px-1 py-0.5">
  182. <button data-testid=@($"edit-gpu-{gpu.Model}-{gpu.Vram}")
  183. class="hover:text-emerald-400"
  184. @onclick="() => OpenEditGpu(gpu)">
  185. @gpu.Model — @gpu.Vram GB VRAM
  186. </button>
  187. </div>
  188. }
  189. }
  190. </div>
  191. <ResourceTagEditor Resource="Desktop"
  192. TestIdPrefix="desktop"/>
  193. <ResourceLabelEditor Resource="Desktop"
  194. TestIdPrefix="desktop"/>
  195. <div class="md:col-span-2" data-testid="desktop-notes-section">
  196. <div class="text-zinc-400 mb-1">Notes</div>
  197. @if (!_editingNotes)
  198. {
  199. <MarkdownViewer Value="@Desktop.Notes"
  200. ShowEditButton="true"
  201. OnEdit="BeginNotesEdit"
  202. TestIdPrefix="desktop-notes-viewer"/>
  203. }
  204. else
  205. {
  206. <MarkdownEditor @bind-Value="_notesDraft"
  207. ShowActionButtons="true"
  208. OnSave="SaveNotes"
  209. OnCancel="CancelNotesEdit"
  210. TestIdPrefix="desktop-notes-editor"/>
  211. }
  212. </div>
  213. </div>
  214. </div>
  215. <ConfirmModal IsOpen="_confirmDeleteOpen"
  216. IsOpenChanged="v => _confirmDeleteOpen = v"
  217. Title="Delete desktop"
  218. ConfirmText="Delete"
  219. ConfirmClass="bg-red-600 hover:bg-red-500"
  220. OnConfirm="DeleteServer"
  221. TestIdPrefix="Desktop">
  222. Are you sure you want to delete <strong>@Desktop.Name</strong>?
  223. </ConfirmModal>
  224. <StringValueModal IsOpen="_renameOpen"
  225. IsOpenChanged="v => _renameOpen = v"
  226. Title="Rename desktop"
  227. Description="Enter a new name for this desktop"
  228. Label="New desktop name"
  229. Value="@Desktop.Name"
  230. OnSubmit="HandleRenameSubmit"
  231. TestIdPrefix="desktop-rename"/>
  232. <StringValueModal IsOpen="_cloneOpen"
  233. IsOpenChanged="v => _cloneOpen = v"
  234. Title="Clone resource"
  235. Description="Enter a name for the cloned resource"
  236. Label="New resource name"
  237. Value="@($"{Desktop.Name}-copy")"
  238. OnSubmit="HandleCloneSubmit"
  239. TestIdPrefix="desktop-clone"/>
  240. <CpuModal IsOpen="@_cpuModalOpen"
  241. IsOpenChanged="v => _cpuModalOpen = v"
  242. Value="@_editingCpu"
  243. OnSubmit="HandleCpuSubmit"
  244. OnDelete="HandleCpuDelete"
  245. TestIdPrefix="desktop"/>
  246. <RamModal IsOpen="@_isRamModalOpen"
  247. IsOpenChanged="v => _isRamModalOpen = v"
  248. Value="@Desktop.Ram"
  249. OnSubmit="HandleRamSubmit"
  250. TestIdPrefix="desktop"/>
  251. <DriveModal IsOpen="@_driveModalOpen"
  252. IsOpenChanged="v => _driveModalOpen = v"
  253. Value="@_editingDrive"
  254. OnSubmit="HandleDriveSubmit"
  255. OnDelete="HandleDriveDelete"
  256. TestIdPrefix="desktop"/>
  257. <GpuModal IsOpen="@_gpuModalOpen"
  258. IsOpenChanged="v => _gpuModalOpen = v"
  259. Value="@_editingGpu"
  260. OnSubmit="HandleGpuSubmit"
  261. OnDelete="HandleGpuDelete"
  262. TestIdPrefix="desktop"/>
  263. <NicModal
  264. IsOpen="@_nicModalOpen"
  265. IsOpenChanged="v => _nicModalOpen = v"
  266. Value="@_editingNic"
  267. OnSubmit="HandleNicSubmit"
  268. OnDelete="HandleNicDelete"
  269. TestIdPrefix="desktop-nic"/>
  270. @code {
  271. [Parameter] [EditorRequired] public Desktop Desktop { get; set; } = default!;
  272. #region RAM
  273. private bool _isRamModalOpen;
  274. private void EditRam()
  275. {
  276. _isRamModalOpen = true;
  277. }
  278. private async Task HandleRamSubmit(Ram? value)
  279. {
  280. _isRamModalOpen = false;
  281. await UpdateUseCase.ExecuteAsync(Desktop.Name, Desktop.Model, value?.Size ?? 0, value?.Mts ?? 0);
  282. Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
  283. }
  284. #endregion
  285. #region CPU
  286. bool _cpuModalOpen;
  287. int _editingCpuIndex;
  288. Cpu? _editingCpu;
  289. void OpenAddCpu()
  290. {
  291. _editingCpuIndex = -1;
  292. _editingCpu = null;
  293. _cpuModalOpen = true;
  294. }
  295. void OpenEditCpu(Cpu cpu)
  296. {
  297. _editingCpu = cpu;
  298. Desktop.Cpus ??= new List<Cpu>();
  299. _editingCpuIndex = Desktop.Cpus.IndexOf(cpu);
  300. ;
  301. _cpuModalOpen = true;
  302. }
  303. async Task HandleCpuSubmit(Cpu cpu)
  304. {
  305. Desktop.Cpus ??= new List<Cpu>();
  306. if (_editingCpuIndex < 0)
  307. {
  308. await AddCpuUseCase.ExecuteAsync(Desktop.Name, cpu.Model, cpu.Cores, cpu.Threads);
  309. }
  310. else
  311. {
  312. await UpdateCpuUseCase.ExecuteAsync(Desktop.Name, _editingCpuIndex, cpu.Model, cpu.Cores, cpu.Threads);
  313. }
  314. Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
  315. }
  316. async Task HandleCpuDelete(Cpu cpu)
  317. {
  318. await RemoveCpuUseCase.ExecuteAsync(Desktop.Name, _editingCpuIndex);
  319. Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
  320. }
  321. #endregion
  322. #region Drives
  323. bool _driveModalOpen;
  324. int _editingDriveIndex;
  325. Drive? _editingDrive;
  326. void OpenAddDrive()
  327. {
  328. _editingDriveIndex = -1;
  329. _editingDrive = null;
  330. _driveModalOpen = true;
  331. }
  332. void OpenEditDrive(Drive drive)
  333. {
  334. _editingDrive = drive;
  335. Desktop.Drives ??= new List<Drive>();
  336. _editingDriveIndex = Desktop.Drives.IndexOf(drive);
  337. ;
  338. _driveModalOpen = true;
  339. }
  340. async Task HandleDriveSubmit(Drive drive)
  341. {
  342. Desktop.Drives ??= new List<Drive>();
  343. if (_editingDriveIndex < 0)
  344. {
  345. await AddDriveUseCase.ExecuteAsync(Desktop.Name, drive.Type, drive.Size);
  346. }
  347. else
  348. {
  349. await UpdateDriveUseCase.ExecuteAsync(Desktop.Name, _editingDriveIndex, drive.Type, drive.Size);
  350. }
  351. Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
  352. StateHasChanged();
  353. }
  354. async Task HandleDriveDelete(Drive drive)
  355. {
  356. await RemoveDriveUseCase.ExecuteAsync(Desktop.Name, _editingDriveIndex);
  357. Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
  358. StateHasChanged();
  359. }
  360. #endregion
  361. #region NICs
  362. bool _nicModalOpen;
  363. int _editingNicIndex;
  364. Nic? _editingNic;
  365. void OpenAddNic()
  366. {
  367. _editingNicIndex = -1;
  368. _editingNic = null;
  369. _nicModalOpen = true;
  370. }
  371. void OpenEditNic(Nic nic)
  372. {
  373. Desktop.Nics ??= new List<Nic>();
  374. _editingNicIndex = Desktop.Nics.IndexOf(nic);
  375. _editingNic = nic;
  376. _nicModalOpen = true;
  377. }
  378. async Task HandleNicSubmit(Nic nic)
  379. {
  380. Desktop.Nics ??= new List<Nic>();
  381. if (_editingNicIndex < 0)
  382. {
  383. await AddNicUseCase.ExecuteAsync(
  384. Desktop.Name,
  385. nic.Type,
  386. nic.Speed,
  387. nic.Ports);
  388. }
  389. else
  390. {
  391. await UpdateNicUseCase.ExecuteAsync(
  392. Desktop.Name,
  393. _editingNicIndex,
  394. nic.Type,
  395. nic.Speed,
  396. nic.Ports);
  397. }
  398. Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
  399. }
  400. async Task HandleNicDelete(Nic nic)
  401. {
  402. await RemoveNicUseCase.ExecuteAsync(Desktop.Name, _editingNicIndex);
  403. Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
  404. }
  405. #endregion
  406. #region GPUs
  407. bool _gpuModalOpen;
  408. int _editingGpuIndex;
  409. Gpu? _editingGpu;
  410. void OpenAddGpu()
  411. {
  412. _editingGpuIndex = -1;
  413. _editingGpu = null;
  414. _gpuModalOpen = true;
  415. }
  416. void OpenEditGpu(Gpu gpu)
  417. {
  418. Desktop.Gpus ??= new List<Gpu>();
  419. _editingGpuIndex = Desktop.Gpus.IndexOf(gpu);
  420. _editingGpu = gpu;
  421. _gpuModalOpen = true;
  422. }
  423. async Task HandleGpuSubmit(Gpu gpu)
  424. {
  425. Desktop.Gpus ??= new List<Gpu>();
  426. if (_editingGpuIndex < 0)
  427. {
  428. await AddGpuUseCase.ExecuteAsync(
  429. Desktop.Name,
  430. gpu.Model,
  431. gpu.Vram);
  432. }
  433. else
  434. {
  435. await UpdateGpuUseCase.ExecuteAsync(
  436. Desktop.Name,
  437. _editingGpuIndex,
  438. gpu.Model,
  439. gpu.Vram);
  440. }
  441. Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
  442. }
  443. async Task HandleGpuDelete(Gpu gpu)
  444. {
  445. await RemoveGpuUseCase.ExecuteAsync(Desktop.Name, _editingGpuIndex);
  446. Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
  447. }
  448. #endregion
  449. }
  450. @code {
  451. private bool _confirmDeleteOpen;
  452. [Parameter] public EventCallback<string> OnDeleted { get; set; }
  453. void ConfirmDelete()
  454. {
  455. _confirmDeleteOpen = true;
  456. }
  457. async Task DeleteServer()
  458. {
  459. _confirmDeleteOpen = false;
  460. await DeleteUseCase.ExecuteAsync(Desktop.Name);
  461. if (OnDeleted.HasDelegate)
  462. await OnDeleted.InvokeAsync(Desktop.Name);
  463. }
  464. }
  465. @code
  466. {
  467. bool _renameOpen;
  468. void OpenRename()
  469. {
  470. _renameOpen = true;
  471. }
  472. async Task HandleRenameSubmit(string newName)
  473. {
  474. await RenameUseCase.ExecuteAsync(Desktop.Name, newName);
  475. Nav.NavigateTo($"resources/hardware/{Uri.EscapeDataString(newName)}");
  476. }
  477. }
  478. @code
  479. {
  480. bool _cloneOpen;
  481. void OpenClone()
  482. {
  483. _cloneOpen = true;
  484. }
  485. async Task HandleCloneSubmit(string newName)
  486. {
  487. await CloneUseCase.ExecuteAsync(Desktop.Name, newName);
  488. Nav.NavigateTo($"resources/hardware/{Uri.EscapeDataString(newName)}");
  489. }
  490. }
  491. @code
  492. {
  493. bool _editingNotes;
  494. string? _notesDraft;
  495. void BeginNotesEdit()
  496. {
  497. _editingNotes = true;
  498. _notesDraft = Desktop.Notes; // draft buffer
  499. }
  500. void CancelNotesEdit()
  501. {
  502. _editingNotes = false;
  503. _notesDraft = null; // discard
  504. }
  505. async Task SaveNotes()
  506. {
  507. _editingNotes = false;
  508. await UpdateUseCase.ExecuteAsync(
  509. Desktop.Name,
  510. Desktop.Model,
  511. Desktop.Ram?.Size,
  512. Desktop.Ram?.Mts,
  513. _notesDraft);
  514. Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
  515. _notesDraft = null;
  516. }
  517. }