next-ws 0.2.6 → 0.2.7

package/README.md

@@ -164,20 +164,21 @@ import { useCallback, useEffect, useState } from 'react';
 
 export default function Page() {
   const ws = useWebSocket();
-  //  ^? WebSocket on the client, null on the server
+  //    ^? WebSocket on the client, null on the server
 
   const [value, setValue] = useState('');
-  const [message, setMessage] = useState<string | null>('');
-
-  const onMessage = useCallback((event: MessageEvent) => {
-    const text = await event.data.text();
-    setMessage(text);
-  }, []);
+  const [message, setMessage] = useState<string | null>(null);
 
+  const onMessage = useCallback(
+    (event: MessageEvent<Blob>) =>
+      void event.data.text().then(setMessage),
+    [],
+  );
+  
   useEffect(() => {
     ws?.addEventListener('message', onMessage);
     return () => ws?.removeEventListener('message', onMessage);
-  }, [ws]);
+  }, [onMessage, ws]);
 
   return <>
     <input
@@ -186,15 +187,16 @@ export default function Page() {
       onChange={event => setValue(event.target.value)}
     />
 
-    <button onClick={() => ws.send(value)}>
+    <button onClick={() => ws?.send(value)}>
       Send message to server
     </button>
 
     <p>
       {message === null
-        ? 'Waiting for server to send a message...'
+        ? 'Waiting to receive message...'
         : `Got message: ${message}`}
     </p>
   </>;
 }
+
 ```

package/client/context.js

@@ -22,7 +22,9 @@ function WebSocketProvider({ children, url, protocols, binaryType, }) {
         return client;
     }, [isBrowser, url, protocols]);
     (0, react_1.useEffect)(() => {
-        return () => instance?.close();
+        if (instance?.readyState !== WebSocket.OPEN)
+            return;
+        return () => instance.close();
     }, []);
     return (0, jsx_runtime_1.jsx)(exports.WebSocketContext.Provider, { value: instance, children: children });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "next-ws",
-  "version": "0.2.6",
+  "version": "0.2.7",
   "description": "Add support for WebSockets in Next.js 13 app directory",
   "keywords": [
     "next",