Updated mooncore dependency usage

2025-02-05 14:08:40 +01:00
parent bf5a744499
commit b6b488edf6
14 changed files with 387 additions and 105 deletions
--- a/Moonlight.Client/Moonlight.Client.csproj
+++ b/Moonlight.Client/Moonlight.Client.csproj
@@ -27,7 +27,7 @@
        <PackageReference Include="MoonCore" Version="1.8.2" />
        <PackageReference Include="MoonCore.Blazor" Version="1.2.8" />
        <PackageReference Include="MoonCore.PluginFramework" Version="1.0.5"/>
-        <PackageReference Include="MoonCore.Blazor.Tailwind" Version="1.2.9" />
+        <PackageReference Include="MoonCore.Blazor.Tailwind" Version="1.3.0" />
    </ItemGroup>

    <!-- 
--- a/Moonlight.Client/Styles/mappings/mooncore.map
+++ b/Moonlight.Client/Styles/mappings/mooncore.map
@@ -304,6 +304,7 @@
  "px-5",
  "px-6",
  "py-1",
+  "py-1.5",
  "py-10",
  "py-2",
  "py-3",
--- a/Moonlight.Client/UI/Views/Admin/Api/Create.razor
+++ b/Moonlight.Client/UI/Views/Admin/Api/Create.razor
@@ -0,0 +1,70 @@
+@page "/admin/api/create"
+
+@using MoonCore.Helpers
+@using Moonlight.Shared.Http.Requests.Admin.ApiKeys
+@using Moonlight.Shared.Http.Responses.Admin.ApiKeys
+
+@inject HttpApiClient ApiClient
+@inject NavigationManager Navigation
+@inject ToastService ToastService
+@inject AlertService AlertService
+
+<PageHeader Title="Create API Key">
+    <a href="/admin/api" class="btn btn-secondary">
+        <i class="icon-chevron-left mr-1"></i>
+        Back
+    </a>
+    <WButton OnClick="_ => Form.Submit()" CssClasses="btn btn-primary">
+        <i class="icon-check mr-1"></i>
+        Create
+    </WButton>
+</PageHeader>
+
+<div class="mt-5">
+    <HandleForm @ref="Form" Model="Request" OnValidSubmit="OnSubmit">
+        <div class="grid grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6">
+            <div class="sm:col-span-2">
+                <label class="block text-sm font-medium leading-6 text-white">Description</label>
+                <div class="mt-2">
+                    <input @bind="Request.Description" type="text" autocomplete="off" class="form-input w-full">
+                </div>
+            </div>
+            <div class="sm:col-span-2">
+                <label class="block text-sm font-medium leading-6 text-white">Permissions</label>
+                <div class="mt-2">
+                    <input @bind="Request.PermissionsJson" type="email" autocomplete="off" class="form-input w-full">
+                </div>
+            </div>
+            <div class="sm:col-span-2">
+                <label class="block text-sm font-medium leading-6 text-white">Expires at</label>
+                <div class="mt-2">
+                    <input @bind="Request.ExpiresAt" type="datetime" autocomplete="off" class="form-input w-full">
+                </div>
+            </div>
+        </div>
+    </HandleForm>
+</div>
+
+@code
+{
+    private HandleForm Form;
+    private CreateApiKeyRequest Request;
+
+    protected override void OnInitialized()
+    {
+        Request = new();
+    }
+
+    private async Task OnSubmit()
+    {
+        var response = await ApiClient.PostJson<CreateApiKeyResponse>("api/admin/apikeys", Request);
+
+        await AlertService.Success(
+            "API Key successfully created",
+            $"Copy the following secret. It wont be shown again. '{response.Secret}'"
+        );
+
+        await ToastService.Success("Successfully created api key");
+        Navigation.NavigateTo("/admin/api");
+    }
+}
--- a/Moonlight.Client/UI/Views/Admin/Api/Index.razor
+++ b/Moonlight.Client/UI/Views/Admin/Api/Index.razor
@@ -1,15 +1,13 @@
@page "/admin/api"
-@*
-@using MoonCore.Attributes
+
@using MoonCore.Helpers
@using MoonCore.Models
-@using Moonlight.Shared.Http.Requests.Admin.ApiKeys
+@using MoonCore.Blazor.Tailwind.Dt
@using Moonlight.Shared.Http.Responses.Admin.ApiKeys

