diff --git a/beszel/site/src/components/charts/disk-chart.tsx b/beszel/site/src/components/charts/disk-chart.tsx index 45c68c3..7b995e0 100644 --- a/beszel/site/src/components/charts/disk-chart.tsx +++ b/beszel/site/src/components/charts/disk-chart.tsx @@ -50,7 +50,9 @@ export default function DiskChart({ minTickGap={6} tickLine={false} axisLine={false} - tickFormatter={(value) => updateYAxisWidth(value + ' GB')} + tickFormatter={(value) => +updateYAxisWidth(toFixedFloat(getSizeVal(value), 2) + getSizeUnit(value)) +} /> formatShortDate(data[0].payload.created)} - contentFormatter={(item) => twoDecimalString(item.value) + ' GB'} + contentFormatter={({ value }) => + twoDecimalString(getSizeVal(value)) + getSizeUnit(value) + } indicator="line" /> } diff --git a/beszel/site/src/lib/utils.ts b/beszel/site/src/lib/utils.ts index b855f04..5ad0d0c 100644 --- a/beszel/site/src/lib/utils.ts +++ b/beszel/site/src/lib/utils.ts @@ -290,3 +290,17 @@ export async function updateUserSettings() { console.log('create settings', e) } } + +/** + * Get the unit of size (TB or GB) for a given size in gigabytes + * @param n size in gigabytes + * @returns unit of size (TB or GB) + */ +export const getSizeUnit = (n: number) => (n >= 1_000 ? ' TB' : ' GB') + +/** + * Get the value of number in gigabytes if less than 1000, otherwise in terabytes + * @param n size in gigabytes + * @returns value in GB if less than 1000, otherwise value in TB + */ +export const getSizeVal = (n: number) => (n >= 1_000 ? n / 1_000 : n)