From 70af31b8e5fbe2599710cb77962e0976a7cfee58 Mon Sep 17 00:00:00 2001 From: Dylan Plaster <85687915+Dylan-PlasterAAA@users.noreply.github.com> Date: Tue, 17 Aug 2021 16:51:51 -0400 Subject: [PATCH] Add state-change handling to usePresence added handling for state-change presence events in the usePresence hook --- lib/src/hooks/use-presence.ts | 59 ++++++++++++++++++++--------------- 1 file changed, 33 insertions(+), 26 deletions(-) diff --git a/lib/src/hooks/use-presence.ts b/lib/src/hooks/use-presence.ts index 7ebc7f3e0..6855ca6d9 100644 --- a/lib/src/hooks/use-presence.ts +++ b/lib/src/hooks/use-presence.ts @@ -1,30 +1,25 @@ -import { useState, useEffect, useCallback, useMemo } from "react"; -import { HereNowParameters, HereNowResponse } from "pubnub"; -import { usePubNub } from "pubnub-react"; -import cloneDeep from "lodash.clonedeep"; +import { useState, useEffect, useCallback, useMemo } from 'react'; +import { HereNowParameters, HereNowResponse } from 'pubnub'; +import { usePubNub } from 'pubnub-react'; +import cloneDeep from 'lodash.clonedeep'; -type ChannelsOccupancy = HereNowResponse["channels"]; +type ChannelsOccupancy = HereNowResponse['channels']; type HookReturnValue = [ChannelsOccupancy, () => Promise, number, Error]; -export const usePresence = ({ - channels, - channelGroups, - includeUUIDs, - includeState, -}: HereNowParameters = {}): HookReturnValue => { +export const usePresence = ({ channels, channelGroups, includeUUIDs, includeState }: HereNowParameters = {}): HookReturnValue => { const pubnub = usePubNub(); const [presence, setPresence] = useState({}); const [error, setError] = useState(); const presenceValues = Object.values(presence); - const total = presenceValues.map((ch) => ch.occupancy).reduce((prev, cur) => prev + cur, 0); + const total = presenceValues.map(ch => ch.occupancy).reduce((prev, cur) => prev + cur, 0); const options = useMemo(() => ({ channels, channelGroups, includeUUIDs, includeState }), [ channels, channelGroups, includeUUIDs, - includeState, + includeState ]); const command = useCallback(async () => { @@ -37,37 +32,49 @@ export const usePresence = ({ }, [pubnub, options]); const handlePresence = useCallback( - (event) => { - setPresence((presence) => { - const presenceClone = cloneDeep(presence); + event => { + setPresence(pres => { + const presenceClone = cloneDeep(pres); if (!presenceClone[event.channel]) presenceClone[event.channel] = {}; const channel = presenceClone[event.channel]; - if (event.action === "join") { - if (!channel.hasOwnProperty("occupants")) channel.occupants = []; + if (event.action === 'join') { + if (!Object.prototype.hasOwnProperty.call(channel, 'occupants')) channel.occupants = []; channel.occupancy = event.occupancy; if ( options.includeUUIDs !== false && - channel.hasOwnProperty("occupants") && - !channel.occupants.find((u) => u.uuid == event.uuid) + Object.prototype.hasOwnProperty.call(channel, 'occupants') && + !channel.occupants.find(u => u.uuid === event.uuid) ) { const { state, uuid } = event; channel.occupants.push({ state, uuid }); } } - if (["leave", "timeout"].includes(event.action)) { + if (['leave', 'timeout'].includes(event.action)) { channel.occupancy = event.occupancy; if ( options.includeUUIDs !== false && - channel.hasOwnProperty("occupants") && - channel.occupants.find((u) => u.uuid == event.uuid) + Object.prototype.hasOwnProperty.call(channel, 'occupants') && + channel.occupants.find(u => u.uuid === event.uuid) ) { - presenceClone[event.channel].occupants = channel.occupants.filter( - (u) => u.uuid !== event.uuid - ); + presenceClone[event.channel].occupants = channel.occupants.filter(u => u.uuid !== event.uuid); + } + } + + if (event.action === 'state-change') { + channel.occupancy = event.occupancy; + if ( + options.includeUUIDs !== false && + Object.prototype.hasOwnProperty.call(channel, 'occupants') && + channel.occupants.find(u => u.uuid === event.uuid) + ) { + const { state, uuid } = event; + const updatedUser = channel.occupants.find(u => u.uuid === uuid); + updatedUser.state = state; + channel.occupants[uuid] = updatedUser; } }