ServiceCardComponent.razor 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511
  1. @using RackPeek.Domain.Resources.SystemResources
  2. @inject UpdateServiceUseCase UpdateUseCase
  3. @inject IGetResourceByNameUseCase<Service> GetByNameUseCase
  4. @inject IDeleteResourceUseCase<Service> DeleteUseCase
  5. @inject ICloneResourceUseCase<Service> CloneUseCase
  6. @inject IRenameResourceUseCase<Service> RenameUseCase
  7. @inject IGetResourceByNameUseCase<SystemResource> GetSystemByNameUseCase
  8. @inject NavigationManager Nav
  9. <div class="border border-zinc-800 rounded p-4 bg-zinc-900"
  10. data-testid=@($"service-item-{Service.Name.Replace(" ", "-")}")>
  11. <div class="flex justify-between items-center mb-3">
  12. <NavLink href="@($"resources/services/{Uri.EscapeDataString(Service.Name)}")" class="block"
  13. data-testid=@($"service-item-{Service.Name.Replace(" ", "-")}-link")>
  14. <div class="text-zinc-100 hover:text-emerald-300">
  15. @Service.Name
  16. </div>
  17. </NavLink>
  18. <div class="flex gap-3 text-xs">
  19. @if (!_isEditing)
  20. {
  21. <button class="text-zinc-400 hover:text-zinc-200"
  22. data-testid="edit-service-button"
  23. @onclick="BeginEdit">
  24. Edit
  25. </button>
  26. <button class="text-xs text-blue-400 hover:text-blue-300 transition"
  27. title="Rename service"
  28. data-testid="rename-service-button"
  29. @onclick="OpenRename">
  30. Rename
  31. </button>
  32. <button
  33. class="text-xs text-emerald-400 hover:text-emerald-300 transition"
  34. title="Clone service"
  35. data-testid="clone-service-button"
  36. @onclick="OpenClone">
  37. Clone
  38. </button>
  39. <button
  40. class="text-xs text-red-400 hover:text-red-300 transition"
  41. title="Delete server"
  42. data-testid="delete-service-button"
  43. @onclick="ConfirmDelete">
  44. Delete
  45. </button>
  46. }
  47. else
  48. {
  49. <button class="text-emerald-400 hover:text-emerald-300"
  50. data-testid="save-service-button"
  51. @onclick="Save">
  52. Save
  53. </button>
  54. <button class="text-zinc-500 hover:text-zinc-300"
  55. data-testid="cancel-service-button"
  56. @onclick="Cancel">
  57. Cancel
  58. </button>
  59. }
  60. </div>
  61. </div>
  62. <div class="grid grid-cols-1 md:grid-cols-2 gap-3 text-sm">
  63. <!-- IP -->
  64. <div data-testid="service-ip-section">
  65. <div class="text-zinc-400 mb-1">IP</div>
  66. @if (_isEditing)
  67. {
  68. <input
  69. data-testid="service-ip-input"
  70. class="w-full px-3 py-2 rounded-md
  71. bg-zinc-800 text-zinc-100
  72. border border-zinc-600"
  73. @bind="_edit.Ip"/>
  74. }
  75. else if (!string.IsNullOrWhiteSpace(EffectiveIp))
  76. {
  77. <div class="text-zinc-300"
  78. data-testid="service-ip-value">
  79. @EffectiveIp
  80. @if (string.IsNullOrWhiteSpace(Service.Network?.Ip))
  81. {
  82. <span class="text-zinc-500 text-xs ml-2">(inherited)</span>
  83. }
  84. </div>
  85. }
  86. </div>
  87. <!-- Port -->
  88. <div data-testid="service-port-section">
  89. <div class="text-zinc-400 mb-1">Port</div>
  90. @if (_isEditing)
  91. {
  92. <input type="number"
  93. data-testid="service-port-input"
  94. @bind="_edit.Port"/>
  95. }
  96. else if (Service.Network?.Port.HasValue == true)
  97. {
  98. var href = GetBrowsableHref();
  99. if (href is not null)
  100. {
  101. <a href="@href"
  102. data-testid="service-port-value"
  103. target="_blank"
  104. rel="noopener noreferrer"
  105. class="text-emerald-400 hover:text-emerald-300 hover:underline transition">
  106. @Service.Network.Port
  107. </a>
  108. }
  109. else
  110. {
  111. <div class="text-zinc-300" data-testid="service-port-value">
  112. @Service.Network.Port
  113. </div>
  114. }
  115. }
  116. </div>
  117. <!-- Protocol -->
  118. <div data-testid="service-protocol-section">
  119. <div class="text-zinc-400 mb-1">Protocol</div>
  120. @if (_isEditing)
  121. {
  122. <input
  123. data-testid="service-protocol-input"
  124. class="w-full px-3 py-2 rounded-md bg-zinc-800 text-zinc-100 border border-zinc-600"
  125. @bind="_edit.Protocol"/>
  126. }
  127. else if (!string.IsNullOrWhiteSpace(Service.Network?.Protocol))
  128. {
  129. <div class="text-zinc-300"
  130. data-testid="service-protocol-value">
  131. @Service.Network!.Protocol
  132. </div>
  133. }
  134. </div>
  135. <!-- URL -->
  136. <div data-testid="service-url-section">
  137. <div class="text-zinc-400 mb-1">URL</div>
  138. @if (_isEditing)
  139. {
  140. <input
  141. data-testid="service-url-input"
  142. class="w-full px-3 py-2 rounded-md bg-zinc-800 text-zinc-100 border border-zinc-600"
  143. @bind="_edit.Url"/>
  144. }
  145. else if (!string.IsNullOrWhiteSpace(Service.Network?.Url))
  146. {
  147. <a href="@Service.Network!.Url"
  148. data-testid="service-url-value"
  149. target="_blank"
  150. rel="noopener noreferrer"
  151. class="text-emerald-400 hover:underline break-all">
  152. @Service.Network.Url
  153. </a>
  154. }
  155. </div>
  156. <!-- Runs On -->
  157. <div data-testid="service-runson-section">
  158. <div class="text-zinc-400 mb-1">
  159. Runs On
  160. <button
  161. data-testid="service-runson-button"
  162. class="hover:text-emerald-400 pr-4"
  163. title="Add Runs On"
  164. @onclick="() => _selectParentOpen = true">
  165. @("+")
  166. </button>
  167. </div>
  168. @if (_isEditing)
  169. {
  170. @if (Service.RunsOn?.Count > 0)
  171. {
  172. @foreach(var parent in Service.RunsOn)
  173. {
  174. <button
  175. class="hover:text-emerald-400"
  176. title="Edit Runs On"
  177. @onclick="() => _selectParentOpen = true">
  178. @($"{parent}")
  179. </button>
  180. <button
  181. class="text-red-400 hover:text-red-300 pr-4"
  182. title="Remove"
  183. @onclick="() => HandleParentDeleted(parent)">
  184. @($"✕")
  185. </button>
  186. }
  187. }
  188. }
  189. else if (Service.RunsOn?.Count > 0)
  190. {
  191. @foreach(var parent in Service.RunsOn)
  192. {
  193. <NavLink href="@($"resources/systems/{Uri.EscapeDataString(parent)}")"
  194. data-testid="service-runson-link"
  195. class="text-emerald-400 pr-4">
  196. @parent
  197. </NavLink>
  198. }
  199. }
  200. </div>
  201. <ResourceTagEditor Resource="Service"
  202. TestIdPrefix="service" />
  203. <ResourceLabelEditor Resource="Service"
  204. TestIdPrefix="service" />
  205. <div class="md:col-span-2">
  206. <div class="text-zinc-400 mb-1">Notes</div>
  207. @if (_isEditing)
  208. {
  209. <MarkdownEditor
  210. @bind-Value="_edit.Notes"
  211. ShowActionButtons="false"
  212. TestIdPrefix="service-notes-editor" />
  213. }
  214. else
  215. {
  216. <MarkdownViewer
  217. Value="@Service.Notes"
  218. ShowEditButton="false"
  219. TestIdPrefix="service-notes-viewer" />
  220. }
  221. </div>
  222. </div>
  223. </div>
  224. <SystemSelectionModal
  225. IsOpen="@_selectParentOpen"
  226. IsOpenChanged="v => _selectParentOpen = v"
  227. Title="Select a parent"
  228. Value="@SelectedParentName"
  229. OnAccept="HandleParentSelected"/>
  230. <ConfirmModal
  231. IsOpen="_confirmDeleteOpen"
  232. IsOpenChanged="v => _confirmDeleteOpen = v"
  233. Title="Delete service"
  234. ConfirmText="Delete"
  235. ConfirmClass="bg-red-600 hover:bg-red-500"
  236. OnConfirm="DeleteServer" TestIdPrefix="service-delete">
  237. Are you sure you want to delete <strong>@Service.Name</strong>?
  238. </ConfirmModal>
  239. <StringValueModal
  240. IsOpen="_cloneOpen"
  241. IsOpenChanged="v => _cloneOpen = v"
  242. Title="Clone service"
  243. Description="Enter a name for the cloned service"
  244. Label="New service name"
  245. Value="@($"{Service.Name}-copy")"
  246. OnSubmit="HandleCloneSubmit"
  247. TestIdPrefix="service-clone"/>
  248. <StringValueModal
  249. IsOpen="_renameOpen"
  250. IsOpenChanged="v => _renameOpen = v"
  251. Title="Rename service"
  252. Description="Enter a new name for this service"
  253. Label="New service name"
  254. Value="@Service.Name"
  255. OnSubmit="HandleRenameSubmit"
  256. TestIdPrefix="service-rename"/>
  257. @code
  258. {
  259. bool _cloneOpen;
  260. void OpenClone()
  261. {
  262. _cloneOpen = true;
  263. }
  264. async Task HandleCloneSubmit(string newName)
  265. {
  266. await CloneUseCase.ExecuteAsync(Service.Name, newName);
  267. Nav.NavigateTo($"resources/services/{Uri.EscapeDataString(newName)}");
  268. }
  269. }
  270. @code {
  271. [Parameter] [EditorRequired] public Service Service { get; set; } = default!;
  272. [Parameter] public EventCallback<string> OnSave { get; set; }
  273. private bool _isEditing;
  274. private ServiceEditModel _edit = new();
  275. void BeginEdit()
  276. {
  277. _edit = ServiceEditModel.From(Service);
  278. _isEditing = true;
  279. }
  280. async Task Save()
  281. {
  282. _isEditing = false;
  283. await UpdateUseCase.ExecuteAsync(
  284. _edit.Name,
  285. _edit.Ip,
  286. _edit.Port,
  287. _edit.Protocol,
  288. _edit.Url,
  289. _edit.RunsOn,
  290. _edit.Notes
  291. );
  292. await OnSave.InvokeAsync(Service.Name);
  293. await ResolveEffectiveIp();
  294. }
  295. void Cancel()
  296. {
  297. _isEditing = false;
  298. }
  299. bool _selectParentOpen;
  300. string? SelectedParentName;
  301. async Task HandleParentSelected(string? name)
  302. {
  303. SelectedParentName = name;
  304. var runsOn = (_isEditing ? _edit.RunsOn : Service.RunsOn) ?? new List<string>();
  305. runsOn = runsOn.Where(x => !string.IsNullOrWhiteSpace(x)).ToList();
  306. if (!string.IsNullOrWhiteSpace(name) && !runsOn.Contains(name))
  307. runsOn.Add(name);
  308. var ip = _isEditing ? _edit.Ip : Service.Network?.Ip;
  309. var port = _isEditing ? _edit.Port : Service.Network?.Port;
  310. var protocol = _isEditing ? _edit.Protocol : Service.Network?.Protocol;
  311. var url = _isEditing ? _edit.Url : Service.Network?.Url;
  312. var notes = _isEditing ? _edit.Notes : Service.Notes;
  313. await UpdateUseCase.ExecuteAsync(Service.Name, ip, port, protocol, url, runsOn, notes);
  314. // Refresh service from backend (optional, but if you do it, DO NOT nuke the edit buffer)
  315. Service = await GetByNameUseCase.ExecuteAsync(Service.Name);
  316. if (_isEditing)
  317. {
  318. // keep whatever the user typed; just sync RunsOn
  319. _edit.RunsOn = runsOn;
  320. }
  321. else
  322. {
  323. _edit = ServiceEditModel.From(Service);
  324. }
  325. }
  326. async Task HandleParentDeleted(string? name)
  327. {
  328. if (string.IsNullOrWhiteSpace(name))
  329. return;
  330. SelectedParentName = name;
  331. var runsOn = (_isEditing ? _edit.RunsOn : Service.RunsOn) ?? new List<string>();
  332. runsOn = runsOn.Where(x => !string.IsNullOrWhiteSpace(x) && x != name).ToList();
  333. var ip = _isEditing ? _edit.Ip : Service.Network?.Ip;
  334. var port = _isEditing ? _edit.Port : Service.Network?.Port;
  335. var protocol = _isEditing ? _edit.Protocol : Service.Network?.Protocol;
  336. var url = _isEditing ? _edit.Url : Service.Network?.Url;
  337. var notes = _isEditing ? _edit.Notes : Service.Notes;
  338. await UpdateUseCase.ExecuteAsync(Service.Name, ip, port, protocol, url, runsOn, notes);
  339. Service = await GetByNameUseCase.ExecuteAsync(Service.Name);
  340. if (_isEditing)
  341. _edit.RunsOn = runsOn;
  342. else
  343. _edit = ServiceEditModel.From(Service);
  344. }
  345. }
  346. @code {
  347. private bool _confirmDeleteOpen;
  348. [Parameter] public EventCallback<string> OnDeleted { get; set; }
  349. void ConfirmDelete()
  350. {
  351. _confirmDeleteOpen = true;
  352. }
  353. async Task DeleteServer()
  354. {
  355. _confirmDeleteOpen = false;
  356. await DeleteUseCase.ExecuteAsync(Service.Name);
  357. if (OnDeleted.HasDelegate)
  358. await OnDeleted.InvokeAsync(Service.Name);
  359. }
  360. }
  361. @code
  362. {
  363. bool _renameOpen;
  364. void OpenRename()
  365. {
  366. _renameOpen = true;
  367. }
  368. async Task HandleRenameSubmit(string newName)
  369. {
  370. await RenameUseCase.ExecuteAsync(Service.Name, newName);
  371. Nav.NavigateTo($"resources/services/{Uri.EscapeDataString(newName)}");
  372. }
  373. private string? GetBrowsableHref()
  374. {
  375. var ip = Service.Network?.Ip ?? EffectiveIp;
  376. var port = Service.Network?.Port;
  377. if (string.IsNullOrWhiteSpace(ip) || port is null)
  378. return null;
  379. var proto = Service.Network?.Protocol?.Trim().ToLowerInvariant();
  380. var scheme = proto switch
  381. {
  382. "https" => "https",
  383. "http" => "http",
  384. _ => "http"
  385. };
  386. // Build a correct absolute URL
  387. var ub = new UriBuilder(scheme, ip) { Port = port.Value };
  388. return ub.Uri.ToString();
  389. }
  390. }
  391. @code
  392. {
  393. private string? EffectiveIp;
  394. protected override async Task OnParametersSetAsync()
  395. {
  396. await ResolveEffectiveIp();
  397. }
  398. private async Task ResolveEffectiveIp()
  399. {
  400. // If service has its own IP, use it
  401. if (!string.IsNullOrWhiteSpace(Service.Network?.Ip))
  402. {
  403. EffectiveIp = Service.Network!.Ip;
  404. return;
  405. }
  406. // Must have exactly one parent
  407. if (Service.RunsOn?.Count != 1)
  408. {
  409. EffectiveIp = null;
  410. return;
  411. }
  412. var parentName = Service.RunsOn.First();
  413. // Load parent system
  414. var parent = await GetSystemByNameUseCase.ExecuteAsync(parentName);
  415. EffectiveIp = string.IsNullOrWhiteSpace(parent?.Ip)
  416. ? null
  417. : parent.Ip;
  418. }
  419. }