jnd/beszel-ipv6
1
0
Fork 0
mirror of https://github.com/henrygd/beszel.git synced 2025-12-17 10:46:16 +01:00
Code Issues Packages Projects Releases 2 Wiki Activity

simplify container chart data and reduce rerenders

Browse Source
This commit is contained in:
Henry Dollman
2024-10-14 11:48:33 -04:00
parent d53b6be5b9
commit bea37d62b4
11 changed files with 281 additions and 500 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
beszel/site/src/components/ui/chart.tsx
View File

@@ -95,7 +95,6 @@ const ChartTooltipContent = React.forwardRef<
React.ComponentProps<typeof RechartsPrimitive.Tooltip> &
React.ComponentProps<'div'> & {
hideLabel?: boolean
hideIndicator?: boolean
indicator?: 'line' | 'dot' | 'dashed'
nameKey?: string
labelKey?: string
@@ -109,9 +108,8 @@ const ChartTooltipContent = React.forwardRef<
active,
payload,
className,
indicator = 'dot',
indicator = 'line',
hideLabel = false,
hideIndicator = false,
label,
labelFormatter,
labelClassName,
@@ -145,7 +143,7 @@ const ChartTooltipContent = React.forwardRef<
}
const [item] = payload
const key = `${labelKey || item.dataKey || item.name || 'value'}`
const key = `${labelKey || item.name || 'value'}`
const itemConfig = getPayloadConfigFromPayload(config, item, key)
const value = !labelKey && typeof label === 'string' ? label : itemConfig?.label
@@ -166,7 +164,8 @@ const ChartTooltipContent = React.forwardRef<
return null
}
const nestLabel = payload.length === 1 && indicator !== 'dot'
// const nestLabel = payload.length === 1 && indicator !== 'dot'
const nestLabel = false
return (
<div
@@ -198,26 +197,24 @@ const ChartTooltipContent = React.forwardRef<
{itemConfig?.icon ? (
<itemConfig.icon />
) : (
!hideIndicator && (
<div
className={cn(
'shrink-0 rounded-[2px] border-[--color-border] bg-[--color-bg]',
{
'h-2.5 w-2.5': indicator === 'dot',
'w-1': indicator === 'line',
'w-0 border-[1.5px] border-dashed bg-transparent':
indicator === 'dashed',
'my-0.5': nestLabel && indicator === 'dashed',
}
)}
style={
{
'--color-bg': indicatorColor,
'--color-border': indicatorColor,
} as React.CSSProperties
<div
className={cn(
'shrink-0 rounded-[2px] border-[--color-border] bg-[--color-bg]',
{
'h-2.5 w-2.5': indicator === 'dot',
'w-1': indicator === 'line',
'w-0 border-[1.5px] border-dashed bg-transparent':
indicator === 'dashed',
'my-0.5': nestLabel && indicator === 'dashed',
}
/>
)
)}
style={
{
'--color-bg': indicatorColor,
'--color-border': indicatorColor,
} as React.CSSProperties
}
/>
)}
<div
className={cn(