Merge pull request #68 from Moonlight-Panel/SharedDomainPageRedesign

redesigned shared domains screen | split in view/add

Moonlight/Shared/Views/Admin/Domains/Shared.razor

@@ -1,126 +0,0 @@
-@page "/admin/domains/shared"
-@using Moonlight.App.Repositories.Domains
-@using Moonlight.App.Services
-@using CloudFlare.Client.Api.Zones
-@using Moonlight.App.Database.Entities
-@using Moonlight.App.Services.Interop
-
-@inject SharedDomainRepository SharedDomainRepository
-@inject SmartTranslateService SmartTranslateService
-@inject DomainService DomainService
-@inject AlertService AlertService
-@inject ToastService ToastService
-
-<OnlyAdmin>
-    <LazyLoader @ref="LazyLoader" Load="Load">
-        <div class="row mb-5">
-            <div class="card card-body">
-                <div class="mb-5">
-                    <label class="form-label">
-                        <TL>Domain</TL>
-                    </label>
-                    <select @bind="DomainId" class="form-select">
-                        @if (Zones.Any())
-                        {
-                            foreach (var zone in Zones)
-                            {
-                                <option value="@(zone.Id)">@(zone.Name)</option>
-                            }
-                        }
-                        else
-                        {
-                            <option value="">
-                                <TL>No domains available</TL>
-                            </option>
-                        }
-                    </select>
-                </div>
-                <WButton Text="@(SmartTranslateService.Translate("Add"))"
-                         WorkingText="@(SmartTranslateService.Translate("Adding"))"
-                         CssClasses="btn-success"
-                         OnClick="Add">
-                </WButton>
-            </div>
-        </div>
-        @foreach (var sharedDomain in SharedDomains)
-        {
-            <div class="row mb-5">
-            <div class="card card-body">
-                <div class="d-flex flex-row justify-content-between align-items-center">
-                    <div class="p-2">
-                        <i class="text-primary bx bx-purchase-tag bx-md"></i>
-                    </div>
-                    <div class="p-2">
-                        <span>@(sharedDomain.Name)</span>
-                    </div>
-                    <div class="p-2">
-                        <span>@(sharedDomain.Id)</span>
-                    </div>
-                    <div class="p-2">
-                        <WButton Text="@(SmartTranslateService.Translate("Delete"))"
-                                 WorkingText="@(SmartTranslateService.Translate("Deleting"))"
-                                 CssClasses="btn-danger"
-                                 OnClick="() => Delete(sharedDomain)">
-                        </WButton>
-                    </div>
-                </div>
-            </div>
-            </div>
-        }
-    </LazyLoader>
-</OnlyAdmin>
-
-@code
-{
-    private string DomainId = "";
-    private Zone[] Zones;
-    private SharedDomain[] SharedDomains;
-
-    private LazyLoader LazyLoader;
-
-    private async Task Load(LazyLoader lazyLoader)
-    {
-        Zones = await DomainService.GetAvailableDomains();
-
-        SharedDomains = SharedDomainRepository.Get().ToArray();
-    }
-
-    private async Task Add()
-    {
-        if(string.IsNullOrEmpty(DomainId))
-            return;
-
-        var domain = Zones.First(x => x.Id == DomainId);
-
-        var sd = new SharedDomain()
-        {
-            CloudflareId = domain.Id,
-            Name = domain.Name
-        };
-
-        SharedDomainRepository.Add(sd);
-        await ToastService.Success(SmartTranslateService.Translate("Shared domain successfully added"));
-
-        await LazyLoader.Reload();
-    }
-
-    private async Task Delete(SharedDomain sharedDomain)
-    {
-        try
-        {
-            SharedDomainRepository.Delete(sharedDomain);
-            await ToastService.Success(SmartTranslateService.Translate("Shared domain successfully deleted"));
-
-            await LazyLoader.Reload();
-        }
-        catch (Exception e)
-        {
-            //TODO: Add check if any domains are left
-            
-            await AlertService.Error(
-                SmartTranslateService.Translate("Error"),
-                SmartTranslateService.Translate("Something went wrong. Are any domains associated with this shared domain still there?")
-            );
-        }
-    }
-}

Moonlight/Shared/Views/Admin/Domains/Shared/Index.razor

