cef4709444
All checks were successful
Build and Push Docker Image / build (push) Successful in 9m40s
Add AutoRefresh client component that calls router.refresh() on an interval. Pauses when tab is hidden and refreshes immediately when tab becomes visible again. Jury dashboard now reflects round activations within seconds. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
43 lines
1.0 KiB
TypeScript
43 lines
1.0 KiB
TypeScript
'use client'
|
|
|
|
import { useEffect } from 'react'
|
|
import { useRouter } from 'next/navigation'
|
|
|
|
/**
|
|
* Invisible client component that periodically calls router.refresh()
|
|
* to re-fetch server component data without a full page reload.
|
|
* Pauses when the tab is hidden to avoid unnecessary requests.
|
|
*/
|
|
export function AutoRefresh({ intervalMs = 30_000 }: { intervalMs?: number }) {
|
|
const router = useRouter()
|
|
|
|
useEffect(() => {
|
|
let timer: ReturnType<typeof setInterval>
|
|
|
|
function start() {
|
|
timer = setInterval(() => {
|
|
router.refresh()
|
|
}, intervalMs)
|
|
}
|
|
|
|
function handleVisibility() {
|
|
clearInterval(timer)
|
|
if (document.visibilityState === 'visible') {
|
|
// Refresh immediately when tab becomes visible again
|
|
router.refresh()
|
|
start()
|
|
}
|
|
}
|
|
|
|
start()
|
|
document.addEventListener('visibilitychange', handleVisibility)
|
|
|
|
return () => {
|
|
clearInterval(timer)
|
|
document.removeEventListener('visibilitychange', handleVisibility)
|
|
}
|
|
}, [router, intervalMs])
|
|
|
|
return null
|
|
}
|