Merge pull request #4 from Lucas8448/Lucas

Fix errors
Lucas8448 · Jan 5, 2024 · 60e46ba · 60e46ba
2 parents c9cd10f + ead8d2a
commit 60e46ba
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 27 deletions.
diff --git a/src/Client.jsx b/src/Client.jsx
@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useCallback } from 'react';
 import Peer from 'peerjs';
 
 const Client = () => {
@@ -8,6 +8,12 @@ const Client = () => {
   const [peer, setPeer] = useState(null);
   const [conn, setConn] = useState(null);
 
+  const connectToHost = useCallback(() => {
+    if (!peer) return;
+    const connection = peer.connect("PostIt" + hostId);
+    setupConnection(connection);
+  }, [peer, hostId]);
+
   useEffect(() => {
     const newPeer = new Peer();
     newPeer.on('open', id => {
@@ -27,13 +33,7 @@ const Client = () => {
     }, 5000);
 
     return () => clearInterval(intervalId); // Cleanup on unmount
-  }, [peer, conn]);
-
-  const connectToHost = () => {
-    if (!peer) return;
-    const connection = peer.connect("PostIt" + hostId);
-    setupConnection(connection);
-  };
+  }, [peer, conn, connectToHost]);
 
   const setupConnection = (connection) => {
     setConn(connection);
@@ -90,4 +90,4 @@ const Client = () => {
   );
 };
 
-export default Client;
+export default Client;
diff --git a/src/Host.jsx b/src/Host.jsx
@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useCallback } from 'react';
 import Peer from 'peerjs';
 
 const Host = () => {
@@ -14,6 +14,22 @@ const Host = () => {
     }
     return numbers;
   }
+
+  const setupConnection = useCallback((connection) => {
+    setConn(connection);
+    connection.on('open', () => {
+      alert('A client has connected!');
+    });
+
+    connection.on('data', data => {
+      handleData(data)
+    });
+
+    connection.on('error', err => {
+      console.error('Connection error:', err);
+      setConn(null);
+    });
+  }, []);
 
   useEffect(() => {
     const newPeer = new Peer("PostIt" + generateID());
@@ -34,23 +50,7 @@ const Host = () => {
     }, 5000); // Check every 5 seconds
 
     return () => clearInterval(intervalId); // Cleanup on unmount
-  }, [conn]);
-
-  const setupConnection = (connection) => {
-    setConn(connection);
-    connection.on('open', () => {
-      alert('A client has connected!');
-    });
-
-    connection.on('data', data => {
-      handleData(data)
-    });
-
-    connection.on('error', err => {
-      console.error('Connection error:', err);
-      setConn(null);
-    });
-  };
+  }, [conn, setupConnection]);
 
   const sendData = () => {
     if (conn && conn.open) {