-@attribute [RequirePermission("admin.apikeys.read")]
-
-@inject HttpApiClient HttpApiClient
+@inject HttpApiClient ApiClient
@inject AlertService AlertService
+@inject ToastService ToastService

 <div class="grid grid-cols-1 sm:grid-cols-3 mb-8 gap-x-3">
    <div class="col-span-1 card card-body border-l-4 border-primary-500">
@@ -49,63 +47,57 @@
    </div>
 </div>

-<Crud TItem="ApiKeyDetailResponse"
-      TCreateForm="CreateApiKeyRequest"
-      TUpdateForm="UpdateApiKeyRequest"
-      OnConfigure="OnConfigure">
-    <View>
-        <Column TItem="ApiKeyDetailResponse" Field="@(x => x.Id)" Title="Id"/>
-        <Column TItem="ApiKeyDetailResponse" Field="@(x => x.Description)" Title="Description"/>
-        <Column TItem="ApiKeyDetailResponse" Field="@(x => x.ExpiresAt)" Title="Expires at">
-            <Template>
-                @Formatter.FormatDate(context.ExpiresAt)
-            </Template>
-        </Column>
-    </View>
-</Crud>
+<div class="mb-5 flex justify-end">
+    <a href="/admin/api/create" class="btn btn-primary">
+        Create
+    </a>
+</div>
+
+<DataTable @ref="Table" TItem="ApiKeyDetailResponse" PageSize="15" LoadItemsPaginatedAsync="LoadData">
+    <Configuration>
+        <DataTableColumn TItem="ApiKeyDetailResponse" Field="@(x => x.Id)" Name="Id" />
+        <DataTableColumn TItem="ApiKeyDetailResponse" Field="@(x => x.Description)" Name="Description" />
+        <DataTableColumn TItem="ApiKeyDetailResponse" Field="@(x => x.ExpiresAt)" Name="Expires at">
+            <ColumnTemplate>
+                @(Formatter.FormatDate(context.ExpiresAt))
+            </ColumnTemplate>
+        </DataTableColumn>
+        <DataTableColumn TItem="ApiKeyDetailResponse">
+            <ColumnTemplate>
+                <div class="flex justify-end">
+                    <a href="/admin/api/update/@(context.Id)" class="text-primary-500 mr-2 sm:mr-3">
+                        <i class="icon-pencil text-base"></i>
+                    </a>
+
+                    <a href="#" @onclick="() => Delete(context)" @onclick:preventDefault
+                       class="text-danger-500">
+                        <i class="icon-trash text-base"></i>
+                    </a>
+                </div>
+            </ColumnTemplate>
+        </DataTableColumn>
+    </Configuration>
+</DataTable>

