Files
monitoring-app/src/frontend/hooks/usePresence.ts
2026-04-28 17:34:45 +08:00

43 lines
1.2 KiB
TypeScript

import { useEffect, useRef, useState } from 'react'
import { useSession } from './useAuth'
export function usePresence() {
const { data } = useSession()
const [onlineUserIds, setOnlineUserIds] = useState<string[]>([])
const wsRef = useRef<WebSocket | null>(null)
const reconnectTimer = useRef<ReturnType<typeof setTimeout> | undefined>(undefined)
useEffect(() => {
if (!data?.user) return
function connect() {
const proto = location.protocol === 'https:' ? 'wss' : 'ws'
const ws = new WebSocket(`${proto}://${location.host}/ws/presence`)
wsRef.current = ws
ws.onmessage = (e) => {
const msg = JSON.parse(e.data)
if (msg.type === 'presence') setOnlineUserIds(msg.online)
}
ws.onclose = () => {
wsRef.current = null
reconnectTimer.current = setTimeout(connect, 3000)
}
ws.onerror = () => ws.close()
}
connect()
return () => {
clearTimeout(reconnectTimer.current)
if (wsRef.current) {
wsRef.current.onclose = null
wsRef.current.close()
wsRef.current = null
}
}
}, [data?.user?.id, data?.user])
return { onlineUserIds }
}