some socket stuff happening

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");
       });
     });

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) {}
+}

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<LineIdToMasterLine>({});
 
@@ -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
    */