@@ -0,0 +1,83 @@
+@page "/admin/domains/shared"
+@using Moonlight.App.Repositories.Domains
+@using Moonlight.App.Services
+@using CloudFlare.Client.Api.Zones
+@using Moonlight.App.Database.Entities
+@using Moonlight.App.Services.Interop
+@using BlazorTable
+
+@inject SharedDomainRepository SharedDomainRepository
+@inject SmartTranslateService SmartTranslateService
+@inject DomainService DomainService
+@inject AlertService AlertService
+@inject ToastService ToastService
+
+<OnlyAdmin>
+    <LazyLoader @ref="LazyLoader" Load="Load">
+        <div class="card">
+            <div class="card-header border-0 pt-5">
+                <h3 class="card-title align-items-start flex-column">
+                    <span class="card-label fw-bold fs-3 mb-1">
+                        <span><TL>Shared domains</TL></span>
+                    </span>
+                </h3>
+                <div class="card-toolbar">
+                    <a href="/admin/domains/shared/new" class="btn btn-sm btn-light-success">
+                        <i class="bx bx-layer-plus"></i>
+                        <span><TL>Add shared domain</TL></span>
+                    </a>
+                </div>
+            </div>
+            <div class="card-body">
+                <Table TableItem="SharedDomain" Items="SharedDomains" PageSize="25" TableClass="table table-row-bordered table-row-gray-100 align-middle gs-0 gy-3" TableHeadClass="fw-bold text-muted">
+                    <Column TableItem="SharedDomain" Title="@(SmartTranslateService.Translate("Id"))" Field="@(x => x.Id)" Sortable="true" Filterable="true" Width="10%"/>
+                    <Column TableItem="SharedDomain" Title="@(SmartTranslateService.Translate("Name"))" Field="@(x => x.Name)" Sortable="true" Filterable="true" Width="10%"/>
+                    <Column TableItem="SharedDomain" Title="" Field="@(x => x.Id)" Sortable="false" Filterable="false" Width="10%">
+                        <Template>
+                            <DeleteButton Confirm="true"
+                                          AdditionalCssClasses="float-end"
+                                          OnClick="() => Delete(context)">
+                            </DeleteButton>
+                        </Template>
+                    </Column>
+                </Table>
+            </div>
+        </div>
+    </LazyLoader>
+</OnlyAdmin>
+
+@code
+{
+    private string DomainId = "";
+    private Zone[] Zones;
+    private SharedDomain[] SharedDomains;
+
+    private LazyLoader LazyLoader;
+
+    private async Task Load(LazyLoader lazyLoader)
+    {
+        Zones = await DomainService.GetAvailableDomains();
+
+        SharedDomains = SharedDomainRepository.Get().ToArray();
+    }
+
+    private async Task Delete(SharedDomain sharedDomain)
+    {
+        try
+        {
+            SharedDomainRepository.Delete(sharedDomain);
+            await ToastService.Success(SmartTranslateService.Translate("Shared domain successfully deleted"));
+
+            await LazyLoader.Reload();
+        }
+        catch (Exception e)
+        {
+            //TODO: Add check if any domains are left
+            
+            await AlertService.Error(
+                SmartTranslateService.Translate("Error"),
+                SmartTranslateService.Translate("Something went wrong. Are any domains associated with this shared domain still there?")
+            );
+        }
+    }
+}

Moonlight/Shared/Views/Admin/Domains/Shared/New.razor

@@ -0,0 +1,83 @@
+@page "/admin/domains/shared/new"
+
+@using Moonlight.App.Services
+@using Moonlight.App.Services.Interop
+@using Moonlight.App.Repositories.Domains
+@using CloudFlare.Client.Api.Zones
+@using Moonlight.App.Database.Entities
+
+@inject SharedDomainRepository SharedDomainRepository
+@inject SmartTranslateService SmartTranslateService
+@inject DomainService DomainService
+@inject ToastService ToastService
+@inject NavigationManager NavigationManager
+
+<LazyLoader Load="Load" @ref="LazyLoader">
+    <div class="row mb-5">
+        <div class="card card-body">
+            <div class="mx-4 mt-4 mb-6">               
+                <div class="mb-4">
+                    <label class="form-label">
+                        <TL>Domain</TL>
+                    </label>
+                    <select @bind="DomainId" class="form-select">
+                        @if (Zones.Any())
+                        {
+                            foreach (var zone in Zones)
+                            {
+                                <option value="@(zone.Id)">@(zone.Name)</option>
+                            }
+                        }
+                        else
+                        {
+                            <option value="">
+                                <TL>No domains available</TL>
+                            </option>
+                        }
+                    </select>
+                </div>
+                <div class="float-end">
+                    <WButton Text="@(SmartTranslateService.Translate("Add"))"
+                             WorkingText="@(SmartTranslateService.Translate("Adding"))"
+                             CssClasses="btn-success float-end"
+                             OnClick="Add">
+                    </WButton>
+                </div>
+            </div>
+        </div>
+    </div>    
+</LazyLoader>
+
+@code {
+    private string DomainId = "";
+    private Zone[] Zones;
+    private SharedDomain[] SharedDomains;
+
+    private LazyLoader LazyLoader;
+
+    private async Task Load(LazyLoader lazyLoader)
+    {
+        Zones = await DomainService.GetAvailableDomains();
+
+        SharedDomains = SharedDomainRepository.Get().ToArray();
+    }
+    
+    private async Task Add()
+    {
+        if(string.IsNullOrEmpty(DomainId))
+            return;
+
+        var domain = Zones.First(x => x.Id == DomainId);
+
+        var sd = new SharedDomain()
+        {
+            CloudflareId = domain.Id,
+            Name = domain.Name
+        };
+
+        SharedDomainRepository.Add(sd);
+        await ToastService.Success(SmartTranslateService.Translate("Shared domain successfully added"));
+
+        NavigationManager.NavigateTo("/admin/domains/shared");
+    }
+}