@fishjam-cloud/react-client 0.12.0 → 0.13.0

package/dist/hooks/devices/useMicrophone.d.ts

@@ -19,7 +19,8 @@ export declare function useMicrophone(): {
     isMicrophoneOn: boolean;
     /**
      * Indicates whether the microphone is muted
-     */ isMicrophoneMuted: boolean;
+     */
+    isMicrophoneMuted: boolean;
     /**
      * The MediaStream object containing the current audio stream
      */

package/dist/hooks/devices/useMicrophone.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useMicrophone.d.ts","sourceRoot":"","sources":["../../../src/hooks/devices/useMicrophone.ts"],"names":[],"mappings":"AAGA;;;GAGG;AACH,wBAAgB,aAAa;IAKzB,wCAAwC;;IAExC,mCAAmC;;IAEnC,oCAAoC;;IAEpC;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;IACH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;EAGN"}
+{"version":3,"file":"useMicrophone.d.ts","sourceRoot":"","sources":["../../../src/hooks/devices/useMicrophone.ts"],"names":[],"mappings":"AAGA;;;GAGG;AACH,wBAAgB,aAAa;IAKzB,wCAAwC;;IAExC,mCAAmC;;IAEnC,oCAAoC;;IAEpC;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;EAGN"}

package/dist/hooks/devices/useMicrophone.js

@@ -24,7 +24,8 @@ export function useMicrophone() {
         isMicrophoneOn: !!deviceApi.mediaStream,
         /**
          * Indicates whether the microphone is muted
-         */ isMicrophoneMuted: audioTrackManager.paused,
+         */
+        isMicrophoneMuted: audioTrackManager.paused,
         /**
          * The MediaStream object containing the current audio stream
          */

package/dist/hooks/internal/useTrackManager.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useTrackManager.d.ts","sourceRoot":"","sources":["../../../src/hooks/internal/useTrackManager.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,aAAa,EAA+B,MAAM,0BAA0B,CAAC;AAG3F,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACvE,OAAO,KAAK,EAAE,eAAe,EAAE,UAAU,EAAE,YAAY,EAAmB,MAAM,oBAAoB,CAAC;AAGrG,UAAU,kBAAkB;IAC1B,YAAY,EAAE,YAAY,CAAC;IAC3B,QAAQ,EAAE,aAAa,CAAC;IACxB,oBAAoB,EAAE,MAAM,UAAU,CAAC;IACvC,eAAe,EAAE,eAAe,CAAC;IACjC,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B;AAWD,eAAO,MAAM,eAAe,qFAMzB,kBAAkB,KAAG,YAsKvB,CAAC"}
+{"version":3,"file":"useTrackManager.d.ts","sourceRoot":"","sources":["../../../src/hooks/internal/useTrackManager.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,aAAa,EAA+B,MAAM,0BAA0B,CAAC;AAG3F,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACvE,OAAO,KAAK,EAAE,eAAe,EAAE,UAAU,EAAE,YAAY,EAAmB,MAAM,oBAAoB,CAAC;AAGrG,UAAU,kBAAkB;IAC1B,YAAY,EAAE,YAAY,CAAC;IAC3B,QAAQ,EAAE,aAAa,CAAC;IACxB,oBAAoB,EAAE,MAAM,UAAU,CAAC;IACvC,eAAe,EAAE,eAAe,CAAC;IACjC,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B;AAWD,eAAO,MAAM,eAAe,qFAMzB,kBAAkB,KAAG,YA8KvB,CAAC"}

package/dist/hooks/internal/useTrackManager.js

@@ -1,5 +1,5 @@
 import { Variant } from "@fishjam-cloud/ts-client";
-import { useCallback, useEffect, useMemo, useState } from "react";
+import { useCallback, useEffect, useRef, useState } from "react";
 import { getConfigAndBandwidthFromProps, getRemoteOrLocalTrack } from "../../utils/track";
 const TRACK_TYPE_TO_DEVICE = {
     video: "camera",
@@ -7,21 +7,23 @@ const TRACK_TYPE_TO_DEVICE = {
 };
 const getDeviceType = (mediaManager) => TRACK_TYPE_TO_DEVICE[mediaManager.getDeviceType()];
 export const useTrackManager = ({ mediaManager, tsClient, getCurrentPeerStatus, bandwidthLimits, streamConfig, }) => {
-    const [currentTrackId, setCurrentTrackId] = useState(null);
+    const currentTrackIdRef = useRef(null);
     const [paused, setPaused] = useState(false);
-    const currentTrack = useMemo(() => getRemoteOrLocalTrack(tsClient, currentTrackId), [tsClient, currentTrackId]);
     async function setTrackMiddleware(middleware) {
         mediaManager.setTrackMiddleware(middleware);
         await refreshStreamedTrack();
     }
     async function selectDevice(deviceId) {
         await mediaManager?.start(deviceId);
+        const currentTrackId = currentTrackIdRef.current;
         if (!currentTrackId)
             return;
         const newTrack = mediaManager.getMedia()?.track ?? null;
         await tsClient.replaceTrack(currentTrackId, newTrack);
     }
+    const getCurrentTrackId = useCallback(() => getRemoteOrLocalTrack(tsClient, currentTrackIdRef.current)?.trackId, [tsClient]);
     const startStreaming = useCallback(async (props = { simulcast: [Variant.VARIANT_LOW, Variant.VARIANT_MEDIUM, Variant.VARIANT_HIGH] }) => {
+        const currentTrackId = currentTrackIdRef.current;
         if (currentTrackId)
             throw Error("Track already added");
         const media = mediaManager.getMedia();
@@ -31,7 +33,7 @@ export const useTrackManager = ({ mediaManager, tsClient, getCurrentPeerStatus,
         if (track)
             return track.trackId;
         // see `getRemoteOrLocalTrackContext()` explanation
-        setCurrentTrackId(media.track.id);
+        currentTrackIdRef.current = media.track.id;
         const deviceType = getDeviceType(mediaManager);
         const trackMetadata = { type: deviceType, paused: false };
         const displayName = tsClient.getLocalPeer()?.metadata?.peer?.displayName;
@@ -40,56 +42,61 @@ export const useTrackManager = ({ mediaManager, tsClient, getCurrentPeerStatus,
         }
         const [maxBandwidth, simulcastConfig] = getConfigAndBandwidthFromProps(props.simulcast, bandwidthLimits);
         const remoteTrackId = await tsClient.addTrack(media.track, trackMetadata, simulcastConfig, maxBandwidth);
-        setCurrentTrackId(remoteTrackId);
+        currentTrackIdRef.current = remoteTrackId;
         setPaused(false);
         return remoteTrackId;
-    }, [currentTrackId, mediaManager, tsClient, bandwidthLimits]);
+    }, [mediaManager, tsClient, bandwidthLimits]);
     const refreshStreamedTrack = useCallback(async () => {
-        if (!currentTrack)
+        const trackId = getCurrentTrackId();
+        if (!trackId)
             return;
         const newTrack = mediaManager.getMedia()?.track ?? null;
         if (!newTrack)
             throw Error("New track is empty");
-        return tsClient.replaceTrack(currentTrack.trackId, newTrack);
-    }, [currentTrack, mediaManager, tsClient]);
+        return tsClient.replaceTrack(trackId, newTrack);
+    }, [getCurrentTrackId, mediaManager, tsClient]);
     const pauseStreaming = useCallback(async () => {
-        if (!currentTrack)
+        const trackId = getCurrentTrackId();
+        if (!trackId)
             return;
         setPaused(true);
-        await tsClient.replaceTrack(currentTrack.trackId, null);
+        await tsClient.replaceTrack(trackId, null);
         const deviceType = getDeviceType(mediaManager);
         const trackMetadata = { type: deviceType, paused: true };
-        return tsClient.updateTrackMetadata(currentTrack.trackId, trackMetadata);
-    }, [currentTrack, mediaManager, tsClient]);
+        return tsClient.updateTrackMetadata(trackId, trackMetadata);
+    }, [mediaManager, getCurrentTrackId, tsClient]);
     const resumeStreaming = useCallback(async () => {
-        if (!currentTrack)
+        const trackId = getCurrentTrackId();
+        if (!trackId)
             return;
         const media = mediaManager.getMedia();
         const deviceType = getDeviceType(mediaManager);
         if (!media)
             throw Error("Device is unavailable");
         setPaused(false);
-        await tsClient.replaceTrack(currentTrack.trackId, media.track);
+        await tsClient.replaceTrack(trackId, media.track);
         const trackMetadata = { type: deviceType, paused: false };
-        return tsClient.updateTrackMetadata(currentTrack.trackId, trackMetadata);
-    }, [currentTrack, mediaManager, tsClient]);
+        return tsClient.updateTrackMetadata(trackId, trackMetadata);
+    }, [mediaManager, tsClient, getCurrentTrackId]);
     const stream = useCallback(async () => {
         if (getCurrentPeerStatus() !== "connected")
             return;
-        if (currentTrack?.trackId) {
+        const trackId = getRemoteOrLocalTrack(tsClient, currentTrackIdRef.current)?.trackId;
+        if (trackId) {
             await resumeStreaming();
         }
         else {
             await startStreaming();
         }
-    }, [currentTrack?.trackId, getCurrentPeerStatus, resumeStreaming, startStreaming]);
+    }, [tsClient, getCurrentPeerStatus, resumeStreaming, startStreaming]);
     const toggle = useCallback(async (mode) => {
         const mediaStream = mediaManager.getMedia()?.stream;
         const track = mediaManager.getMedia()?.track ?? null;
         const enabled = Boolean(track?.enabled);
+        const trackId = getRemoteOrLocalTrack(tsClient, currentTrackIdRef.current)?.trackId;
         if (mediaStream && enabled) {
             mediaManager.disable();
-            if (currentTrack?.trackId) {
+            if (trackId) {
                 await pauseStreaming();
             }
             if (mode === "hard") {
@@ -104,7 +111,7 @@ export const useTrackManager = ({ mediaManager, tsClient, getCurrentPeerStatus,
             await mediaManager.start();
             await stream();
         }
-    }, [currentTrack, mediaManager, pauseStreaming, stream]);
+    }, [tsClient, mediaManager, pauseStreaming, stream]);
     /**
      * @see {@link TrackManager#toggleMute} for more details.
      */
@@ -121,7 +128,7 @@ export const useTrackManager = ({ mediaManager, tsClient, getCurrentPeerStatus,
         };
         const onLeftRoom = () => {
             setPaused(true);
-            setCurrentTrackId(null);
+            currentTrackIdRef.current = null;
         };
         tsClient.on("joined", onJoinedRoom);
         tsClient.on("disconnected", onLeftRoom);
@@ -129,11 +136,10 @@ export const useTrackManager = ({ mediaManager, tsClient, getCurrentPeerStatus,
             tsClient.off("joined", onJoinedRoom);
             tsClient.off("disconnected", onLeftRoom);
         };
-    }, [mediaManager, startStreaming, tsClient, streamConfig, currentTrackId]);
+    }, [mediaManager, startStreaming, tsClient, streamConfig]);
     return {
-        currentTrack,
-        setTrackMiddleware,
         paused,
+        setTrackMiddleware,
         selectDevice,
         toggleMute,
         toggleDevice,

package/dist/types/internal.d.ts

@@ -1,5 +1,5 @@
 import type { Peer } from "@fishjam-cloud/ts-client";
-import type { DeviceError, DeviceType, PeerId, Track, TrackMiddleware, TracksMiddleware } from "./public";
+import type { DeviceError, DeviceType, PeerId, TrackMiddleware, TracksMiddleware } from "./public";
 export type DevicesStatus = "OK" | "Error" | "Not requested" | "Requesting";
 export type MediaStatus = "OK" | "Error" | "Not requested" | "Requesting";
 export type DeviceManagerStatus = "uninitialized" | "initializing" | "initialized" | "error";
@@ -56,7 +56,6 @@ export interface TrackManager {
     selectDevice: (deviceId?: string) => Promise<void>;
     paused: boolean;
     setTrackMiddleware: (middleware: TrackMiddleware | null) => Promise<void>;
-    currentTrack: Track | null;
     /**
      * Either enables or disables the stream.
      *

package/dist/types/internal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../src/types/internal.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../src/types/internal.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fishjam-cloud/react-client",
-  "version": "0.12.0",
+  "version": "0.13.0",
   "description": "React client library for Fishjam",
   "license": "Apache-2.0",
   "author": "Fishjam Team",
@@ -50,7 +50,7 @@
     "typescript": "^5.7.3"
   },
   "dependencies": {
-    "@fishjam-cloud/ts-client": "0.12.0",
+    "@fishjam-cloud/ts-client": "0.13.0",
     "events": "3.3.0",
     "lodash.isequal": "4.5.0"
   },