@lobstar/preact/dist/usePlayers.js

A collection of Preact hooks to use Lobstar library for network and lobby management for multiplayer web games

import { useState, useEffect, useCallback } from "preact/hooks";
/**
 * Hook to track player-related information
 */
export function usePlayers(session) {
    const [players, setPlayers] = useState(session ? session.getPlayers() : {});
    const [self, setSelf] = useState(session ? session.getSelf() : null);
    const [host, setHost] = useState(session ? session.getHost() : null);
    const [areAllPlayersReady, setAreAllPlayersReady] = useState(false);
    // Helper to safely update player state
    const updatePlayerState = useCallback(() => {
        if (!session) {
            // If session is null, reset to empty state
            setPlayers({});
            setSelf(null);
            setHost(null);
            return;
        }
        try {
            // Get the latest state from the session
            const currentPlayers = session.getPlayers() || {};
            const currentSelf = session.getSelf();
            const currentHost = session.getHost();
            // Update React state
            setPlayers(currentPlayers);
            setSelf(currentSelf);
            setHost(currentHost);
        }
        catch (error) {
            console.error("[usePlayers] Error updating player state:", error);
        }
    }, [session]);
    useEffect(() => {
        if (!session)
            return;
        // Initial update
        updatePlayerState();
        const handlePlayersUpdate = ({ players: newPlayers, }) => {
            setPlayers(newPlayers);
            setSelf(session.getSelf());
            setHost(session.getHost());
            setAreAllPlayersReady(session.areAllPlayersReady());
        };
        const handleSessionReset = () => {
            console.log("[usePlayers] Session reset detected");
            setPlayers({});
            setSelf(null);
            setHost(null);
        };
        // Subscribe to player updates
        const unsubscribePlayersUpdate = session.on("playersUpdate", handlePlayersUpdate);
        // Listen for the kicked event specifically
        const unsubscribeKicked = session.on("kicked", handleSessionReset);
        // Listen for state changes back to DISCONNECTED
        const unsubscribeStateChange = session.on("stateChange", ({ state }) => {
            if (state === "DISCONNECTED") {
                handleSessionReset();
            }
        });
        return () => {
            unsubscribePlayersUpdate();
            unsubscribeKicked();
            unsubscribeStateChange();
        };
    }, [session, updatePlayerState]);
    // If the session changes to null, reset the state
    useEffect(() => {
        if (session === null) {
            setPlayers({});
            setSelf(null);
            setHost(null);
        }
    }, [session]);
    return {
        players,
        self,
        host,
        isHost: self?.isHost || false,
        playersList: Object.values(players),
        areAllPlayersReady,
    };
}