Files
openchamber/packages/ui/src/hooks/usePushVisibilityBeacon.ts
T
Bohdan Triapitsyn 1f23b63c0b feat: add Web Push API support and PWA integration (#189)
* feat: add Web Push API support and PWA integration

Add web Push API with subscribe/unsubscribe and visibility endpoints
Introduce usePushVisibilityBeacon and useSessionDeepLink hooks
Integrate PWA with service worker, registerSW, and VAPID key persistence

* feat: add heartbeat visibility beacon for web runtime

Add a 10s heartbeat to ping visibility while visible
Subscribe to visibilitychange, focus, blur, pageshow, and pagehide events to report state
Clear heartbeat interval on unmount to avoid leaks
2026-01-22 01:19:24 +02:00

57 lines
1.5 KiB
TypeScript

import React from 'react';
import { isWebRuntime } from '@/lib/desktop';
import { getRegisteredRuntimeAPIs } from '@/contexts/runtimeAPIRegistry';
const HEARTBEAT_MS = 10000;
const sendVisibility = (visible: boolean) => {
if (!isWebRuntime()) {
return;
}
const apis = getRegisteredRuntimeAPIs();
if (!apis?.push?.setVisibility) {
return;
}
void apis.push.setVisibility({ visible });
};
export const usePushVisibilityBeacon = () => {
React.useEffect(() => {
if (!isWebRuntime() || typeof document === 'undefined') {
return;
}
const report = () => {
sendVisibility(document.visibilityState === 'visible');
};
const reportVisibleOnly = () => {
if (document.visibilityState === 'visible') {
sendVisibility(true);
}
};
report();
// Heartbeat while visible so server TTL (30s) never expires.
const interval = window.setInterval(reportVisibleOnly, HEARTBEAT_MS);
document.addEventListener('visibilitychange', report);
window.addEventListener('pagehide', report);
window.addEventListener('pageshow', report);
window.addEventListener('focus', report);
window.addEventListener('blur', report);
return () => {
window.clearInterval(interval);
document.removeEventListener('visibilitychange', report);
window.removeEventListener('pagehide', report);
window.removeEventListener('pageshow', report);
window.removeEventListener('focus', report);
window.removeEventListener('blur', report);
};
}, []);
};