diff --git a/package.json b/package.json index 9b5e53d..de04339 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-ts5-remote-app-api", - "version": "1.0.5", + "version": "1.1.0", "description": "React hook/api for the TeamSpeak5 remote app feature", "main": "dist/cjs/index.js", "module": "dist/esm/index.js", diff --git a/src/handlers/teamspeak/connectionHandler.ts b/src/handlers/teamspeak/connectionHandler.ts index 1fda297..1d23e8f 100644 --- a/src/handlers/teamspeak/connectionHandler.ts +++ b/src/handlers/teamspeak/connectionHandler.ts @@ -2,6 +2,7 @@ import { IAuthSenderPayload, IChannel, IClient, IConnection, ITS5ConnectionHandl import { TS5DataHandler } from "./dataHandler"; import { TS5MessageHandler } from "./messageHandler"; import Logger from "../../utils/logger"; +import { ITSRemoteAppAuthPayloadOptions } from "../../interfaces/api"; // Establish connection to TS5 client @@ -10,13 +11,14 @@ export class TS5ConnectionHandler implements ITS5ConnectionHandler { ws: WebSocket; // Websocket connection to TS5 client authenticated = false; // Is the connection authenticated? remoteAppPort: number; // Port of TS5 client + authPayload: ITSRemoteAppAuthPayloadOptions; // Authentication payload dataHandler: ITS5DataHandler; // Handles data/lists and states messageHandler: ITS5MessageHandler; // Handles messages received from TS5 client constructor( // Port of TS5 client remoteAppPort: number, - + authPayload: ITSRemoteAppAuthPayloadOptions, // State setters for dataHandler setConnections: React.Dispatch>, setChannels: React.Dispatch>, @@ -27,6 +29,7 @@ export class TS5ConnectionHandler implements ITS5ConnectionHandler { // Create websocket connection to TS5 client this.remoteAppPort = remoteAppPort; + this.authPayload = authPayload; this.ws = new WebSocket(`ws://localhost:${this.remoteAppPort}`); // Create dataHandler and messageHandler @@ -53,14 +56,11 @@ export class TS5ConnectionHandler implements ITS5ConnectionHandler { const initalPayload: IAuthSenderPayload = { type: "auth", payload: { - identifier: "de.tealfire.obs", - version: "1.1.3", - name: "TS5 OBS Overlay", - description: "A OBS overlay for TS5 by DerTyp876", + ...this.authPayload, content: { apiKey: localStorage.getItem("apiKey") ?? "", }, - }, + } }; this.ws.onopen = () => { diff --git a/src/hooks/useTSRemoteApp.tsx b/src/hooks/useTSRemoteApp.tsx index 091e5d8..aeb1629 100644 --- a/src/hooks/useTSRemoteApp.tsx +++ b/src/hooks/useTSRemoteApp.tsx @@ -1,9 +1,10 @@ /* eslint-disable react-hooks/exhaustive-deps */ import { TS5ConnectionHandler } from "../handlers/teamspeak/connectionHandler"; +import { ITSRemoteAppOptions } from "../interfaces/api"; import { IClient, IChannel, IConnection, ITS5ConnectionHandler } from "../interfaces/teamspeak"; import { useEffect, useState } from "react"; -export default function useTSRemoteApp({ remoteAppPort = 5899 }: { remoteAppPort: number }) { +export default function useTSRemoteApp(options: ITSRemoteAppOptions) { const [clients, setClients] = useState([]); const [channels, setChannels] = useState([]); const [connections, setConnections] = useState([]); @@ -17,7 +18,8 @@ export default function useTSRemoteApp({ remoteAppPort = 5899 }: { remoteAppPort useEffect(() => { const tsConnection: ITS5ConnectionHandler = new TS5ConnectionHandler( - remoteAppPort, + options.remoteAppPort ?? 5899, + options.auth, setConnections, setChannels, setClients, diff --git a/src/interfaces/api.ts b/src/interfaces/api.ts new file mode 100644 index 0000000..82b89a8 --- /dev/null +++ b/src/interfaces/api.ts @@ -0,0 +1,11 @@ +export interface ITSRemoteAppOptions { + remoteAppPort: number; + auth: ITSRemoteAppAuthPayloadOptions, +} + +export interface ITSRemoteAppAuthPayloadOptions { + identifier: string, + version: string, + name: string, + description: string +} \ No newline at end of file diff --git a/src/interfaces/teamspeak.ts b/src/interfaces/teamspeak.ts index 5f50673..d49bddb 100644 --- a/src/interfaces/teamspeak.ts +++ b/src/interfaces/teamspeak.ts @@ -1,8 +1,11 @@ +import { ITSRemoteAppAuthPayloadOptions } from "./api"; + // Classes export interface ITS5ConnectionHandler { ws: WebSocket; authenticated: boolean; remoteAppPort: number; + authPayload: ITSRemoteAppAuthPayloadOptions; dataHandler: ITS5DataHandler; messageHandler: ITS5MessageHandler; reconnect(): void;