@code
 {
-    private void OnConfigure(CrudOptions<ApiKeyDetailResponse, CreateApiKeyRequest, UpdateApiKeyRequest> crudOptions)
+    private DataTable<ApiKeyDetailResponse> Table;
+    
+    private async Task<IPagedData<ApiKeyDetailResponse>> LoadData(PaginationOptions options)
+     => await ApiClient.GetJson<PagedData<ApiKeyDetailResponse>>($"api/admin/apikeys?page={options.Page}&pageSize={options.PerPage}");
+
+    private async Task Delete(ApiKeyDetailResponse apiKeyDetailResponse)
    {
-        crudOptions.ItemName = "API Key";
+        await AlertService.ConfirmDanger(
+            "API Key deletion",
+            $"Do you really want to delete the api key '{apiKeyDetailResponse.Description}'",
+            async () =>
+            {
+                await ApiClient.Delete($"api/admin/apikeys/{apiKeyDetailResponse.Id}");
+                await ToastService.Success("Successfully deleted api key");

-        crudOptions.ItemLoader = async (page, pageSize)
-            => await HttpApiClient.GetJson<PagedData<ApiKeyDetailResponse>>($"api/admin/apikeys?page={page}&pageSize={pageSize}");
-
-        crudOptions.SingleItemLoader = async id
-            => await HttpApiClient.GetJson<ApiKeyDetailResponse>($"api/admin/apikeys/{id}");
-
-        crudOptions.QueryIdentifier = response => response.Id.ToString();
-
-        crudOptions.OnCreate = async request =>
-        {
-            var response = await HttpApiClient.PostJson<CreateApiKeyResponse>("api/admin/apikeys", request);
-
-            await AlertService.Success(
-                "API Key successfully created",
-                $"Copy the following secret. It wont be shown again. '{response.Secret}'"
-            );
-        };
-
-        crudOptions.OnUpdate = async (item, request)
-            => await HttpApiClient.Patch($"api/admin/apikeys/{item.Id}", request);
-
-        crudOptions.OnDelete = async item
-            => await HttpApiClient.Delete($"api/admin/apikeys/{item.Id}");
-
-        crudOptions.OnConfigureCreate = configuration =>
-        {
-            configuration.WithField(x => x.Description);
-            configuration.WithField(x => x.PermissionsJson);
-            configuration.WithField(x => x.ExpiresAt, fieldConfiguration => { fieldConfiguration.DefaultValue = DateTime.UtcNow.AddMonths(1); });
-        };
-
-        crudOptions.OnConfigureUpdate = (_, configuration) =>
-        {
-            configuration.WithField(x => x.Description);
-            configuration.WithField(x => x.PermissionsJson);
-            configuration.WithField(x => x.ExpiresAt);
-        };
+                await Table.Refresh();
+            }
+        );
    }
-}*@
+}
--- a/Moonlight.Client/UI/Views/Admin/Api/Update.razor
+++ b/Moonlight.Client/UI/Views/Admin/Api/Update.razor
@@ -0,0 +1,69 @@
+@page "/admin/api/update/{Id:int}"
+
+@using MoonCore.Helpers
+@using Moonlight.Shared.Http.Requests.Admin.ApiKeys
+@using Moonlight.Shared.Http.Responses.Admin.ApiKeys
+
+@inject HttpApiClient ApiClient
+@inject NavigationManager Navigation
+@inject ToastService ToastService
+
+<LazyLoader Load="Load">
+    <PageHeader Title="Update API Key">
+        <a href="/admin/api" class="btn btn-secondary">
+            <i class="icon-chevron-left mr-1"></i>
+            Back
+        </a>
+        <WButton OnClick="_ => Form.Submit()" CssClasses="btn btn-primary">
+            <i class="icon-check mr-1"></i>
+            Update
+        </WButton>
+    </PageHeader>
+
+    <div class="mt-5">
+        <HandleForm @ref="Form" Model="Request" OnValidSubmit="OnSubmit">
+            <div class="grid grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6">
+                <div class="sm:col-span-2">
+                    <label class="block text-sm font-medium leading-6 text-white">Description</label>
+                    <div class="mt-2">
+                        <input @bind="Request.Description" type="text" autocomplete="off" class="form-input w-full">
+                    </div>
+                </div>
+                <div class="sm:col-span-2">
+                    <label class="block text-sm font-medium leading-6 text-white">Permissions</label>
+                    <div class="mt-2">
+                        <input @bind="Request.PermissionsJson" type="email" autocomplete="off" class="form-input w-full">
+                    </div>
+                </div>
+                <div class="sm:col-span-2">
+                    <label class="block text-sm font-medium leading-6 text-white">Expires at</label>
+                    <div class="mt-2">
+                        <input @bind="Request.ExpiresAt" type="datetime" autocomplete="off" class="form-input w-full">
+                    </div>
+                </div>
+            </div>
+        </HandleForm>
+    </div>
+</LazyLoader>
+
+@code
+{
+    [Parameter] public int Id { get; set; }
+
+    private HandleForm Form;
+    private UpdateApiKeyRequest Request;
+
+    private async Task Load(LazyLoader _)
+    {
+        var detail = await ApiClient.GetJson<ApiKeyDetailResponse>($"api/admin/apikeys/{Id}");
+        Request = Mapper.Map<UpdateApiKeyRequest>(detail);
+    }
+
+    private async Task OnSubmit()
+    {
+        await ApiClient.Patch($"api/admin/apikeys/{Id}", Request);
+
+        await ToastService.Success("Successfully updated api key");
+        Navigation.NavigateTo("/admin/api");
+    }
+}
--- a/Moonlight.Client/UI/Views/Admin/Users/Create.razor
+++ b/Moonlight.Client/UI/Views/Admin/Users/Create.razor
@@ -22,25 +22,25 @@
    <HandleForm @ref="Form" Model="Request" OnValidSubmit="OnSubmit">
        <div class="grid grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6">
            <div class="sm:col-span-2">
