style(ui): flatten administration collections and diagnostics

This commit is contained in:
cesnimda
2026-11-04 08:40:02 +01:00
parent 1427eb2184
commit d651ce7aa4
3 changed files with 19 additions and 20 deletions
+1 -1
View File
@@ -87,7 +87,7 @@ export default function AdminAuditPage() {
return (
<Box sx={{ display: "grid", gap: "var(--app-section-gap)", minWidth: 0 }}>
<PageHeader level="h2" title={t("adminAuditTitle")} description={t("adminAuditSubtitle")} />
<PageSection level="h3" surface title={t("adminAuditEvents")}>
<PageSection level="h3" title={t("adminAuditEvents")}>
<Box ref={body} role="region" aria-label={t("adminAuditTitle")} tabIndex={0} aria-busy={busyId!==null || auditResource.loading || auditResource.refreshing} sx={{ minWidth: 0, overflow: "auto" }}>
<ViewStateNotice
@@ -173,7 +173,7 @@ export default function AdminProcessingPage() {
</Box>
{visibleListing ? <>
<Stack direction="row" useFlexGap flexWrap="wrap" spacing={1}>{Object.entries(visibleListing.counts).map(([key, count]) => <Chip key={key} label={`${state(key)}: ${count}`} />)}</Stack>
<PageSection title={t('processingJobs')} surface>
<PageSection title={t('processingJobs')}>
<Box ref={resultsBody} tabIndex={-1} role="group" aria-label={t('processingResults')} sx={{ minWidth: 0, scrollMarginTop: { xs: '9rem', sm: '6rem' } }}>
<Button onClick={() => { filtersBody.current?.focus({ preventScroll: true }); filtersBody.current?.scrollIntoView({ block: 'start' }); }}>{t('processingReturnFilters')}</Button>
{!visibleListing.items.length ? <Typography>{t('processingNoJobs')}</Typography> : <TableContainer tabIndex={0} role="group" aria-label={t('processingJobs')} sx={{ overflowX: 'auto', maxWidth: '100%' }}>
@@ -199,7 +199,7 @@ export default function AdminProcessingPage() {
<Stack direction="row" useFlexGap flexWrap="wrap" spacing={1} sx={{ mt: 1 }}>{visibleListing.workers.map(item => <Chip key={item.name} label={`${t(workers[item.name] ?? 'processingWorkerUntracked')}: ${t(item.flagEnabled ? 'processingEnabled' : 'processingDisabled')}`} />)}</Stack>
</Box>
</> : null}
{detail && visibleListing ? <PageSection surface title={t('processingDetails')} titleRef={detailHeading}>
{detail && visibleListing ? <PageSection title={t('processingDetails')} titleRef={detailHeading}>
<Stack spacing={2}>
<Stack direction="row" useFlexGap flexWrap="wrap" spacing={1} alignItems="center">
<TextField label={t('processingCorrelation')} value={detail.id} slotProps={{ input: { readOnly: true } }} sx={{ flex: '1 1 20rem', minWidth: 0 }} />
+16 -17
View File
@@ -5,7 +5,6 @@ import {
Box,
Button,
Chip,
Paper,
Stack,
Tab,
Tabs,
@@ -205,11 +204,11 @@ function benchmarkTone(value?: number | null) {
function SummaryCard({ title, value, subtitle, tone = "default" }: { title: string; value: string; subtitle?: string; tone?: "default" | "success" | "warning" | "error" }) {
const color = tone === "success" ? "success.main" : tone === "warning" ? "warning.main" : tone === "error" ? "error.main" : "text.primary";
return (
<Paper variant="outlined" sx={{ p: "var(--app-card-padding)", borderRadius: 1, minWidth: 0 }}>
<Box sx={{ py: 1, minWidth: 0, overflowWrap: "anywhere" }}>
<Typography variant="overline" sx={{ color: "text.secondary" }}>{title}</Typography>
<Typography component="p" variant="h5" sx={{ fontWeight: 950, color }}>{value}</Typography>
<Typography variant="body2" sx={{ color: "text.secondary", mt: 1 }}>{subtitle || "-"}</Typography>
</Paper>
</Box>
);
}
@@ -485,7 +484,7 @@ export default function AdminSystemPage() {
</Box>
<Box sx={{ display: "grid", gridTemplateColumns: { xs: "1fr", lg: "1.2fr 1fr" }, gap: 2 }}>
<PageSection surface level="h3" title={t("adminSystemDatabaseStorage")}>
<PageSection level="h3" title={t("adminSystemDatabaseStorage")}>
<Stack spacing={0.75}>
<DetailRow label={t("adminSystemProvider")} value={status?.database.provider || "-"} />
<DetailRow label={t("adminSystemTarget")} value={status?.database.target || "-"} />
@@ -502,7 +501,7 @@ export default function AdminSystemPage() {
</Stack>
</PageSection>
<PageSection surface level="h3" title={t("adminSystemRuntimeAuth")}>
<PageSection level="h3" title={t("adminSystemRuntimeAuth")}>
<Stack spacing={0.75}>
<DetailRow label={t("adminSystemFramework")} value={status?.runtime.framework || "-"} />
<DetailRow label={t("adminSystemOs")} value={status?.runtime.osDescription || "-"} />
@@ -519,7 +518,7 @@ export default function AdminSystemPage() {
</Box>
<Box sx={{ display: "grid", gridTemplateColumns: { xs: "1fr", lg: "1fr 1fr" }, gap: 2 }}>
<PageSection surface level="h3" title={t("adminSystemEmailConfig")}>
<PageSection level="h3" title={t("adminSystemEmailConfig")}>
<Stack spacing={0.75}>
<DetailRow label={t("adminSystemEnabled")} value={status?.email.enabled ? t("yes") : t("noWord")} />
<DetailRow label={t("adminSystemFrom")} value={status?.email.from || "-"} />
@@ -530,7 +529,7 @@ export default function AdminSystemPage() {
</Stack>
</PageSection>
<PageSection surface level="h3" title={t("adminSystemSummarizerRuntime")}>
<PageSection level="h3" title={t("adminSystemSummarizerRuntime")}>
<Stack spacing={0.75}>
<DetailRow label={t("adminSystemModel")} value={status?.ai.model || "-"} />
<DetailRow label={t("adminSystemDevice")} value={status?.ai.device || "-"} />
@@ -551,7 +550,7 @@ export default function AdminSystemPage() {
</PageSection>
</Box>
<PageSection surface level="h3" title={t("adminSystemSummarizerTelemetry")}>
<PageSection level="h3" title={t("adminSystemSummarizerTelemetry")}>
<Box sx={{ display: "grid", gridTemplateColumns: { xs: "1fr 1fr", md: "repeat(8, 1fr)" }, gap: 2 }}>
<Box><Typography variant="overline" sx={{ color: "text.secondary" }}>{t("adminSystemRequests")}</Typography><Typography component="p" variant="h6" sx={{ fontWeight: 900 }}>{status?.ai.requests ?? 0}</Typography></Box>
<Box><Typography variant="overline" sx={{ color: "text.secondary" }}>{t("adminSystemCacheHits")}</Typography><Typography component="p" variant="h6" sx={{ fontWeight: 900 }}>{status?.ai.cacheHits ?? 0}</Typography></Box>
@@ -578,7 +577,7 @@ export default function AdminSystemPage() {
</Box>
</PageSection>
<PageSection surface level="h3" title={t("adminBenchmarkTitle")}>
<PageSection level="h3" title={t("adminBenchmarkTitle")}>
<Box sx={{ display: "flex", alignItems: "flex-start", justifyContent: "space-between", gap: 2, flexWrap: "wrap", mb: 1 }}>
<Box>
<Typography variant="body2" sx={{ color: "text.secondary", mt: 0.25 }}>
@@ -619,23 +618,23 @@ export default function AdminSystemPage() {
</Box>
<Box sx={{ mt: 2.5, display: "grid", gridTemplateColumns: { xs: "1fr", xl: "1.1fr 0.9fr" }, gap: 2 }}>
<Paper variant="outlined" sx={{ p: 1.5, borderRadius: 3 }}>
<Box sx={{ minWidth: 0, pt: 1.5, borderTop: 1, borderColor: "divider" }}>
<Typography component="h4" variant="subtitle1" sx={{ fontWeight: 900, mb: 1 }}>{t("adminBenchmarkTopFindings")}</Typography>
<Stack spacing={1}>
{benchmarkFindings.length > 0 ? benchmarkFindings.map((finding) => (
<Box key={`${finding.file}:${finding.issue}`} sx={{ p: 1.25, borderRadius: 2, backgroundColor: "background.default", border: "none", boxShadow: "0px 1px 2px 0px rgba(15,23,42,0.04), 0px 8px 24px -12px rgba(15,23,42,0.12)" }}>
<Box key={`${finding.file}:${finding.issue}`} sx={{ py: 1, overflowWrap: "anywhere", "& + &": { borderTop: 1, borderColor: "divider" } }}>
<Typography variant="caption" sx={{ color: "text.secondary" }}>{finding.file}</Typography>
<Typography variant="body2">{finding.issue}</Typography>
</Box>
)) : <Typography variant="body2" sx={{ color: "text.secondary" }}>{t("adminBenchmarkNoAnomalies")}</Typography>}
</Stack>
</Paper>
</Box>
<Paper variant="outlined" sx={{ p: 1.5, borderRadius: 3 }}>
<Box sx={{ minWidth: 0, pt: 1.5, borderTop: 1, borderColor: "divider" }}>
<Typography component="h4" variant="subtitle1" sx={{ fontWeight: 900, mb: 1 }}>{t("adminBenchmarkWeakest")}</Typography>
<Stack spacing={1}>
{weakestEntries.map((entry) => (
<Box key={entry.Slug} sx={{ p: 1.25, borderRadius: 2, backgroundColor: "background.default", border: "none", boxShadow: "0px 1px 2px 0px rgba(15,23,42,0.04), 0px 8px 24px -12px rgba(15,23,42,0.12)" }}>
<Box key={entry.Slug} sx={{ py: 1, overflowWrap: "anywhere", "& + &": { borderTop: 1, borderColor: "divider" } }}>
<Typography variant="body2" sx={{ fontWeight: 800 }}>{entry.FileName}</Typography>
<Box sx={{ display: "flex", gap: 0.75, flexWrap: "wrap", mt: 0.75 }}>
<Chip size="small" label={t("adminBenchmarkCoverageValue", { value: formatPercent(entry.CoverageScore) })} color={benchmarkTone(entry.CoverageScore)} />
@@ -646,10 +645,10 @@ export default function AdminSystemPage() {
</Box>
))}
</Stack>
</Paper>
</Box>
</Box>
<Box sx={{ mt: 2, p: 1.5, borderRadius: 2, backgroundColor: "background.default", border: "none", boxShadow: "0px 1px 2px 0px rgba(15,23,42,0.04), 0px 8px 24px -12px rgba(15,23,42,0.12)", maxHeight: 280, overflow: "auto" }}>
<Box sx={{ mt: 2, pt: 1.5, borderTop: 1, borderColor: "divider", maxHeight: 280, overflow: "auto" }}>
<Typography component="h4" variant="subtitle2" sx={{ fontWeight: 800, mb: 1 }}>{t("adminBenchmarkLatestSummary")}</Typography>
<Typography variant="body2" sx={{ whiteSpace: "pre-wrap", fontFamily: "ui-monospace, SFMono-Regular, monospace" }}>
{benchmarkStatus?.reportMarkdown || "-"}
@@ -657,7 +656,7 @@ export default function AdminSystemPage() {
</Box>
</>
) : (
<Box sx={{ mt: 1.5, p: 1.5, borderRadius: 2, backgroundColor: "background.default", border: "none", boxShadow: "0px 1px 2px 0px rgba(15,23,42,0.04), 0px 8px 24px -12px rgba(15,23,42,0.12)" }}>
<Box sx={{ mt: 1.5 }}>
<Typography variant="body2" sx={{ whiteSpace: "pre-wrap", fontFamily: "ui-monospace, SFMono-Regular, monospace" }}>
{benchmarkStatus?.reportMarkdown || t("adminBenchmarkRunScript")}
</Typography>