@fishjam-cloud/react-client 0.13.0 → 0.14.1

package/dist/hooks/internal/devices/useDeviceManager.d.ts

@@ -0,0 +1,29 @@
+import type { SetStateAction } from "react";
+import type { DeviceError, DeviceItem, TrackMiddleware } from "../../../types/public";
+type DeviceManagerProps = {
+    mediaStream: MediaStream | null;
+    setMediaStream: (action: SetStateAction<MediaStream | null>) => void;
+    deviceError: DeviceError | null;
+    setDeviceError: (action: SetStateAction<DeviceError | null>) => void;
+    getInitialStream: () => Promise<MediaStream | null>;
+    deviceType: "audio" | "video";
+    allDevicesList: MediaDeviceInfo[];
+    constraints?: MediaTrackConstraints | boolean;
+    saveUsedDevice: (device: MediaDeviceInfo) => void;
+};
+export type DeviceManager = {
+    startDevice: (deviceId?: string) => Promise<[MediaStreamTrack, null] | [null, DeviceError]>;
+    stopDevice: () => void;
+    activeDevice: DeviceItem | null;
+    deviceTrack: MediaStreamTrack | null;
+    deviceList: DeviceItem[];
+    deviceEnabled: boolean;
+    enableDevice: () => void;
+    disableDevice: () => void;
+    currentMiddleware: TrackMiddleware;
+    applyMiddleware: (middleware: TrackMiddleware) => MediaStreamTrack | null;
+    deviceError: DeviceError | null;
+};
+export declare const useDeviceManager: ({ mediaStream, getInitialStream, deviceType, allDevicesList, setMediaStream, constraints, saveUsedDevice, deviceError, setDeviceError, }: DeviceManagerProps) => DeviceManager;
+export {};
+//# sourceMappingURL=useDeviceManager.d.ts.map

package/dist/hooks/internal/devices/useDeviceManager.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDeviceManager.d.ts","sourceRoot":"","sources":["../../../../src/hooks/internal/devices/useDeviceManager.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAG5C,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAKtF,KAAK,kBAAkB,GAAG;IACxB,WAAW,EAAE,WAAW,GAAG,IAAI,CAAC;IAChC,cAAc,EAAE,CAAC,MAAM,EAAE,cAAc,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,IAAI,CAAC;IACrE,WAAW,EAAE,WAAW,GAAG,IAAI,CAAC;IAChC,cAAc,EAAE,CAAC,MAAM,EAAE,cAAc,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,IAAI,CAAC;IACrE,gBAAgB,EAAE,MAAM,OAAO,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACpD,UAAU,EAAE,OAAO,GAAG,OAAO,CAAC;IAC9B,cAAc,EAAE,eAAe,EAAE,CAAC;IAClC,WAAW,CAAC,EAAE,qBAAqB,GAAG,OAAO,CAAC;IAC9C,cAAc,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,IAAI,CAAC;CACnD,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,WAAW,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,KAAK,OAAO,CAAC,CAAC,gBAAgB,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC,CAAC;IAC5F,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,YAAY,EAAE,UAAU,GAAG,IAAI,CAAC;IAChC,WAAW,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACrC,UAAU,EAAE,UAAU,EAAE,CAAC;IACzB,aAAa,EAAE,OAAO,CAAC;IACvB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,iBAAiB,EAAE,eAAe,CAAC;IACnC,eAAe,EAAE,CAAC,UAAU,EAAE,eAAe,KAAK,gBAAgB,GAAG,IAAI,CAAC;IAC1E,WAAW,EAAE,WAAW,GAAG,IAAI,CAAC;CACjC,CAAC;AAsCF,eAAO,MAAM,gBAAgB,GAAI,0IAU9B,kBAAkB,KAAG,aAuFvB,CAAC"}

package/dist/hooks/internal/devices/useDeviceManager.js