-                <label class="block text-sm font-medium leading-6 text-white">Name</label>
+                <label class="block text-sm font-medium leading-6 text-white">Username</label>
                <div class="mt-2">
                    <input @bind="Request.Username" type="text" autocomplete="off" class="form-input w-full">
                </div>
            </div>
            <div class="sm:col-span-2">
-                <label class="block text-sm font-medium leading-6 text-white">Version</label>
+                <label class="block text-sm font-medium leading-6 text-white">Email</label>
                <div class="mt-2">
                    <input @bind="Request.Email" type="email" autocomplete="off" class="form-input w-full">
                </div>
            </div>
            <div class="sm:col-span-2">
-                <label class="block text-sm font-medium leading-6 text-white">Author</label>
+                <label class="block text-sm font-medium leading-6 text-white">Password</label>
                <div class="mt-2">
                    <input @bind="Request.Password" type="password" autocomplete="off" class="form-input w-full">
                </div>
            </div>
            <div class="sm:col-span-2">
-                <label class="block text-sm font-medium leading-6 text-white">Donate Url</label>
+                <label class="block text-sm font-medium leading-6 text-white">Permissions</label>
                <div class="mt-2">
                    <input @bind="Request.PermissionsJson" type="text" autocomplete="off" class="form-input w-full">
                </div>
@@ -61,9 +61,9 @@

    private async Task OnSubmit()
    {
-        await ApiClient.Post("api/users", Request);
+        await ApiClient.Post("api/admin/users", Request);

-        await ToastService.Success("Successfully created User");
+        await ToastService.Success("Successfully created user");
        Navigation.NavigateTo("/admin/users");
    }
 }
--- a/Moonlight.Client/UI/Views/Admin/Users/Index.razor
+++ b/Moonlight.Client/UI/Views/Admin/Users/Index.razor
@@ -9,26 +9,34 @@
@inject AlertService AlertService
@inject ToastService ToastService

-<PageHeader Title="Users" />
+<div class="mb-5">
+    <PageHeader Title="Users">
+        <a href="/admin/api/create" class="btn btn-primary">
+            Create
+        </a>
+    </PageHeader>
+</div>

 <DataTable @ref="Table" TItem="UserDetailResponse" PageSize="15" LoadItemsPaginatedAsync="LoadData">
