fixed subchannel not being recognized

src/handlers/teamspeak/connectionHandler.ts

@@ -56,7 +56,7 @@ export class TS5ConnectionHandler implements ITS5ConnectionHandler {
     this.logger.log('Connecting to TS5 client...');
 
     // Create authentication payload
-    const initalPayload: IAuthSenderPayload = {
+    const initialPayload: IAuthSenderPayload = {
       type: "auth",
       payload: {
         ...this.authPayload,
@@ -68,15 +68,15 @@ export class TS5ConnectionHandler implements ITS5ConnectionHandler {
 
     this.ws.onopen = () => {
       // Send authentication payload to TS5 client
-      this.ws.send(JSON.stringify(initalPayload));
-      this.logger.wsSent(initalPayload);
+      this.ws.send(JSON.stringify(initialPayload));
+      this.logger.wsSent(initialPayload);
     };
 
     this.ws.onclose = (event) => {
       this.logger.log("WebSocket connection closed", event);
 
       // If the connection was closed before authentication, remove the API key from local storage
-      // OBS weirdly caches the localstorage and is very stubborn about clearing it (even when clicken "Clear Cache")
+      // OBS weirdly caches the localstorage and is very stubborn about clearing it (even when clicking "Clear Cache")
       if (!this.authenticated) {
         this.logger.log("WebSocket connection closed before authentication");
         localStorage.removeItem("apiKey");
@@ -120,6 +120,9 @@ export class TS5ConnectionHandler implements ITS5ConnectionHandler {
         case "channels":
           this.messageHandler.handleChannelsMessage(data);
           break;
+        case "channelCreated":
+          this.messageHandler.handleChannelCreatedMessage(data);
+          break;
         default:
           this.logger.log(`No handler for event type: ${data.type}`);
           break;

src/handlers/teamspeak/dataHandler.ts

@@ -4,7 +4,7 @@ import { IConnection, IChannel, IClient, ITS5DataHandler } from "interfaces/team
 
 /**
  * Handles data received from TS5 client (list of connections, channels and clients)
- * Updates the states of App.tsx
+ * Updates the states of useTSRemoteApp.tsx
  */
 export class TS5DataHandler implements ITS5DataHandler {
   // Local lists of connections, channels and clients
@@ -38,6 +38,18 @@ export class TS5DataHandler implements ITS5DataHandler {
     this.logger = logger;
   }
 
+  get connections(): IConnection[] {
+    return this.localConnections;
+  }
+
+  get channels(): IChannel[] {
+    return this.localChannels;
+  }
+
+  get clients(): IClient[] {
+    return this.localClients;
+  }
+
   // Update App.tsx states
   private updateConnectionsState() {
     this.setConnections([...this.localConnections]);

src/handlers/teamspeak/messageHandler.ts

@@ -1,5 +1,6 @@
 import { ILogger } from "utils/logger";
-import { IChannelInfos, IConnection, IChannel, IAuthMessage, IClientInfo, IClientMovedMessage, IClient, IClientPropertiesUpdatedMessage, ITalkStatusChangedMessage, IClientSelfPropertyUpdatedMessage, IServerPropertiesUpdatedMessage, IConnectStatusChangedMessage, IChannelsMessage, ITS5MessageHandler, ITS5DataHandler } from "interfaces/teamspeak";
+import { IChannelInfos, IConnection, IChannel, IAuthMessage, IClientInfo, IClientMovedMessage, IClient, IClientPropertiesUpdatedMessage, ITalkStatusChangedMessage, IClientSelfPropertyUpdatedMessage, IServerPropertiesUpdatedMessage, IConnectStatusChangedMessage, IChannelsMessage, ITS5MessageHandler, ITS5DataHandler, IChannelCreatedMessage } from "interfaces/teamspeak";
+import { log } from "console";
 
 // Handle incoming messages from TS5 client
 export class TS5MessageHandler implements ITS5MessageHandler {
@@ -25,15 +26,13 @@ export class TS5MessageHandler implements ITS5MessageHandler {
   parseChannelInfos(channelInfos: IChannelInfos, connection: IConnection) {
     channelInfos.rootChannels.forEach((channel: IChannel) => {
       this.dataHandler.addChannel({ ...channel, connection: connection });
-
-      if (channelInfos) {
-        if (channelInfos.subChannels !== null && channel.id in channelInfos.subChannels) {
-          channelInfos.subChannels[channel.id]?.forEach((subChannel: IChannel) => {
-            this.dataHandler.addChannel({ ...subChannel, connection: connection });
-          });
-        }
-      }
     });
+
+    for (const key in channelInfos.subChannels) {
+      channelInfos.subChannels[key]?.forEach((subChannel: IChannel) => {
+        this.dataHandler.addChannel({ ...subChannel, connection: connection });
+      });
+    }
   }
 
   // This message is sent by the TS5 server when the client is connected
@@ -70,10 +69,9 @@ export class TS5MessageHandler implements ITS5MessageHandler {
   handleClientMovedMessage(data: IClientMovedMessage) {
     const client: IClient | undefined = this.dataHandler.getClientById(data.payload.clientId, data.payload.connectionId);
 
-
     //* This gets called when we are connecting to the server and the new clients get loaded
     if (+data.payload.oldChannelId == 0) { // Create new client(when connecting to server)
-      //set timout to wait for channels to be created
+      //set timeout to wait for channels to be created
       setTimeout(() => {
         const newChannel = this.dataHandler.getChannelById(data.payload.newChannelId, data.payload.connectionId);
         if (newChannel !== undefined) {
@@ -149,6 +147,7 @@ export class TS5MessageHandler implements ITS5MessageHandler {
     // console.log(this.dataHandler.localClients)
 
   }
+
   handleClientSelfPropertyUpdatedMessage(data: IClientSelfPropertyUpdatedMessage) {
     const connection: IConnection | undefined = this.dataHandler.getConnectionById(this.activeConnectionId);
 
@@ -196,4 +195,19 @@ export class TS5MessageHandler implements ITS5MessageHandler {
       }
     }, 1000);
   }
+
+  handleChannelCreatedMessage(data: IChannelCreatedMessage) {
+    const connection = this.dataHandler.getConnectionById(data.payload.connectionId);
+
+    if (connection !== undefined) {
+      this.dataHandler.addChannel(
+        {
+          id: data.payload.channelId,
+          connection: connection,
+          order: data.payload.properties.order,
+          parentId: data.payload.parentId,
+          properties: data.payload.properties,
+        });
+    }
+  }
 }

src/interfaces/teamspeak.ts

@@ -35,6 +35,10 @@ export interface ITS5DataHandler {
   getConnectionById(id: number): IConnection | undefined;
   getChannelById(id: number, connectionId: number): IChannel | undefined;
   getClientById(id: number, connectionId: number): IClient | undefined;
+
+  readonly connections: IConnection[];
+  readonly channels: IChannel[];
+  readonly clients: IClient[];
 }
 
 export interface ITS5MessageHandler {
@@ -53,6 +57,7 @@ export interface ITS5MessageHandler {
   handleServerPropertiesUpdatedMessage(data: IServerPropertiesUpdatedMessage): void;
   handleConnectStatusChangedMessage(data: IConnectStatusChangedMessage): void;
   handleChannelsMessage(data: IChannelsMessage): void;
+  handleChannelCreatedMessage(data: IChannelCreatedMessage): void;
 }
 
 // Remote App
@@ -345,4 +350,14 @@ export interface IChannelsMessage {
     connectionId: number;
     info: IChannelInfos
   }
+}
+
+export interface IChannelCreatedMessage {
+  type: "channelCreated";
+  payload: {
+    channelId: number;
+    connectionId: number;
+    parentId: string;
+    properties: IChannelProperties;
+  }
 }