Files
cinny/src/app/hooks/usePresenceUpdater.ts
T

130 lines
4.1 KiB
TypeScript
Raw Normal View History

2026-05-28 19:28:52 -04:00
import { useEffect, useRef } from 'react';
import { useMatrixClient } from './useMatrixClient';
import { useSetting } from '../state/hooks/settings';
import { settingsAtom } from '../state/settings';
const IDLE_TIMEOUT_MS = 10 * 60 * 1000;
const ACTIVITY_THROTTLE_MS = 1000;
2026-05-28 19:28:52 -04:00
export function usePresenceUpdater() {
const mx = useMatrixClient();
const [hidePresence] = useSetting(settingsAtom, 'hidePresence');
const [presenceStatus] = useSetting(settingsAtom, 'presenceStatus');
2026-05-28 19:28:52 -04:00
const idleTimerRef = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);
const isIdleRef = useRef(false);
const lastActivityRef = useRef(0);
useEffect(() => {
const userId = mx.getUserId();
// Read status from localStorage at call time so manual updates from the
// Profile settings are never overwritten by a stale closure value.
const readStatus = () =>
userId ? (localStorage.getItem(`lotus-status-msg-${userId}`) ?? '') : '';
const setOnline = () => {
const status = readStatus();
return mx
2026-06-10 22:55:32 -04:00
.setPresence({
presence: 'online',
...(status ? { status_msg: status } : {}),
2026-06-10 22:55:32 -04:00
})
.catch(() => undefined);
};
const setUnavailable = (statusMsg?: string) => {
const status = readStatus();
return mx
2026-06-10 22:55:32 -04:00
.setPresence({
presence: 'unavailable',
...(statusMsg ? { status_msg: statusMsg } : status ? { status_msg: status } : {}),
2026-06-10 22:55:32 -04:00
})
.catch(() => undefined);
};
const setOffline = () =>
mx.setPresence({ presence: 'offline', status_msg: '' }).catch(() => undefined);
2026-05-28 19:28:52 -04:00
// Manual presence overrides — no activity tracking needed.
if (hidePresence || presenceStatus === 'invisible') {
setOffline();
return undefined;
}
if (presenceStatus === 'online') {
setOnline();
return undefined;
}
if (presenceStatus === 'idle') {
setUnavailable();
return undefined;
}
if (presenceStatus === 'dnd') {
setUnavailable('dnd');
2026-05-28 19:28:52 -04:00
return undefined;
}
// presenceStatus === 'auto' — original activity-tracking behavior.
2026-05-28 19:28:52 -04:00
const startIdleTimer = () => {
clearTimeout(idleTimerRef.current);
idleTimerRef.current = setTimeout(() => {
2026-05-28 19:28:52 -04:00
isIdleRef.current = true;
setUnavailable();
}, IDLE_TIMEOUT_MS);
};
const handleActivity = () => {
const now = Date.now();
if (now - lastActivityRef.current < ACTIVITY_THROTTLE_MS) return;
lastActivityRef.current = now;
if (isIdleRef.current && !document.hidden) {
isIdleRef.current = false;
setOnline();
}
startIdleTimer();
};
const handleVisibilityChange = () => {
if (document.hidden) {
clearTimeout(idleTimerRef.current);
setUnavailable();
} else {
isIdleRef.current = false;
lastActivityRef.current = Date.now();
setOnline();
startIdleTimer();
}
};
const handlePageHide = () => {
const token = mx.getAccessToken();
const baseUrl = mx.getHomeserverUrl();
2026-05-28 19:28:52 -04:00
if (!userId || !token || !baseUrl) return;
fetch(`${baseUrl}/_matrix/client/v3/presence/${encodeURIComponent(userId)}/status`, {
method: 'PUT',
headers: {
Authorization: `Bearer ${token}`,
'Content-Type': 'application/json',
},
body: JSON.stringify({ presence: 'offline' }),
keepalive: true,
}).catch(() => undefined);
};
setOnline();
startIdleTimer();
const activityEvents = ['mousemove', 'keydown', 'touchstart', 'click', 'scroll'] as const;
activityEvents.forEach((e) => window.addEventListener(e, handleActivity, { passive: true }));
document.addEventListener('visibilitychange', handleVisibilityChange);
window.addEventListener('pagehide', handlePageHide);
return () => {
clearTimeout(idleTimerRef.current);
activityEvents.forEach((e) => window.removeEventListener(e, handleActivity));
document.removeEventListener('visibilitychange', handleVisibilityChange);
window.removeEventListener('pagehide', handlePageHide);
};
}, [mx, hidePresence, presenceStatus]);
2026-05-28 19:28:52 -04:00
}