@@ -0,0 +1,95 @@
+import { useCallback, useMemo, useState } from "react";
+import { parseUserMediaError } from "../../../utils/errors";
+import { getTrackFromStream, stopStream } from "../../../utils/track";
+import { useTrackMiddleware } from "../useTrackMiddleware";
+function getReplaceStreamAction(newStream, deviceType) {
+    return (oldStream) => {
+        if (oldStream) {
+            stopStream(oldStream, deviceType);
+        }
+        return newStream;
+    };
+}
+function getStopStreamAction(deviceType) {
+    return (oldStream) => {
+        if (oldStream) {
+            stopStream(oldStream, deviceType);
+        }
+        return null;
+    };
+}
+async function getDeviceStream(type, constraints, deviceId) {
+    constraints = typeof constraints === "object" ? constraints : {};
+    if (deviceId) {
+        constraints.deviceId = { exact: deviceId };
+    }
+    const stream = await navigator.mediaDevices.getUserMedia({
+        [type]: constraints,
+    });
+    return stream;
+}
+export const useDeviceManager = ({ mediaStream, getInitialStream, deviceType, allDevicesList, setMediaStream, constraints, saveUsedDevice, deviceError, setDeviceError, }) => {
+    const rawTrack = useMemo(() => mediaStream && getTrackFromStream(mediaStream, deviceType), [mediaStream, deviceType]);
+    const { processedTrack, applyMiddleware, currentMiddleware } = useTrackMiddleware(rawTrack);
+    const currentTrack = processedTrack ?? rawTrack;
+    const deviceList = useMemo(() => allDevicesList.filter(({ kind }) => kind === `${deviceType}input`), [allDevicesList, deviceType]);
+    const activeDevice = useMemo(() => {
+        const currentDevice = mediaStream &&
+            deviceList.find((device) => device.deviceId === getTrackFromStream(mediaStream, deviceType)?.getSettings().deviceId);
+        if (!currentDevice)
+            return null;
+        return { label: currentDevice.label, deviceId: currentDevice.deviceId };
+    }, [mediaStream, deviceList, deviceType]);
+    const [deviceEnabled, setDeviceEnabled] = useState(true);
+    const startDevice = useCallback(async (deviceId) => {
+        const initialStream = await getInitialStream();
+        const track = initialStream && getTrackFromStream(initialStream, deviceType);
+        const isUsingDesiredDevice = !deviceId || deviceId === track?.getSettings().deviceId;
+        if (track?.enabled && isUsingDesiredDevice) {
+            return [track, null];
+        }
+        try {
+            const stream = await getDeviceStream(deviceType, constraints, deviceId);
+            setMediaStream(getReplaceStreamAction(stream, deviceType));
+            const retrievedTrack = stream && getTrackFromStream(stream, deviceType);
+            const usedDevice = deviceList.find((device) => device.deviceId === retrievedTrack?.getSettings().deviceId);
+            if (usedDevice) {
+                saveUsedDevice(usedDevice);
+            }
+            return [retrievedTrack, null];
+        }
+        catch (err) {
+            const parsedError = parseUserMediaError(err);
+            setDeviceError(parsedError);
+            return [null, parsedError];
+        }
+    }, [getInitialStream, deviceType, constraints, setMediaStream, deviceList, saveUsedDevice, setDeviceError]);
+    const stopDevice = useCallback(() => {
+        setMediaStream(getStopStreamAction(deviceType));
+    }, [setMediaStream, deviceType]);
+    const enableDevice = useCallback(() => {
+        if (!currentTrack)
+            return;
+        currentTrack.enabled = true;
+        setDeviceEnabled(true);
+    }, [currentTrack]);
+    const disableDevice = useCallback(() => {
+        if (!currentTrack)
+            return;
+        currentTrack.enabled = false;
+        setDeviceEnabled(false);
+    }, [currentTrack]);
+    return {
+        startDevice,
+        stopDevice,
+        activeDevice,
+        deviceTrack: processedTrack ?? rawTrack,
+        deviceList,
+        enableDevice,
+        disableDevice,
+        deviceEnabled,
+        currentMiddleware,
+        applyMiddleware,
+        deviceError,
+    };
+};

package/dist/hooks/internal/devices/useHandleStreamEnd.d.ts

@@ -0,0 +1,9 @@
+import type { SetStateAction } from "react";
+interface HandleTrackEndProps {
+    stream: MediaStream | null;
+    setStream: (action: SetStateAction<MediaStream | null>) => void;
+    type: "audio" | "video";
+}
+export declare const useHandleTrackEnd: ({ stream, setStream, type }: HandleTrackEndProps) => void;
+export {};
+//# sourceMappingURL=useHandleStreamEnd.d.ts.map

