DesktopCardComponent.razor 18 KB

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