From eb483d4cd9ac732a56622982bb992ff694747a48 Mon Sep 17 00:00:00 2001 From: talksik Date: Fri, 6 May 2022 09:41:55 -0500 Subject: [PATCH] some socket stuff happening --- packages/api/sockets/index.ts | 27 +++++++++--- packages/core/sockets/channels.ts | 16 +++++++- .../src/controller/lineDataProvider.tsx | 41 ++++++++++++++++++- 3 files changed, 74 insertions(+), 10 deletions(-) diff --git a/packages/api/sockets/index.ts b/packages/api/sockets/index.ts index 3485a04..e37f47c 100644 --- a/packages/api/sockets/index.ts +++ b/packages/api/sockets/index.ts @@ -1,8 +1,12 @@ +import SocketChannels, { + ConnectToLine, + SomeoneConnected, +} from "@nirvana/core/sockets/channels"; + import GetAllSocketClients from "@nirvana/core/sockets/getAllActiveSocketClients"; import { JwtClaims } from "../middleware/auth"; import ReceiveSignal from "@nirvana/core/sockets/receiveSignal"; import SendSignal from "@nirvana/core/sockets/sendSignal"; -import SocketChannels from "@nirvana/core/sockets/channels"; import { UserService } from "../services/user.service"; import { UserStatus } from "@nirvana/core/models/user.model"; import { loadConfig } from "../config"; @@ -11,6 +15,10 @@ const jwt = require("jsonwebtoken"); const config = loadConfig(); +const socketIdsToUserIds: { + [socketId: string]: string; +} = {}; + export default function InitializeWs(io: any) { console.log("initializing web sockets"); @@ -35,6 +43,8 @@ export default function InitializeWs(io: any) { .on("connection", function (socket: any) { const userInfo: JwtClaims = socket.userInfo; + socketIdsToUserIds[socket.id] = userInfo.userId.toString(); + console.log( `a user connected | user Id: ${userInfo.userId} and name: ${userInfo.name}` ); @@ -51,16 +61,19 @@ export default function InitializeWs(io: any) { // ===== JOIN ==== /** User wants to subscribe to live emissions of a conversation */ - socket.on(SocketChannels.JOIN_ROOM, (relationshipId: string) => { + socket.on(SocketChannels.CONNECT_TO_LINE, (req: ConnectToLine) => { // add this user to the room - console.log( - `${socket.id} user joined room for relationship ${relationshipId}` - ); + console.log(`${socket.id} user joined room for line ${req.lineId}`); - socket.join(relationshipId); + socket.join(req.lineId); console.log(`${socket.id} now in rooms ${socket.rooms}`); + + io.in(req.lineId).emit( + SocketChannels.SOMEONE_CONNECTED_TO_LINE, + new SomeoneConnected(req.lineId, userInfo.userId) + ); }); // ==== UPDATES ==== @@ -164,6 +177,8 @@ export default function InitializeWs(io: any) { // ==== DISCONNECT ==== socket.on("disconnect", () => { + delete socketIdsToUserIds[socket.id]; + console.log("user disconnected"); }); }); diff --git a/packages/core/sockets/channels.ts b/packages/core/sockets/channels.ts index 274e1d6..f9ba516 100644 --- a/packages/core/sockets/channels.ts +++ b/packages/core/sockets/channels.ts @@ -1,5 +1,4 @@ enum SocketChannels { - JOIN_ROOM = "JOIN_ROOM", SEND_AUDIO_CLIP = "SEND_AUDIO_CLIP", SEND_USER_STATUS_UPDATE = "SEND_USER_STATUS_UPDATE", @@ -14,7 +13,20 @@ enum SocketChannels { RECEIVE_SIGNAL = "RECEIVE_SIGNAL", // v3 - CONNECT = "CONNECT", + + /** + * when someone connects to a line, whether tuned in or not + */ + CONNECT_TO_LINE = "CONNECT_TO_LINE", + + SOMEONE_CONNECTED_TO_LINE = "SOMEONE_CONNECTED_TO_LINE", } export default SocketChannels; + +export class ConnectToLine { + constructor(public lineId: string) {} +} +export class SomeoneConnected { + constructor(public lineId: string, public userId: string) {} +} diff --git a/packages/desktop/src/controller/lineDataProvider.tsx b/packages/desktop/src/controller/lineDataProvider.tsx index 516e12d..7c94c10 100644 --- a/packages/desktop/src/controller/lineDataProvider.tsx +++ b/packages/desktop/src/controller/lineDataProvider.tsx @@ -1,8 +1,12 @@ +import { $jwtToken, $selectedLineId } from "./recoil"; +import { + ConnectToLine, + SomeoneConnected, +} from "@nirvana/core/sockets/channels"; import React, { useContext } from "react"; import { Socket, io } from "socket.io-client"; import { useCallback, useEffect, useState } from "react"; -import { $jwtToken } from "./recoil"; import MasterLineData from "@nirvana/core/models/masterLineData.model"; import SocketChannels from "@nirvana/core/sockets/channels"; import { User } from "@nirvana/core/models"; @@ -35,6 +39,7 @@ export function LineDataProvider({ children }) { // ?just do simple synchronous axios/fetch in useEffect and manage isLoading ourselves? const { data: basicUserLinesData } = useUserLines(); const jwtToken = useRecoilValue($jwtToken); + const selectedLineId = useRecoilValue($selectedLineId); const [linesMap, setLinesMap] = useState({}); @@ -43,7 +48,7 @@ export function LineDataProvider({ children }) { query: { token: jwtToken }, }); - $ws.on("connection", () => toast.success("you are connected")); + $ws.on("connect", () => toast.success("you are connected")); // client-side errors $ws.on("connect_error", (err) => { @@ -55,6 +60,15 @@ export function LineDataProvider({ children }) { // this should overall remount this component currently which is what we want for new data queryClient.invalidateQueries("SERVER_CHECK"); }); + + $ws.on( + SocketChannels.SOMEONE_CONNECTED_TO_LINE, + (res: SomeoneConnected) => { + toast( + `another user (${res.userId}) tuned into line ${res.lineId} that you are in also` + ); + } + ); }, []); // connect through ws to enrich basic lines data @@ -87,6 +101,29 @@ export function LineDataProvider({ children }) { } }, [basicUserLinesData]); + // on change of line Id, we want to toggle tune into the line + useEffect(() => { + if (selectedLineId) handleToggleTune(selectedLineId, true, true); + }, [selectedLineId]); + + /** + * toggle into a specific line + * @param temporary: denotes whether we are just listening in or want to persist "toggling" it on so that it shows up in overlay + * TODO: have loading state for this particular part of context value + */ + + const handleToggleTune = ( + lineId: string, + turnOn: boolean = true, + temporary: boolean = true + ) => { + // they already are in the socket room for updates including media connections and disconnections + // but set the flag so that the line row can know whether or not to start the webrtc process + // and know when to get out or disconnect from the webrtc when the flag turns off + + $ws.emit(SocketChannels.CONNECT_TO_LINE, new ConnectToLine(lineId)); + }; + /** * get more audio blocks for a certain line */