-    <DataTableColumn TItem="UserDetailResponse" Field="@(x => x.Id)" Name="Id" />
-    <DataTableColumn TItem="UserDetailResponse" Field="@(x => x.Username)" Name="Username" />
-    <DataTableColumn TItem="UserDetailResponse" Field="@(x => x.Email)" Name="Email" />
-    <DataTableColumn TItem="UserDetailResponse">
-        <ColumnTemplate>
-            <div class="flex justify-end">
-                <a href="/admin/users/update/@(context.Id)" class="text-primary-500 mr-2 sm:mr-3">
-                    <i class="icon-pencil text-base"></i>
-                </a>
+    <Configuration>
+        <DataTableColumn TItem="UserDetailResponse" Field="@(x => x.Id)" Name="Id" />
+        <DataTableColumn TItem="UserDetailResponse" Field="@(x => x.Username)" Name="Username" />
+        <DataTableColumn TItem="UserDetailResponse" Field="@(x => x.Email)" Name="Email" />
+        <DataTableColumn TItem="UserDetailResponse">
+            <ColumnTemplate>
+                <div class="flex justify-end">
+                    <a href="/admin/users/update/@(context.Id)" class="text-primary-500 mr-2 sm:mr-3">
+                        <i class="icon-pencil text-base"></i>
+                    </a>

-                <a href="#" @onclick="() => Delete(context)" @onclick:preventDefault
-                   class="text-danger-500">
-                    <i class="icon-trash text-base"></i>
-                </a>
-            </div>
-        </ColumnTemplate>
-    </DataTableColumn>
+                    <a href="#" @onclick="() => Delete(context)" @onclick:preventDefault
+                       class="text-danger-500">
+                        <i class="icon-trash text-base"></i>
+                    </a>
+                </div>
+            </ColumnTemplate>
+        </DataTableColumn>
+    </Configuration>
 </DataTable>

@code
--- a/Moonlight.Client/UI/Views/Admin/Users/Update.razor
+++ b/Moonlight.Client/UI/Views/Admin/Users/Update.razor
@@ -1,4 +1,4 @@
-@page "/users/update/{Id:int}"
+@page "/admin/users/update/{Id:int}"

@using MoonCore.Helpers
@using Moonlight.Shared.Http.Requests.Admin.Users
@@ -24,19 +24,19 @@
        <HandleForm @ref="Form" Model="Request" OnValidSubmit="OnSubmit">
            <div class="grid grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-6">
                <div class="sm:col-span-2">
-                    <label class="block text-sm font-medium leading-6 text-white">Name</label>
+                    <label class="block text-sm font-medium leading-6 text-white">Username</label>
                    <div class="mt-2">
                        <input @bind="Request.Username" type="text" autocomplete="off" class="form-input w-full">
                    </div>
                </div>
                <div class="sm:col-span-2">
-                    <label class="block text-sm font-medium leading-6 text-white">Version</label>
+                    <label class="block text-sm font-medium leading-6 text-white">Email</label>
                    <div class="mt-2">
                        <input @bind="Request.Email" type="email" autocomplete="off" class="form-input w-full">
                    </div>
                </div>
                <div class="sm:col-span-2">
-                    <label class="block text-sm font-medium leading-6 text-white">Author</label>
+                    <label class="block text-sm font-medium leading-6 text-white">Password</label>
                    <div class="mt-2">
                        <input @bind="Request.Password" type="password" autocomplete="off" class="form-input w-full">
                    </div>
@@ -55,7 +55,7 @@

    private async Task Load(LazyLoader _)
    {
-        var detail = await ApiClient.GetJson<UserDetailResponse>($"api/users/{Id}");
+        var detail = await ApiClient.GetJson<UserDetailResponse>($"api/admin/users/{Id}");
        Request = Mapper.Map<UpdateUserRequest>(detail);
    }

@@ -63,7 +63,7 @@
    {
        await ApiClient.Patch($"api/admin/users/{Id}", Request);

-        await ToastService.Success("Successfully updated User");
+        await ToastService.Success("Successfully updated user");
        Navigation.NavigateTo("/admin/users");
    }
 }