fankes/beszel
2
0
Fork 0
mirror of https://github.com/fankes/beszel.git synced 2025-10-20 02:09:28 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix bottom spacing

Browse Source
This commit is contained in:
Henry Dollman
2024-10-14 19:03:02 -04:00
parent c4400eb0a3
commit c1577d3ba5
1 changed files with 6 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
beszel/site/src/components/routes/system.tsx
View File

@@ -107,6 +107,7 @@ export default function SystemDetail({ name }: { name: string }) {
const [containerData, setContainerData] = useState([] as ChartData['containerData'])
const netCardRef = useRef<HTMLDivElement>(null)
const [containerFilterBar, setContainerFilterBar] = useState(null as null | JSX.Element)
const [bottomSpacing, setBottomSpacing] = useState(0)
const isLongerChart = chartTime !== '1h'
useEffect(() => {
@@ -265,17 +266,18 @@ export default function SystemDetail({ name }: { name: string }) {
}, [system.info])
/** Space for tooltip if more than 12 containers */
const bottomSpacing = useMemo(() => {
useEffect(() => {
if (!netCardRef.current || !containerData.length) {
return 0
setBottomSpacing(0)
return
}
const tooltipHeight = (Object.keys(containerData[0]).length - 11) * 17.8 - 40
const wrapperEl = document.getElementById('chartwrap') as HTMLDivElement
const wrapperRect = wrapperEl.getBoundingClientRect()
const chartRect = netCardRef.current.getBoundingClientRect()
const distanceToBottom = wrapperRect.bottom - chartRect.bottom
return tooltipHeight - distanceToBottom
}, [netCardRef.current, containerData])
setBottomSpacing(tooltipHeight - distanceToBottom)
}, [netCardRef, containerData])
if (!system.id) {
return null