Elegant handling of 'leave graph'

sofvanh · Jan 8, 2025 · aeb5bb4 · aeb5bb4
1 parent 628368a
commit aeb5bb4
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 10 deletions.
diff --git a/backend/src/index.ts b/backend/src/index.ts
@@ -4,13 +4,13 @@ import { Server } from 'socket.io';
 import config from './config';
 import { handleAuthenticate } from './websocket/auth/authenticate';
 import { handleLogout } from './websocket/auth/logout';
-import { handleLeaveGraph } from './websocket/graphHandler';
 import { handleAddArgument } from './websocket/argumentHandler';
 import { handleAddReaction, handleRemoveReaction } from './websocket/reactionHandler';
 import { SocketHandler, SocketResponse } from './backendTypes';
 import { handleGetGraphs } from './websocket/graph/getGraphs';
 import { handleCreateGraph } from './websocket/graph/createGraph';
 import { handleJoinGraph } from './websocket/graph/joinGraph';
+import { handleLeaveGraph } from './websocket/graph/leaveGraph';
 
 const app = express();
 const server = http.createServer(app);
@@ -60,8 +60,8 @@ io.on('connection', (socket) => {
   socket.on('get graphs', wrapHandler(handleGetGraphs));
   socket.on('create graph', wrapHandler(handleCreateGraph));
   socket.on('join graph', wrapHandler(handleJoinGraph));
+  socket.on('leave graph', wrapHandler(handleLeaveGraph));
   // TODO Finish transition
-  socket.on('leave graph', (graphId: string) => handleLeaveGraph(socket, graphId));
   socket.on('add argument', (args, callback) => handleAddArgument(socket, io, args, callback));
   socket.on('add reaction', (args, callback) => handleAddReaction(socket, io, args, callback));
   socket.on('remove reaction', (args, callback) => handleRemoveReaction(socket, io, args, callback));

diff --git a/backend/src/websocket/graph/leaveGraph.ts b/backend/src/websocket/graph/leaveGraph.ts
@@ -0,0 +1,11 @@
+import { SocketHandler } from "../../backendTypes";
+
+interface LeaveGraphData {
+  graphId: string;
+}
+
+export const handleLeaveGraph: SocketHandler<LeaveGraphData, {}> = async (socket, io, { graphId }) => {
+  console.log(`Socket ${socket.id} leaving graph ${graphId}`);
+  socket.leave(graphId);
+  return { success: true };
+}
diff --git a/backend/src/websocket/graphHandler.ts b/backend/src/websocket/graphHandler.ts
diff --git a/frontend/src/hooks/useGraph.ts b/frontend/src/hooks/useGraph.ts
@@ -59,7 +59,11 @@ export function useGraph(graphId: string) {
       });
     });
     return () => {
-      socket?.emit('leave graph', graphId);
+      socket?.emit('leave graph', { graphId }, (response: any) => {
+        if (!response.success) {
+          console.error('Failed to leave graph:', response.error);
+        }
+      });
       socket?.off('graph update');
       socket?.off('argument added');
       socket?.off('user reaction update');