diff --git a/beszel/site/src/components/charts/disk-io-chart.tsx b/beszel/site/src/components/charts/disk-io-chart.tsx index 770cfe7..a0b91b2 100644 --- a/beszel/site/src/components/charts/disk-io-chart.tsx +++ b/beszel/site/src/components/charts/disk-io-chart.tsx @@ -17,9 +17,11 @@ import { SystemStatsRecord } from '@/types' export default function DiskIoChart({ ticks, systemData, + dataKeys, }: { ticks: number[] systemData: SystemStatsRecord[] + dataKeys: string[] }) { const chartTime = useStore($chartTime) const { yAxisWidth, updateYAxisWidth } = useYAxisWidth() @@ -77,26 +79,21 @@ export default function DiskIoChart({ /> } /> - - + {dataKeys.map((dataKey, i) => { + const action = i ? 'Read' : 'Write' + const color = i ? 'hsl(var(--chart-1))' : 'hsl(var(--chart-3))' + return ( + + ) + })} diff --git a/beszel/site/src/components/charts/extra-fs-disk-io-chart.tsx b/beszel/site/src/components/charts/extra-fs-disk-io-chart.tsx deleted file mode 100644 index c4ddf19..0000000 --- a/beszel/site/src/components/charts/extra-fs-disk-io-chart.tsx +++ /dev/null @@ -1,106 +0,0 @@ -import { Area, AreaChart, CartesianGrid, XAxis, YAxis } from 'recharts' - -import { ChartContainer, ChartTooltip, ChartTooltipContent } from '@/components/ui/chart' -import { - useYAxisWidth, - chartTimeData, - cn, - formatShortDate, - toFixedWithoutTrailingZeros, - twoDecimalString, -} from '@/lib/utils' -// import Spinner from '../spinner' -import { useStore } from '@nanostores/react' -import { $chartTime } from '@/lib/stores' -import { SystemStatsRecord } from '@/types' - -export default function ExFsDiskIoChart({ - ticks, - systemData, - fs, -}: { - ticks: number[] - systemData: SystemStatsRecord[] - fs: string -}) { - const chartTime = useStore($chartTime) - const { yAxisWidth, updateYAxisWidth } = useYAxisWidth() - - return ( -
- {/* {!yAxisSet && } */} - - - - (max <= 0.4 ? 0.4 : Math.ceil(max))]} - tickFormatter={(value) => { - const val = toFixedWithoutTrailingZeros(value, 2) - return updateYAxisWidth(val + ' MB/s') - }} - tickLine={false} - axisLine={false} - /> - - formatShortDate(data[0].payload.created)} - contentFormatter={(item) => twoDecimalString(item.value) + ' MB/s'} - indicator="line" - /> - } - /> - - - - -
- ) -} diff --git a/beszel/site/src/components/routes/system.tsx b/beszel/site/src/components/routes/system.tsx index 345f4e1..0245956 100644 --- a/beszel/site/src/components/routes/system.tsx +++ b/beszel/site/src/components/routes/system.tsx @@ -38,7 +38,6 @@ const BandwidthChart = lazy(() => import('../charts/bandwidth-chart')) const ContainerNetChart = lazy(() => import('../charts/container-net-chart')) const SwapChart = lazy(() => import('../charts/swap-chart')) const TemperatureChart = lazy(() => import('../charts/temperature-chart')) -const ExFsDiskIoChart = lazy(() => import('../charts/extra-fs-disk-io-chart')) export default function SystemDetail({ name }: { name: string }) { const systems = useStore($systems) @@ -385,7 +384,11 @@ export default function SystemDetail({ name }: { name: string }) { - + - + )