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

Minor design improvements to user table and diagnose page

Browse Source
This commit is contained in:
ChiaraBm
2025-12-30 16:06:18 +01:00
parent ba942b2f8f
commit 170cac2091
2 changed files with 115 additions and 107 deletions
Download Patch File Download Diff File Expand all files Collapse all files

220
Moonlight.Frontend/UI/Admin/Views/Sys/Diagnose.razor
View File

@@ -48,18 +48,22 @@
</Card> </Card>
</div> </div>
<div class="col-span-1"> <div class="col-span-1">
<Card> @if (IsLoading)
<CardContent ClassName="flex justify-center items-center"> {
@if (IsLoading) <Card>
{ <CardContent ClassName="flex justify-center items-center">
<Spinner ClassName="size-10"/> <Spinner ClassName="size-10"/>
} </CardContent>
else </Card>
}
else
{
if (HasDiagnosed)
{
if (Entries.Length == 0)
{ {
if (HasDiagnosed) <Card>
{ <CardContent ClassName="flex justify-center items-center">
if (Entries.Length == 0)
{
<Empty> <Empty>
<EmptyHeader> <EmptyHeader>
<EmptyMedia Variant="EmptyMediaVariant.Icon"> <EmptyMedia Variant="EmptyMediaVariant.Icon">
@@ -71,123 +75,127 @@
</EmptyDescription> </EmptyDescription>
</EmptyHeader> </EmptyHeader>
</Empty> </Empty>
} </CardContent>
else </Card>
}
else
{
<Accordion
ClassName="w-full"
Type="AccordionType.Single">
@for (var i = 0; i < Entries.Length; i++)
{ {
<Accordion var entry = Entries[i];
ClassName="w-full"
Type="AccordionType.Single">
@for (var i = 0; i < Entries.Length; i++) var textColor = entry.Level switch
{ {
var entry = Entries[i]; DiagnoseLevel.Error => "text-destructive",
DiagnoseLevel.Warning => "text-yellow-400",
DiagnoseLevel.Healthy => "text-green-500"
};
var textColor = entry.Level switch <AccordionItem
{ ClassName="overflow-hidden border bg-card px-4 first:rounded-t-lg last:rounded-b-lg last:border-b"
DiagnoseLevel.Error => "text-destructive", Value="@($"diagnoseEntry{i}")">
DiagnoseLevel.Warning => "text-yellow-300",
DiagnoseLevel.Healthy => "text-green-500"
};
<AccordionItem <AccordionTrigger className="hover:no-underline">
ClassName="overflow-hidden border bg-background px-4 first:rounded-t-lg last:rounded-b-lg last:border-b" <div class="flex items-center gap-3">
Value="@($"diagnoseEntry{i}")">
<AccordionTrigger className="hover:no-underline"> @switch (entry.Level)
<div class="flex items-center gap-3"> {
case DiagnoseLevel.Error:
<CircleXIcon ClassName="@textColor"/>
break;
@switch (entry.Level) case DiagnoseLevel.Warning:
{ <TriangleAlertIcon ClassName="@textColor"/>
case DiagnoseLevel.Error: break;
<CircleXIcon ClassName="@textColor"/>
break;
case DiagnoseLevel.Warning: case DiagnoseLevel.Healthy:
<TriangleAlertIcon ClassName="@textColor"/> <CircleCheckIcon ClassName="@textColor"/>
break; break;
}
case DiagnoseLevel.Healthy: <div class="flex flex-col items-start text-left">
<CircleCheckIcon ClassName="@textColor"/>
break;
}
<div class="flex flex-col items-start text-left">
<span class="@textColor"> <span class="@textColor">
@entry.Title @entry.Title
</span> </span>
<span class="text-sm text-muted-foreground"> <span class="text-sm text-muted-foreground">
@(string.Join(" / ", entry.Tags)) @(string.Join(" / ", entry.Tags))
</span> </span>
</div> </div>
</div> </div>
</AccordionTrigger> </AccordionTrigger>
<AccordionContent ClassName="ps-7"> <AccordionContent ClassName="ps-7">
<div class="text-muted-foreground flex flex-col gap-y-3"> <div class="text-muted-foreground flex flex-col gap-y-3">
@if (!string.IsNullOrWhiteSpace(entry.StackStrace))
{
<div
class="rounded-xl p-2.5 bg-black max-h-36 overflow-auto scrollbar-thin">
@entry.StackStrace
</div>
}
@if (!string.IsNullOrWhiteSpace(entry.Message))
{
<p>
@entry.Message
</p>
}
@if (
!string.IsNullOrWhiteSpace(entry.ReportUrl) ||
!string.IsNullOrWhiteSpace(entry.StackStrace) ||
!string.IsNullOrWhiteSpace(entry.SolutionUrl)
)
{
<div class="flex justify-end gap-x-1">
@if (!string.IsNullOrWhiteSpace(entry.StackStrace)) @if (!string.IsNullOrWhiteSpace(entry.StackStrace))
{ {
<div <Button Variant="ButtonVariant.Outline">
class="rounded-xl p-2.5 bg-black max-h-36 overflow-auto scrollbar-thin"> <CopyIcon/>
@entry.StackStrace Copy
</div> </Button>
} }
@if (!string.IsNullOrWhiteSpace(entry.Message)) @if (!string.IsNullOrWhiteSpace(entry.SolutionUrl))
{ {
<p> <Button Variant="ButtonVariant.Outline">
@entry.Message <Slot>
</p> <a href="@entry.SolutionUrl" @attributes="context">
<WrenchIcon/>
Show suggested solution
</a>
</Slot>
</Button>
} }
@if ( @if (!string.IsNullOrWhiteSpace(entry.ReportUrl))
!string.IsNullOrWhiteSpace(entry.ReportUrl) ||
!string.IsNullOrWhiteSpace(entry.StackStrace) ||
!string.IsNullOrWhiteSpace(entry.SolutionUrl)
)
{ {
<div class="flex justify-end gap-x-1"> <Button Variant="ButtonVariant.Outline">
@if (!string.IsNullOrWhiteSpace(entry.StackStrace)) <Slot>
{ <a href="@entry.ReportUrl" @attributes="context">
<Button Variant="ButtonVariant.Outline"> <GitBranchIcon/>
<CopyIcon/> Report on Github
Copy </a>
</Button> </Slot>
} </Button>
@if (!string.IsNullOrWhiteSpace(entry.SolutionUrl))
{
<Button Variant="ButtonVariant.Outline">
<Slot>
<a href="@entry.SolutionUrl" @attributes="context">
<WrenchIcon/>
Show suggested solution
</a>
</Slot>
</Button>
}
@if (!string.IsNullOrWhiteSpace(entry.ReportUrl))
{
<Button Variant="ButtonVariant.Outline">
<Slot>
<a href="@entry.ReportUrl" @attributes="context">
<GitBranchIcon/>
Report on Github
</a>
</Slot>
</Button>
}
</div>
} }
</div> </div>
</AccordionContent> }
</AccordionItem> </div>
} </AccordionContent>
</Accordion> </AccordionItem>
} }
} </Accordion>
else }
{ }
else
{
<Card>
<CardContent ClassName="flex justify-center items-center">
<Empty> <Empty>
<EmptyHeader> <EmptyHeader>
<EmptyMedia Variant="EmptyMediaVariant.Icon"> <EmptyMedia Variant="EmptyMediaVariant.Icon">
@@ -199,10 +207,10 @@
</EmptyDescription> </EmptyDescription>
</EmptyHeader> </EmptyHeader>
</Empty> </Empty>
} </CardContent>
} </Card>
</CardContent> }
</Card> }
</div> </div>
</div> </div>

2
Moonlight.Frontend/UI/Admin/Views/Users/Index.razor
View File

@@ -36,7 +36,7 @@
</div> </div>
<div class="mt-8"> <div class="mt-8">
<DataGrid @ref="Grid" TGridItem="UserResponse" Loader="LoadAsync" PageSize="10"> <DataGrid @ref="Grid" TGridItem="UserResponse" Loader="LoadAsync" PageSize="10" ClassName="bg-card">
<PropertyColumn HeadClassName="text-left" CellClassName="text-left" Field="u => u.Id"/> <PropertyColumn HeadClassName="text-left" CellClassName="text-left" Field="u => u.Id"/>
<PropertyColumn HeadClassName="text-left" CellClassName="text-left" IsFilterable="true" <PropertyColumn HeadClassName="text-left" CellClassName="text-left" IsFilterable="true"
Identifier="@nameof(UserResponse.Username)" Field="u => u.Username"/> Identifier="@nameof(UserResponse.Username)" Field="u => u.Username"/>