From 14a6b80a44594046acf79bbf52ab7bf5f3d30dfd Mon Sep 17 00:00:00 2001 From: cha0s Date: Sun, 13 Dec 2020 04:49:23 -0600 Subject: [PATCH] refactor: useSocket --- app/src/react/components/chat/index.jsx | 5 +- app/src/react/components/dispatcher.jsx | 98 ++++++++++++------------- 2 files changed, 49 insertions(+), 54 deletions(-) diff --git a/app/src/react/components/chat/index.jsx b/app/src/react/components/chat/index.jsx index 1b52f06..d81e71a 100644 --- a/app/src/react/components/chat/index.jsx +++ b/app/src/react/components/chat/index.jsx @@ -28,7 +28,8 @@ export default function Chat() { const hasChannel = !!useSelector((state) => channelSelector(state, channel)); const historyLength = useSelector(historyLengthSelector); const renderedChannel = renderChannel(channel); - useSocket((socket) => { + const socket = useSocket(); + useEffect(() => { let handle; const load = throttle(async () => { setActivity(await socket.send(['Activity'])); @@ -41,7 +42,7 @@ export default function Chat() { clearInterval(handle); } }; - }, [channel]); + }, [channel, socket]); const isAllowed = user.id > 0 || !!channel; useEffect(() => { if (!isAllowed) { diff --git a/app/src/react/components/dispatcher.jsx b/app/src/react/components/dispatcher.jsx index 8d349f6..2b3c12f 100644 --- a/app/src/react/components/dispatcher.jsx +++ b/app/src/react/components/dispatcher.jsx @@ -1,6 +1,6 @@ import {useDispatch, useSelector} from 'react-redux'; -import {useSocket} from '@latus/socket/client'; +import {useSocketPacket} from '@latus/socket/client'; import { addMessage, joined, @@ -20,58 +20,52 @@ import { export default function Dispatcher() { const dispatch = useDispatch(); const id = useSelector(idSelector); - useSocket((socket) => { - const onPacket = (packet) => { - switch (packet.constructor.name) { - case 'AddFriend': { - const {adderId, addeeId, name} = packet.data; - dispatch(addFriendship({ - addeeId, - adderId, - status: 'pending', - })); - dispatch(setUsernames({[id === adderId ? addeeId : adderId]: name})); - break; - } - case 'Block': { - dispatch(block(packet.data)); - break; - } - case 'ConfirmFriend': { - dispatch(confirmFriendship(packet.data)); - break; - } - case 'Message': { - dispatch(addMessage(packet.data)); - break; - } - case 'Join': { - dispatch(joined(packet.data)); - break; - } - case 'Leave': { - dispatch(left(packet.data)); - break; - } - case 'RemoveFriend': { - dispatch(removeFriendship(packet.data)); - break; - } - case 'RemoveFavorite': { - dispatch(removeFromFavorites(packet.data)); - break; - } - case 'Unblock': { - dispatch(unblock(packet.data)); - break; - } - default: + useSocketPacket((packet) => { + switch (packet.constructor.name) { + case 'AddFriend': { + const {adderId, addeeId, name} = packet.data; + dispatch(addFriendship({ + addeeId, + adderId, + status: 'pending', + })); + dispatch(setUsernames({[id === adderId ? addeeId : adderId]: name})); + break; } - }; - socket.on('packet', onPacket); - socket.on('disconnect', () => socket.off('packet', onPacket)); - socket.on('reconnect', () => socket.on('packet', onPacket)); - return () => socket.off('packet', onPacket); + case 'Block': { + dispatch(block(packet.data)); + break; + } + case 'ConfirmFriend': { + dispatch(confirmFriendship(packet.data)); + break; + } + case 'Message': { + dispatch(addMessage(packet.data)); + break; + } + case 'Join': { + dispatch(joined(packet.data)); + break; + } + case 'Leave': { + dispatch(left(packet.data)); + break; + } + case 'RemoveFriend': { + dispatch(removeFriendship(packet.data)); + break; + } + case 'RemoveFavorite': { + dispatch(removeFromFavorites(packet.data)); + break; + } + case 'Unblock': { + dispatch(unblock(packet.data)); + break; + } + default: + } }, []); return null; }