Files
Moonlight/Moonlight.Client/UI/Views/Admin/Api/Index.razor

105 lines
3.9 KiB
Plaintext

@page "/admin/api"
@using MoonCore.Helpers
@using MoonCore.Models
@using MoonCore.Blazor.Tailwind.Dt
@using Moonlight.Shared.Http.Responses.Admin.ApiKeys
@inject HttpApiClient ApiClient
@inject AlertService AlertService
@inject ToastService ToastService
<div class="grid grid-cols-1 sm:grid-cols-3 mb-8 gap-x-3 gap-y-2 sm:gap-y-0">
<div class="col-span-1 card card-body border-l-4 border-primary-500">
<p class="font-medium tracking-wide text-slate-100">
API Documentation
</p>
<a href="/api/swagger" target="_blank" class="mt-2 flex items-center justify-between text-primary-500">
<div class="font-medium">Open</div>
<div>
<i class="bi bi-box-arrow-up-right text-lg text-primary-500"></i>
</div>
</a>
</div>
<div class="col-span-1 card card-body border-l-4 border-tertiary-500">
<p class="font-medium tracking-wide text-slate-100">
Learn about the api usage
</p>
<a href="https://help.moonlightpanel.xyz" target="_blank" class="mt-2 flex items-center justify-between text-primary-500">
<div class="font-medium">Open</div>
<div>
<i class="bi bi-box-arrow-up-right text-lg text-tertiary-500"></i>
</div>
</a>
</div>
<div class="col-span-1 card card-body border-l-4 border-success-500">
<p class="font-medium tracking-wide text-slate-100">
Open API Specification
</p>
<a href="/api/swagger/main" target="_blank" class="mt-2 flex items-center justify-between text-primary-500">
<div class="font-medium">Open</div>
<div>
<i class="bi bi-box-arrow-up-right text-lg text-success-500"></i>
</div>
</a>
</div>
</div>
<div class="mb-5 flex justify-end">
<a href="/admin/api/create" class="btn btn-primary">
Create
</a>
</div>
<DataTable @ref="Table" TItem="ApiKeyDetailResponse">
<Configuration>
<Pagination TItem="ApiKeyDetailResponse" ItemSource="LoadData" />
<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/@(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 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)
{
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");
await Table.Refresh();
}
);
}
}