package/dist/hooks/internal/devices/useHandleStreamEnd.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHandleStreamEnd.d.ts","sourceRoot":"","sources":["../../../../src/hooks/internal/devices/useHandleStreamEnd.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAK5C,UAAU,mBAAmB;IAC3B,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B,SAAS,EAAE,CAAC,MAAM,EAAE,cAAc,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,IAAI,CAAC;IAChE,IAAI,EAAE,OAAO,GAAG,OAAO,CAAC;CACzB;AAED,eAAO,MAAM,iBAAiB,GAAI,6BAA6B,mBAAmB,SAUjF,CAAC"}

package/dist/hooks/internal/devices/useHandleStreamEnd.js

@@ -0,0 +1,13 @@
+import { useEffect } from "react";
+import { getTrackFromStream } from "../../../utils/track";
+export const useHandleTrackEnd = ({ stream, setStream, type }) => {
+    useEffect(() => {
+        const track = stream && getTrackFromStream(stream, type);
+        if (!track)
+            return;
+        track.onended = () => {
+            track.stop();
+            setStream(null);
+        };
+    }, [type, stream, setStream]);
+};

package/dist/hooks/internal/devices/useMediaDevices.d.ts

@@ -0,0 +1,16 @@
+import type { InitializeDevicesResult, PersistLastDeviceHandlers } from "../../../types/public";
+interface UseDevicesProps {
+    videoConstraints?: MediaTrackConstraints | boolean;
+    audioConstraints?: MediaTrackConstraints | boolean;
+    persistHandlers?: PersistLastDeviceHandlers;
+}
+export declare const useMediaDevices: ({ videoConstraints, audioConstraints, persistHandlers }: UseDevicesProps) => {
+    initializeDevices: (settings?: {
+        enableVideo?: boolean;
+        enableAudio?: boolean;
+    }) => Promise<InitializeDevicesResult>;
+    cameraManager: import("./useDeviceManager").DeviceManager;
+    microphoneManager: import("./useDeviceManager").DeviceManager;
+};
+export {};
+//# sourceMappingURL=useMediaDevices.d.ts.map

package/dist/hooks/internal/devices/useMediaDevices.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMediaDevices.d.ts","sourceRoot":"","sources":["../../../../src/hooks/internal/devices/useMediaDevices.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAe,uBAAuB,EAAE,yBAAyB,EAAE,MAAM,uBAAuB,CAAC;AAI7G,UAAU,eAAe;IACvB,gBAAgB,CAAC,EAAE,qBAAqB,GAAG,OAAO,CAAC;IACnD,gBAAgB,CAAC,EAAE,qBAAqB,GAAG,OAAO,CAAC;IACnD,eAAe,CAAC,EAAE,yBAAyB,CAAC;CAC7C;AAED,eAAO,MAAM,eAAe,GAAI,yDAAyD,eAAe;mCA+BlF;QAAE,WAAW,CAAC,EAAE,OAAO,CAAC;QAAC,WAAW,CAAC,EAAE,OAAO,CAAA;KAAE,KAAG,OAAO,CAAC,uBAAuB,CAAC;;;CA2GxG,CAAC"}

package/dist/hooks/internal/devices/useMediaDevices.js

