Moonlight-Panel/Servers
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added docker image options to star crud

Browse Source
This commit is contained in:
ChiaraBm
2024-12-06 15:41:05 +01:00
parent de1b54d652
commit c469814782
11 changed files with 356 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
MoonlightServers.Frontend/UI/Components/Stars/Modals/CreateDockerImageModal.razor Normal file
View File

@@ -0,0 +1,58 @@
@using MoonCore.Blazor.Tailwind.Modals.Components
@using MoonlightServers.Shared.Enums
@using MoonlightServers.Frontend.UI.Components.Forms
@using MoonCore.Blazor.Tailwind.Components
@using MoonlightServers.Shared.Http.Requests.Admin.StarDockerImages
@inherits BaseModal
<h1 class="mb-5 font-semibold text-xl">Add a new variable</h1>
<HandleForm @ref="HandleForm" Model="Form" OnValidSubmit="OnValidSubmit">
<div class="grid grid-cols-2 gap-2">
<div class="col-span-2">
<label class="block text-sm font-medium leading-6 text-white">Display Name</label>
<input @bind="Form.DisplayName" type="text" class="form-input w-full"/>
</div>
<div class="col-span-2">
<label class="block text-sm font-medium leading-6 text-white">Identifier</label>
<input @bind="Form.Identifier" type="text" class="form-input w-full"/>
</div>
<div class="col-span-2">
<label class="block text-sm font-medium leading-6 text-white">Automatic pulling</label>
<Switch @bind-Value="Form.AutoPulling"/>
</div>
</div>
</HandleForm>
<div class="mt-5 flex space-x-2">
<WButton OnClick="_ => Hide()" CssClasses="btn btn-secondary grow">Cancel</WButton>
<WButton OnClick="_ => Submit()" CssClasses="btn btn-primary grow">Create</WButton>
</div>
@code
{
[Parameter] public Func<CreateStarDockerImageRequest, Task> OnSubmit { get; set; }
private CreateStarDockerImageRequest Form;
private HandleForm HandleForm;
protected override void OnInitialized()
{
// Set default values
Form = new()
{
AutoPulling = true
};
}
private async Task OnValidSubmit()
{
await OnSubmit.Invoke(Form);
await Hide();
}
private Task Submit() => HandleForm.Submit();
}

0
MoonlightServers.Frontend/UI/Components/Stars/Modals/CreateStarVariableModal.razor → MoonlightServers.Frontend/UI/Components/Stars/Modals/CreateVariableModal.razor
View File

56
MoonlightServers.Frontend/UI/Components/Stars/Modals/UpdateDockerImageModal.razor Normal file
View File

@@ -0,0 +1,56 @@
@using MoonCore.Blazor.Tailwind.Modals.Components
@using MoonlightServers.Frontend.UI.Components.Forms
@using MoonCore.Blazor.Tailwind.Components
@using MoonCore.Helpers
@using MoonlightServers.Shared.Http.Requests.Admin.StarDockerImages
@using MoonlightServers.Shared.Http.Responses.Admin.StarDockerImages
@inherits BaseModal
<h1 class="mb-5 font-semibold text-xl">Update variable</h1>
<HandleForm @ref="HandleForm" Model="Form" OnValidSubmit="OnValidSubmit">
<div class="grid grid-cols-2 gap-2">
<div class="col-span-2">
<label class="block text-sm font-medium leading-6 text-white">Display Name</label>
<input @bind="Form.DisplayName" type="text" class="form-input w-full"/>
</div>
<div class="col-span-2">
<label class="block text-sm font-medium leading-6 text-white">Identifier</label>
<input @bind="Form.Identifier" type="text" class="form-input w-full"/>
</div>
<div class="col-span-2">
<label class="block text-sm font-medium leading-6 text-white">Automatic pulling</label>
<Switch @bind-Value="Form.AutoPulling"/>
</div>
</div>
</HandleForm>
<div class="mt-5 flex space-x-2">
<WButton OnClick="_ => Hide()" CssClasses="btn btn-secondary grow">Cancel</WButton>
<WButton OnClick="_ => Submit()" CssClasses="btn btn-primary grow">Update</WButton>
</div>
@code
{
[Parameter] public Func<UpdateStarDockerImageRequest, Task> OnSubmit { get; set; }
[Parameter] public StarDockerImageDetailResponse DockerImage { get; set; }
private UpdateStarDockerImageRequest Form;
private HandleForm HandleForm;
protected override void OnInitialized()
{
Form = Mapper.Map<UpdateStarDockerImageRequest>(DockerImage);
}
private async Task OnValidSubmit()
{
await OnSubmit.Invoke(Form);
await Hide();
}
private Task Submit() => HandleForm.Submit();
}

0
MoonlightServers.Frontend/UI/Components/Stars/Modals/UpdateStarVariableModel.razor → MoonlightServers.Frontend/UI/Components/Stars/Modals/UpdateVariableModal.razor
View File

110
MoonlightServers.Frontend/UI/Components/Stars/UpdateStarPartials/DockerImageStarUpdate.razor Normal file
View File

