import socket.js

apsinghdev · apsinghdev · commit 1c02c06ad961 · 2024-08-03T18:48:17.000+05:30
diff --git a/api/index.js b/api/index.js
@@ -26,12 +26,12 @@ app.get('/test', (req, res) => {
     res.send(JSON.stringify({ok: true}));
 })
 
-io.on('connection', (socket)=>{
+io.on('connection', (socket) => {
     console.log('user connected socket')
     socket.on('draw', (data)=>{
         socket.broadcast.emit('draw', data);
     })
-    socket.on('clear', ()=>{
+    socket.on('clear', () => {
         io.emit('clear');
     })
 })
diff --git a/client/index.html b/client/index.html
@@ -9,5 +9,6 @@
   <body>
     <div id="root"></div>
     <script type="module" src="/src/main.jsx"></script>
+    <script src="./src/socket.js"></script>
   </body>
 </html>
diff --git a/client/src/App.jsx b/client/src/App.jsx
@@ -3,7 +3,7 @@ import { useEffect, useRef, useState } from "react";
 import "./App.css";
 import * as Y from "yjs";
 import { SocketIOProvider } from "y-socket.io";
-import socket from "./Socket";
+import socket from "./socket";
 
 import Sidebar from "./components/Sidebar";
 import Canvas from "./components/Canvas";
@@ -22,6 +22,8 @@ import {
   textEditorInput
 } from "./atoms";
 
+socket.connect();
+
 function App() {
   const [showMenu, setShowMenu] = useRecoilState(showMenuState);
   const eraserMode = useRecoilValue(eraserState);
diff --git a/client/src/socket.js b/client/src/socket.js
@@ -4,4 +4,8 @@ const PORT = "http://localhost:8000";
 
 const socket = io(PORT);
 
+socket.on("connect", () => {
+    console.log("connected");
+});
+
 export default socket;