@@ -0,0 +1,108 @@
+import { useCallback, useEffect, useRef, useState } from "react";
+import { prepareConstraints } from "../../../devices/constraints";
+import { correctDevicesOnSafari, getAvailableMedia } from "../../../devices/mediaInitializer";
+import { useDeviceManager } from "./useDeviceManager";
+import { useHandleTrackEnd } from "./useHandleStreamEnd";
+export const useMediaDevices = ({ videoConstraints, audioConstraints, persistHandlers }) => {
+    const [deviceList, setDeviceList] = useState([]);
+    const [videoStream, setVideoStream] = useState(null);
+    const [audioStream, setAudioStream] = useState(null);
+    const [videoError, setVideoError] = useState(null);
+    const [audioError, setAudioError] = useState(null);
+    const lastUsedCameraRef = useRef(persistHandlers?.getLastDevice("video") ?? null);
+    const lastUsedMicRef = useRef(persistHandlers?.getLastDevice("audio") ?? null);
+    const initializationRef = useRef(null);
+    const saveUsedCamera = useCallback((deviceInfo) => {
+        lastUsedCameraRef.current = deviceInfo;
+        persistHandlers?.saveLastDevice(deviceInfo, "video");
+    }, [persistHandlers]);
+    const saveUsedMic = useCallback((deviceInfo) => {
+        lastUsedMicRef.current = deviceInfo;
+        persistHandlers?.saveLastDevice(deviceInfo, "audio");
+    }, [persistHandlers]);
+    const initializeDevices = useCallback(async (settings) => {
+        if (deviceList.length) {
+            return { stream: null, errors: null, status: "already_initialized" };
+        }
+        const lastUsed = {
+            audio: lastUsedMicRef.current,
+            video: lastUsedCameraRef.current,
+        };
+        const constraints = {
+            video: settings?.enableVideo !== false && prepareConstraints(lastUsed.video?.deviceId, videoConstraints),
+            audio: settings?.enableAudio !== false && prepareConstraints(lastUsed.audio?.deviceId, audioConstraints),
+        };
+        const intitialize = async () => {
+            let media = await getAvailableMedia(constraints);
+            const devices = await navigator.mediaDevices.enumerateDevices();
+            setDeviceList(devices);
+            if (media.stream) {
+                media = await correctDevicesOnSafari(media.stream, media.errors, devices, constraints, lastUsed);
+            }
+            const { stream, errors } = media;
+            const videoDevice = deviceList.find((device) => device.deviceId === stream?.getVideoTracks()[0].getSettings().deviceId);
+            const audioDevice = deviceList.find((device) => device.deviceId === stream?.getAudioTracks()[0].getSettings().deviceId);
+            if (videoDevice) {
+                saveUsedCamera(videoDevice);
+            }
+            if (audioDevice) {
+                saveUsedMic(audioDevice);
+            }
+            setVideoStream(stream);
+            setAudioStream(stream);
+            setVideoError(errors.video);
+            setAudioError(errors.audio);
+            if (!stream) {
+                return { status: "failed", errors: errors, stream: null };
+            }
+            else if (errors.video || errors.audio) {
+                return { status: "initialized_with_errors", errors, stream: null };
+            }
+            else {
+                return { status: "initialized", stream, errors: null };
+            }
+        };
+        const initializePromise = intitialize();
+        initializationRef.current = initializePromise;
+        return await initializePromise;
+    }, [deviceList, videoConstraints, audioConstraints, saveUsedCamera, saveUsedMic]);
+    useEffect(() => {
+        const isInitialStreamIrrelevant = videoStream !== audioStream;
+        if (isInitialStreamIrrelevant) {
+            initializationRef.current = null;
+        }
+    }, [videoStream, audioStream]);
+    const getInitialStream = useCallback(async () => {
+        const result = await initializationRef.current;
+        return result?.stream ?? null;
+    }, []);
+    useHandleTrackEnd({ stream: videoStream, setStream: setVideoStream, type: "video" });
+    useHandleTrackEnd({ stream: audioStream, setStream: setAudioStream, type: "audio" });
+    const cameraManager = useDeviceManager({
+        mediaStream: videoStream,
+        setMediaStream: setVideoStream,
+        deviceError: videoError,
+        setDeviceError: setVideoError,
+        getInitialStream,
+        deviceType: "video",
+        allDevicesList: deviceList,
+        constraints: videoConstraints,
+        saveUsedDevice: saveUsedCamera,
+    });
+    const microphoneManager = useDeviceManager({
+        mediaStream: audioStream,
+        setMediaStream: setAudioStream,
+        deviceError: audioError,
+        setDeviceError: setAudioError,
+        getInitialStream,
+        deviceType: "audio",
+        allDevicesList: deviceList,
+        constraints: audioConstraints,
+        saveUsedDevice: saveUsedMic,
+    });
+    return {
+        initializeDevices,
+        cameraManager,
+        microphoneManager,
+    };
+};

package/dist/hooks/internal/usePeerStatus.d.ts

@@ -1,7 +1,4 @@
 import type { FishjamClient } from "@fishjam-cloud/ts-client";
 import type { PeerStatus } from "../../types/public";
