Update proxmox-dashboard.tsx

This commit is contained in:
MacRimi
2025-10-23 21:36:02 +02:00
parent b141622e75
commit 5bcd081e88

View File

@@ -129,23 +129,17 @@ export function ProxmoxDashboard() {
return () => clearInterval(interval) return () => clearInterval(interval)
}, [fetchSystemData]) }, [fetchSystemData])
useEffect(() => { useEffect(() => {
let hideTimeout: ReturnType<typeof setTimeout> | null = null
const handleScroll = () => { const handleScroll = () => {
const currentScrollY = window.scrollY const currentScrollY = window.scrollY
const scrollingDown = currentScrollY > lastScrollY
const scrollingUp = currentScrollY < lastScrollY
if (currentScrollY < 150) { if (currentScrollY < 90) {
if (hideTimeout) clearTimeout(hideTimeout)
setShowNavigation(true) setShowNavigation(true)
} else if (scrollingDown) { } else if (currentScrollY > lastScrollY + 12) {
if (hideTimeout) clearTimeout(hideTimeout) // Scrolling down - hide navigation
hideTimeout = setTimeout(() => setShowNavigation(false), 100) setShowNavigation(false)
} else if (scrollingUp) { } else if (currentScrollY < lastScrollY - 12) {
if (hideTimeout) clearTimeout(hideTimeout) // Scrolling up - show navigation
setShowNavigation(true) setShowNavigation(true)
} }
@@ -153,14 +147,9 @@ export function ProxmoxDashboard() {
} }
window.addEventListener("scroll", handleScroll, { passive: true }) window.addEventListener("scroll", handleScroll, { passive: true })
return () => window.removeEventListener("scroll", handleScroll)
return () => {
window.removeEventListener("scroll", handleScroll)
if (hideTimeout) clearTimeout(hideTimeout)
}
}, [lastScrollY]) }, [lastScrollY])
const refreshData = async () => { const refreshData = async () => {
setIsRefreshing(true) setIsRefreshing(true)
await fetchSystemData() await fetchSystemData()
@@ -330,7 +319,7 @@ export function ProxmoxDashboard() {
className={`sticky z-40 bg-background className={`sticky z-40 bg-background
top-[80px] md:top-[92px] /* header + pequeño gap */ top-[80px] md:top-[92px] /* header + pequeño gap */
transition-transform duration-300 ease-in-out will-change-transform transition-transform duration-300 ease-in-out will-change-transform
${showNavigation ? "translate-y-0 opacity-100" : "-translate-y-[100%] opacity-0 pointer-events-none"} ${showNavigation ? "translate-y-0 opacity-100" : "-translate-y-[110%] opacity-0 pointer-events-none"}
`} `}
> >
<div className="container mx-auto px-4 md:px-6 pt-4 md:pt-6"> <div className="container mx-auto px-4 md:px-6 pt-4 md:pt-6">