From 1b7724017d13957d9b0a487afe68cffee2308f6f Mon Sep 17 00:00:00 2001 From: Henry Dollman Date: Sun, 21 Jul 2024 13:38:57 -0400 Subject: [PATCH] site charts and style updates --- .../src/components/charts/bandwidth-chart.tsx | 7 ++----- hub/site/src/components/charts/cpu-chart.tsx | 4 ++-- hub/site/src/components/charts/disk-chart.tsx | 4 +--- hub/site/src/components/charts/disk-io-chart.tsx | 13 ++++++++----- hub/site/src/components/charts/mem-chart.tsx | 11 ++++++----- hub/site/src/components/command-palette.tsx | 16 +++++++++------- hub/site/src/components/routes/home.tsx | 2 +- hub/site/src/components/routes/server.tsx | 2 +- .../components/server-table/systems-table.tsx | 2 +- hub/site/src/main.tsx | 14 +++++++------- 10 files changed, 38 insertions(+), 37 deletions(-) diff --git a/hub/site/src/components/charts/bandwidth-chart.tsx b/hub/site/src/components/charts/bandwidth-chart.tsx index 4c1f07e..faaf083 100644 --- a/hub/site/src/components/charts/bandwidth-chart.tsx +++ b/hub/site/src/components/charts/bandwidth-chart.tsx @@ -46,11 +46,8 @@ export default function BandwidthChart({ (max < 0.4 ? 0.4 : Math.ceil(max))]} tickLine={false} axisLine={false} unit={' MB/s'} diff --git a/hub/site/src/components/charts/cpu-chart.tsx b/hub/site/src/components/charts/cpu-chart.tsx index c038a82..a143763 100644 --- a/hub/site/src/components/charts/cpu-chart.tsx +++ b/hub/site/src/components/charts/cpu-chart.tsx @@ -36,8 +36,8 @@ export default function CpuChart({ Math.ceil(max)]} - width={47} + // domain={[0, (max: number) => Math.ceil(max)]} + width={48} tickLine={false} axisLine={false} unit={'%'} diff --git a/hub/site/src/components/charts/disk-chart.tsx b/hub/site/src/components/charts/disk-chart.tsx index 99cc8e5..b7499af 100644 --- a/hub/site/src/components/charts/disk-chart.tsx +++ b/hub/site/src/components/charts/disk-chart.tsx @@ -56,11 +56,9 @@ export default function DiskChart({ = 1000 ? 75 : 65} domain={[0, diskSize]} - // ticks={ticks} tickCount={9} - minTickGap={8} tickLine={false} axisLine={false} unit={' GB'} diff --git a/hub/site/src/components/charts/disk-io-chart.tsx b/hub/site/src/components/charts/disk-io-chart.tsx index b856170..5636c68 100644 --- a/hub/site/src/components/charts/disk-io-chart.tsx +++ b/hub/site/src/components/charts/disk-io-chart.tsx @@ -46,11 +46,14 @@ export default function DiskIoChart({ (max < 0.4 ? 0.4 : Math.ceil(max))]} + tickFormatter={(value) => { + if (value >= 100) { + return value.toFixed(0) + } + return value.toFixed((value * 100) % 1 === 0 ? 1 : 2) + }} tickLine={false} axisLine={false} unit={' MB/s'} diff --git a/hub/site/src/components/charts/mem-chart.tsx b/hub/site/src/components/charts/mem-chart.tsx index c64c1f2..899f034 100644 --- a/hub/site/src/components/charts/mem-chart.tsx +++ b/hub/site/src/components/charts/mem-chart.tsx @@ -18,7 +18,8 @@ export default function MemChart({ ticks: number[] }) { const totalMem = useMemo(() => { - return Math.ceil(chartData[0]?.mem) + const maxMem = Math.ceil(chartData[0]?.mem) + return maxMem > 2 && maxMem % 2 !== 0 ? maxMem + 1 : maxMem }, [chartData]) const chartConfig = useMemo( @@ -52,11 +53,11 @@ export default function MemChart({ = 100 ? 65 : 58} + // allowDecimals={false} axisLine={false} - tickFormatter={(v) => `${v} GB`} + unit={' GB'} /> {/* todo: short time if first date is same day, otherwise short date */} a.name.localeCompare(b.name)} labelFormatter={(_, data) => formatShortDate(data[0].payload.time)} diff --git a/hub/site/src/components/command-palette.tsx b/hub/site/src/components/command-palette.tsx index bb91d28..fc11bfa 100644 --- a/hub/site/src/components/command-palette.tsx +++ b/hub/site/src/components/command-palette.tsx @@ -9,6 +9,7 @@ import { LogsIcon, MailIcon, Server, + UsersIcon, } from 'lucide-react' import { @@ -91,17 +92,18 @@ export default function CommandPalette() { { - window.location.href = '/_/' + window.open('/_/', '_blank') }} > - - PocketBase + + Users Admin { - window.location.href = '/_/#/logs' + window.open('/_/#/logs', '_blank') }} > @@ -110,7 +112,7 @@ export default function CommandPalette() { { - window.location.href = '/_/#/settings/backups' + window.open('/_/#/settings/backups', '_blank') }} > @@ -120,7 +122,7 @@ export default function CommandPalette() { { - window.location.href = '/_/#/settings/auth-providers' + window.open('/_/#/settings/auth-providers', '_blank') }} > @@ -130,7 +132,7 @@ export default function CommandPalette() { { - window.location.href = '/_/#/settings/mail' + window.open('/_/#/settings/mail', '_blank') }} > diff --git a/hub/site/src/components/routes/home.tsx b/hub/site/src/components/routes/home.tsx index d326d9b..45a2097 100644 --- a/hub/site/src/components/routes/home.tsx +++ b/hub/site/src/components/routes/home.tsx @@ -11,7 +11,7 @@ export default function () { return ( <> - + All Systems Updated in real time. Press{' '} diff --git a/hub/site/src/components/routes/server.tsx b/hub/site/src/components/routes/server.tsx index 2772973..2ec264a 100644 --- a/hub/site/src/components/routes/server.tsx +++ b/hub/site/src/components/routes/server.tsx @@ -199,7 +199,7 @@ export default function ServerDetail({ name }: { name: string }) { } return ( -
+

{server.name}

diff --git a/hub/site/src/components/server-table/systems-table.tsx b/hub/site/src/components/server-table/systems-table.tsx index 0aac1ba..a883d46 100644 --- a/hub/site/src/components/server-table/systems-table.tsx +++ b/hub/site/src/components/server-table/systems-table.tsx @@ -73,7 +73,7 @@ function CellFormatter(info: CellContext) { diff --git a/hub/site/src/main.tsx b/hub/site/src/main.tsx index eedc297..1eb1fe9 100644 --- a/hub/site/src/main.tsx +++ b/hub/site/src/main.tsx @@ -122,7 +122,7 @@ const Layout = () => { return ( <>
-
+
{ navigate('/') }} > - +
@@ -171,31 +171,31 @@ const Layout = () => { {isAdmin() && ( <> - + Users - + Systems - + Logs - + Backups - + Auth providers