-export declare const usePeerStatus: (client: FishjamClient) => {
-    readonly peerStatus: PeerStatus;
-    readonly getCurrentPeerStatus: () => PeerStatus;
-};
+export declare const usePeerStatus: (client: FishjamClient) => PeerStatus;
 //# sourceMappingURL=usePeerStatus.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"usePeerStatus.d.ts","sourceRoot":"","sources":["../../../src/hooks/internal/usePeerStatus.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAG9D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAErD,eAAO,MAAM,aAAa,WAAY,aAAa;;;CAgDlD,CAAC"}
+{"version":3,"file":"usePeerStatus.d.ts","sourceRoot":"","sources":["../../../src/hooks/internal/usePeerStatus.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAG9D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAErD,eAAO,MAAM,aAAa,GAAI,QAAQ,aAAa,eAqClD,CAAC"}

package/dist/hooks/internal/usePeerStatus.js

@@ -1,12 +1,6 @@
-import { useCallback, useEffect, useRef, useState } from "react";
+import { useEffect, useState } from "react";
 export const usePeerStatus = (client) => {
-    const [peerStatus, setPeerStatusState] = useState("idle");
-    const peerStatusRef = useRef("idle");
-    const setPeerStatus = useCallback((status) => {
-        peerStatusRef.current = status;
-        setPeerStatusState(status);
-    }, [setPeerStatusState]);
-    const getCurrentPeerStatus = useCallback(() => peerStatusRef.current, []);
+    const [peerStatus, setPeerStatus] = useState("idle");
     useEffect(() => {
         const setConnecting = () => {
             setPeerStatus("connecting");
@@ -37,5 +31,5 @@ export const usePeerStatus = (client) => {
             client.off("disconnected", setDisconnected);
         };
     }, [client, setPeerStatus]);
-    return { peerStatus, getCurrentPeerStatus };
+    return peerStatus;
 };

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

@@ -1 +1 @@
-{"version":3,"file":"useReconnection.d.ts","sourceRoot":"","sources":["../../../src/hooks/internal/useReconnection.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAKnE;;;GAGG;AACH,eAAO,MAAM,eAAe,QAAO,kBA6BlC,CAAC"}
+{"version":3,"file":"useReconnection.d.ts","sourceRoot":"","sources":["../../../src/hooks/internal/useReconnection.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAKnE;;;GAGG;AACH,eAAO,MAAM,eAAe,QAAO,kBA+BlC,CAAC"}

package/dist/hooks/internal/useReconnection.js

@@ -1,11 +1,13 @@
-import { useEffect, useState } from "react";
-import { useFishjamContext } from "./useFishjamContext";
+import { useContext, useEffect, useState } from "react";
+import { FishjamClientContext } from "../../contexts/fishjamClient";
 /**
  *
  * @category Connection
  */
 export const useReconnection = () => {
-    const { fishjamClientRef } = useFishjamContext();
+    const fishjamClientRef = useContext(FishjamClientContext);
+    if (!fishjamClientRef)
+        throw Error("useConnection must be used within FishjamProvider");
     const [reconnectionStatus, setReconnectionStatus] = useState("idle");
     useEffect(() => {
         const client = fishjamClientRef.current;

package/dist/hooks/internal/useScreenshareManager.d.ts

@@ -1,4 +1,4 @@
-import type { FishjamClient } from "@fishjam-cloud/ts-client";
+import { type FishjamClient } from "@fishjam-cloud/ts-client";
 import type { PeerStatus, TracksMiddleware } from "../../types/public";
 export type UseScreenshareResult = {
     /**
@@ -39,8 +39,8 @@ export type UseScreenshareResult = {
 };
 interface ScreenShareManagerProps {
     fishjamClient: FishjamClient;
-    getCurrentPeerStatus: () => PeerStatus;
+    peerStatus: PeerStatus;
 }
-export declare const useScreenShareManager: ({ fishjamClient, getCurrentPeerStatus, }: ScreenShareManagerProps) => UseScreenshareResult;
+export declare const useScreenShareManager: ({ fishjamClient, peerStatus }: ScreenShareManagerProps) => UseScreenshareResult;
 export {};
 //# sourceMappingURL=useScreenshareManager.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"useScreenshareManager.d.ts","sourceRoot":"","sources":["../../../src/hooks/internal/useScreenshareManager.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAI9D,OAAO,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEvE,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,cAAc,EAAE,CAAC,KAAK,CAAC,EAAE;QACvB,gBAAgB,CAAC,EAAE,OAAO,GAAG,qBAAqB,CAAC;QACnD,gBAAgB,CAAC,EAAE,OAAO,GAAG,qBAAqB,CAAC;KACpD,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACpB;;OAEG;IACH,aAAa,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACnC;;OAEG;IACH,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B;;OAEG;IACH,UAAU,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACpC;;OAEG;IACH,UAAU,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACpC;;;;OAIG;IACH,uBAAuB,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACjD;;;;OAIG;IACH,mBAAmB,EAAE,CAAC,UAAU,EAAE,gBAAgB,GAAG,IAAI,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAC7E,CAAC;AAEF,UAAU,uBAAuB;IAC/B,aAAa,EAAE,aAAa,CAAC;IAC7B,oBAAoB,EAAE,MAAM,UAAU,CAAC;CACxC;AAED,eAAO,MAAM,qBAAqB,6CAG/B,uBAAuB,KAAG,oBAmI5B,CAAC"}
+{"version":3,"file":"useScreenshareManager.d.ts","sourceRoot":"","sources":["../../../src/hooks/internal/useScreenshareManager.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,aAAa,EAAsC,MAAM,0BAA0B,CAAC;AAIlG,OAAO,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEvE,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,cAAc,EAAE,CAAC,KAAK,CAAC,EAAE;QACvB,gBAAgB,CAAC,EAAE,OAAO,GAAG,qBAAqB,CAAC;QACnD,gBAAgB,CAAC,EAAE,OAAO,GAAG,qBAAqB,CAAC;KACpD,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACpB;;OAEG;IACH,aAAa,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACnC;;OAEG;IACH,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B;;OAEG;IACH,UAAU,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACpC;;OAEG;IACH,UAAU,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACpC;;;;OAIG;IACH,uBAAuB,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACjD;;;;OAIG;IACH,mBAAmB,EAAE,CAAC,UAAU,EAAE,gBAAgB,GAAG,IAAI,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAC7E,CAAC;AAEF,UAAU,uBAAuB;IAC/B,aAAa,EAAE,aAAa,CAAC;IAC7B,UAAU,EAAE,UAAU,CAAC;CACxB;AAED,eAAO,MAAM,qBAAqB,GAAI,+BAA+B,uBAAuB,KAAG,oBAiJ9F,CAAC"}

package/dist/hooks/internal/useScreenshareManager.js

@@ -1,5 +1,6 @@
+import { TrackTypeError } from "@fishjam-cloud/ts-client";
 import { useCallback, useEffect, useRef, useState } from "react";
-export const useScreenShareManager = ({ fishjamClient, getCurrentPeerStatus, }) => {
+export const useScreenShareManager = ({ fishjamClient, peerStatus }) => {
     const [state, setState] = useState({ stream: null, trackIds: null });
     const cleanMiddlewareFnRef = useRef(null);
     const stream = state.stream ?? null;
@@ -9,6 +10,18 @@ export const useScreenShareManager = ({ fishjamClient, getCurrentPeerStatus, })
         if (typeof name === "string")
             return name;
     };
+    const addTrackToFishjamClient = async (track, trackMetadata) => {
+        try {
+            return fishjamClient.addTrack(track, trackMetadata);
+        }
+        catch (err) {
+            if (err instanceof TrackTypeError) {
+                console.warn(err.message);
+                return undefined;
+            }
+            throw err;
+        }
+    };
     const startStreaming = async (props) => {
         const displayStream = await navigator.mediaDevices.getDisplayMedia({
             video: props?.videoConstraints ?? true,
@@ -22,19 +35,20 @@ export const useScreenShareManager = ({ fishjamClient, getCurrentPeerStatus, })
             audio = audioTrack;
             cleanMiddlewareFnRef.current = onClear;
         }
-        const addTrackPromises = [fishjamClient.addTrack(video, { displayName, type: "screenShareVideo", paused: false })];
+        const addTrackPromises = [addTrackToFishjamClient(video, { displayName, type: "screenShareVideo", paused: false })];
         if (audio)
-            addTrackPromises.push(fishjamClient.addTrack(audio, { displayName, type: "screenShareAudio", paused: false }));
+            addTrackPromises.push(addTrackToFishjamClient(audio, { displayName, type: "screenShareAudio", paused: false }));
         const [videoId, audioId] = await Promise.all(addTrackPromises);
         setState({ stream: displayStream, trackIds: { videoId, audioId } });
     };
     const replaceTracks = async (newVideoTrack, newAudioTrack) => {
         if (!state?.stream)
             return;
-        const addTrackPromises = [fishjamClient.replaceTrack(state.trackIds.videoId, newVideoTrack)];
-        if (newAudioTrack && state.trackIds.audioId) {
+        const addTrackPromises = [];
+        if (newVideoTrack && state.trackIds.videoId)
+            addTrackPromises.push(fishjamClient.replaceTrack(state.trackIds.videoId, newVideoTrack));
+        if (newAudioTrack && state.trackIds.audioId)
             addTrackPromises.push(fishjamClient.replaceTrack(state.trackIds.audioId, newAudioTrack));
-        }
         await Promise.all(addTrackPromises);
     };
     const cleanMiddleware = useCallback(() => {
@@ -63,15 +77,17 @@ export const useScreenShareManager = ({ fishjamClient, getCurrentPeerStatus, })
         video.stop();
         if (audio)
             audio.stop();
-        if (getCurrentPeerStatus() === "connected") {
-            const removeTrackPromises = [fishjamClient.removeTrack(state.trackIds.videoId)];
+        if (peerStatus === "connected") {
+            const removeTrackPromises = [];
+            if (state.trackIds.videoId)
+                removeTrackPromises.push(fishjamClient.removeTrack(state.trackIds.videoId));
             if (state.trackIds.audioId)
                 removeTrackPromises.push(fishjamClient.removeTrack(state.trackIds.audioId));
             await Promise.all(removeTrackPromises);
         }
         cleanMiddleware();
         setState(({ tracksMiddleware }) => ({ stream: null, trackIds: null, tracksMiddleware }));
-    }, [state, fishjamClient, setState, cleanMiddleware, getCurrentPeerStatus]);
+    }, [state, fishjamClient, setState, cleanMiddleware, peerStatus]);
     useEffect(() => {
         if (!state.stream)
             return;

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

@@ -1,13 +1,15 @@
 import { type FishjamClient } from "@fishjam-cloud/ts-client";
-import type { MediaManager, TrackManager } from "../../types/internal";
+import type { TrackManager } from "../../types/internal";
 import type { BandwidthLimits, PeerStatus, StreamConfig } from "../../types/public";
+import type { DeviceManager } from "./devices/useDeviceManager";
 interface TrackManagerConfig {
-    mediaManager: MediaManager;
+    deviceManager: DeviceManager;
     tsClient: FishjamClient;
-    getCurrentPeerStatus: () => PeerStatus;
+    peerStatus: PeerStatus;
     bandwidthLimits: BandwidthLimits;
     streamConfig?: StreamConfig;
+    type: "camera" | "microphone";
 }
-export declare const useTrackManager: ({ mediaManager, tsClient, getCurrentPeerStatus, bandwidthLimits, streamConfig, }: TrackManagerConfig) => TrackManager;
+export declare const useTrackManager: ({ deviceManager, tsClient, peerStatus, bandwidthLimits, streamConfig, type, }: TrackManagerConfig) => TrackManager;
 export {};
 //# sourceMappingURL=useTrackManager.d.ts.map

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,YA8KvB,CAAC"}
+{"version":3,"file":"useTrackManager.d.ts","sourceRoot":"","sources":["../../../src/hooks/internal/useTrackManager.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,aAAa,EAA+C,MAAM,0BAA0B,CAAC;AAG3G,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,KAAK,EAAE,eAAe,EAAE,UAAU,EAAE,YAAY,EAAmB,MAAM,oBAAoB,CAAC;AAErG,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAEhE,UAAU,kBAAkB;IAC1B,aAAa,EAAE,aAAa,CAAC;IAC7B,QAAQ,EAAE,aAAa,CAAC;IACxB,UAAU,EAAE,UAAU,CAAC;IACvB,eAAe,EAAE,eAAe,CAAC;IACjC,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,IAAI,EAAE,QAAQ,GAAG,YAAY,CAAC;CAC/B;AAED,eAAO,MAAM,eAAe,GAAI,+EAO7B,kBAAkB,KAAG,YAuKvB,CAAC"}