js/src/hooks/use-channel.ts

@@ -22,12 +22,6 @@ export function useChannel(channelId: string | null): UseChannelResult {
   const [presence, setPresence] = useState<string[]>([]);
   const [messages, setMessages] = useState<ChannelMessage[]>([]);
 
-  // Keep a ref to avoid re-subscribing when sendMessage changes
-  const clientRef = useRef(client);
-  const channelRef = useRef(channelId);
-  clientRef.current = client;
-  channelRef.current = channelId;
-
   useEffect(() => {
     if (!client || !channelId) {
       setPresence([]);
@@ -80,11 +74,11 @@ export function useChannel(channelId: string | null): UseChannelResult {
 
   const sendMessage = useCallback(
     (payload: unknown) => {
-      if (clientRef.current && channelRef.current) {
-        clientRef.current.sendMessage(channelRef.current, payload);
+      if (client && channelId) {
+        client?.sendMessage(channelId, payload);
       }
     },
-    [],
+    [client, channelId],
   );
 
   return { presence, messages, sendMessage };