@@ -0,0 +1,110 @@
@using MoonCore.Blazor.Tailwind.Alerts
@using MoonCore.Blazor.Tailwind.Components
@using MoonCore.Blazor.Tailwind.Modals
@using MoonCore.Blazor.Tailwind.Toasts
@using MoonCore.Helpers
@using MoonCore.Models
@using MoonlightServers.Frontend.UI.Components.Stars.Modals
@using MoonlightServers.Shared.Http.Requests.Admin.StarDockerImages
@using MoonlightServers.Shared.Http.Responses.Admin.StarDockerImages
@using MoonlightServers.Shared.Http.Responses.Admin.Stars
@inject HttpApiClient ApiClient
@inject ModalService ModalService
@inject ToastService ToastService
@inject AlertService AlertService
<div class="flex justify-end mb-5">
<button type="button" @onclick="AddDockerImage" class="btn btn-primary">Add docker image</button>
</div>
<LazyLoader @ref="LazyLoader" Load="Load">
<div class="grid sm:grid-cols-2 xl:grid-cols-3 gap-4">
@foreach (var dockerImage in DockerImages)
{
<div class="col-span-1 card card-body p-2.5">
<div class="flex items-center justify-between">
<div class="ml-3">
<i class="icon-container text-xl align-middle mr-2"></i>
<span class="align-middle text-lg">@dockerImage.DisplayName</span>
</div>
<div class="gap-x-2">
<button @onclick="() => UpdateDockerImage(dockerImage)" class="btn btn-primary">
<i class="icon-settings text-base"></i>
</button>
<button @onclick="() => DeleteDockerImage(dockerImage)" class="btn btn-danger">
<i class="icon-trash text-base"></i>
</button>
</div>
</div>
</div>
}
</div>
</LazyLoader>
@code
{
[Parameter] public StarDetailResponse Star { get; set; }
private StarDockerImageDetailResponse[] DockerImages;
private LazyLoader LazyLoader;
private async Task Load(LazyLoader _)
{
var pagedVariables = await ApiClient.GetJson<PagedData<StarDockerImageDetailResponse>>(
$"api/admin/servers/stars/{Star.Id}/dockerImages?page=0&pageSize=50"
);
DockerImages = pagedVariables.Items;
}
private async Task AddDockerImage()
{
Func<CreateStarDockerImageRequest, Task> onSubmit = async request =>
{
await ApiClient.Post($"api/admin/servers/stars/{Star.Id}/dockerImages", request);
await ToastService.Success("Successfully created docker image");
await LazyLoader.Reload();
};
await ModalService.Launch<CreateDockerImageModal>(parameters =>
{
parameters.Add("OnSubmit", onSubmit);
});
}
private async Task UpdateDockerImage(StarDockerImageDetailResponse dockerImage)
{
Func<UpdateStarDockerImageRequest, Task> onSubmit = async request =>
{
await ApiClient.Patch($"api/admin/servers/stars/{Star.Id}/dockerImages/{dockerImage.Id}", request);
await ToastService.Success("Successfully updated docker image");
await LazyLoader.Reload();
};
await ModalService.Launch<UpdateDockerImageModal>(parameters =>
{
parameters.Add("OnSubmit", onSubmit);
parameters.Add("DockerImage", dockerImage);
});
}
private async Task DeleteDockerImage(StarDockerImageDetailResponse dockerImage)
{
await AlertService.ConfirmDanger(
"Delete docker image",
"Do you really want to delete the selected docker image? This cannot be undone",
async () =>
{
await ApiClient.Delete($"api/admin/servers/stars/{Star.Id}/dockerImages/{dockerImage.Id}");
await ToastService.Success("Successfully deleted docker image");
await LazyLoader.Reload();
}
);
}
}

2
MoonlightServers.Frontend/UI/Components/Stars/UpdateStarPartials/ParseConfigStarUpdate.razor
View File

@@ -27,7 +27,7 @@ else
<div class="col-span-1 card card-body p-2.5">
<div class="flex items-center justify-between">
<div class="ml-3">
<i class="icon-file-cog text-xl align-middle"></i>
<i class="icon-file-cog text-xl align-middle mr-2"></i>
<span class="align-middle text-lg">@configuration.File</span>
</div>

8
MoonlightServers.Frontend/UI/Components/Stars/UpdateStarPartials/VariablesStarUpdate.razor
View File

@@ -25,7 +25,7 @@
<div class="col-span-1 card card-body p-2.5">
<div class="flex items-center justify-between">
<div class="ml-3">
<i class="icon-variable text-xl align-middle"></i>
<i class="icon-variable text-xl align-middle mr-2"></i>
<span class="align-middle text-lg">@variable.Name</span>
</div>
@@ -70,7 +70,7 @@
await LazyLoader.Reload();
};
await ModalService.Launch<CreateStarVariableModal>(parameters =>
await ModalService.Launch<CreateVariableModal>(parameters =>
{
parameters.Add("OnSubmit", onSubmit);
}, "max-w-xl");
@@ -86,7 +86,7 @@
await LazyLoader.Reload();
};
await ModalService.Launch<UpdateStarVariableModel>(parameters =>
await ModalService.Launch<UpdateVariableModal>(parameters =>
{
parameters.Add("OnSubmit", onSubmit);
parameters.Add("Variable", variable);
@@ -106,7 +106,5 @@
await LazyLoader.Reload();
}
);
await InvokeAsync(StateHasChanged);
}
}

4
MoonlightServers.Frontend/UI/Views/Admin/Stars/Update.razor
View File

@@ -47,6 +47,10 @@
<Tab Name="Variables">
<VariablesStarUpdate Star="Detail" />
</Tab>
<Tab Name="Docker Images">
<DockerImageStarUpdate Star="Detail" />
</Tab>
</Tabs>
</HandleForm>