@fishjam-cloud/react-client 0.20.0 → 0.22.0

package/dist/FishjamProvider.d.ts

@@ -33,7 +33,10 @@ export interface FishjamProviderProps extends PropsWithChildren {
      * Configure whether to use audio simulcast and which layers to send if so.
      */
     audioConfig?: StreamConfig;
-    fishjamId?: string;
+    /**
+     * You can get you Fishjam ID at https://fishjam.io/app
+     */
+    fishjamId: string;
 }
 /**
  * Provides the Fishjam Context

package/dist/FishjamProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FishjamProvider.d.ts","sourceRoot":"","sources":["../src/FishjamProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC/E,OAAO,EAAE,KAAK,iBAAiB,EAAmB,MAAM,OAAO,CAAC;AAkBhE,OAAO,KAAK,EAAE,eAAe,EAAE,yBAAyB,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAI/F;;GAEG;AACH,MAAM,WAAW,oBAAqB,SAAQ,iBAAiB;IAC7D;;;OAGG;IACH,SAAS,CAAC,EAAE,eAAe,GAAG,OAAO,CAAC;IACtC;;;;OAIG;IACH,WAAW,CAAC,EAAE,IAAI,CAAC,sBAAsB,EAAE,OAAO,GAAG,OAAO,CAAC,CAAC;IAC9D;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,GAAG,yBAAyB,CAAC;IACxD;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;IAC3C;;OAEG;IACH,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B;;OAEG;IACH,WAAW,CAAC,EAAE,YAAY,CAAC;IAK3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,2CAiF1D"}
+{"version":3,"file":"FishjamProvider.d.ts","sourceRoot":"","sources":["../src/FishjamProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC/E,OAAO,EAAE,KAAK,iBAAiB,EAAmB,MAAM,OAAO,CAAC;AAkBhE,OAAO,KAAK,EAAE,eAAe,EAAE,yBAAyB,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAI/F;;GAEG;AACH,MAAM,WAAW,oBAAqB,SAAQ,iBAAiB;IAC7D;;;OAGG;IACH,SAAS,CAAC,EAAE,eAAe,GAAG,OAAO,CAAC;IACtC;;;;OAIG;IACH,WAAW,CAAC,EAAE,IAAI,CAAC,sBAAsB,EAAE,OAAO,GAAG,OAAO,CAAC,CAAC;IAC9D;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,GAAG,yBAAyB,CAAC;IACxD;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;IAC3C;;OAEG;IACH,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B;;OAEG;IACH,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B;;OAEG;IACH,SAAS,EAAE,MAAM,CAAC;CACnB;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,2CAiF1D"}

package/dist/FishjamProvider.js

@@ -66,5 +66,5 @@ export function FishjamProvider(props) {
         peerStatus,
     });
     const fishjamClientState = useFishjamClientState(fishjamClientRef.current);
-    return (_jsx(FishjamClientContext.Provider, { value: fishjamClientRef, children: _jsx(FishjamClientStateContext.Provider, { value: fishjamClientState, children: _jsx(FishjamIdContext.Provider, { value: props.fishjamId ?? null, children: _jsx(InitDevicesContext.Provider, { value: initializeDevices, children: _jsx(PeerStatusContext.Provider, { value: peerStatus, children: _jsx(CameraContext.Provider, { value: cameraContext, children: _jsx(MicrophoneContext.Provider, { value: microphoneContext, children: _jsx(ScreenshareContext.Provider, { value: screenShareManager, children: _jsx(CustomSourceContext.Provider, { value: customSourceManager, children: props.children }) }) }) }) }) }) }) }) }));
+    return (_jsx(FishjamClientContext.Provider, { value: fishjamClientRef, children: _jsx(FishjamClientStateContext.Provider, { value: fishjamClientState, children: _jsx(FishjamIdContext.Provider, { value: props.fishjamId, children: _jsx(InitDevicesContext.Provider, { value: initializeDevices, children: _jsx(PeerStatusContext.Provider, { value: peerStatus, children: _jsx(CameraContext.Provider, { value: cameraContext, children: _jsx(MicrophoneContext.Provider, { value: microphoneContext, children: _jsx(ScreenshareContext.Provider, { value: screenShareManager, children: _jsx(CustomSourceContext.Provider, { value: customSourceManager, children: props.children }) }) }) }) }) }) }) }) }));
 }

package/dist/contexts/fishjamId.d.ts

@@ -1,2 +1,3 @@
 export declare const FishjamIdContext: import("react").Context<string | null>;
+export declare const useFishjamId: () => string;
 //# sourceMappingURL=fishjamId.d.ts.map

package/dist/contexts/fishjamId.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fishjamId.d.ts","sourceRoot":"","sources":["../../src/contexts/fishjamId.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,gBAAgB,wCAAqC,CAAC"}
+{"version":3,"file":"fishjamId.d.ts","sourceRoot":"","sources":["../../src/contexts/fishjamId.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,gBAAgB,wCAAqC,CAAC;AAEnE,eAAO,MAAM,YAAY,cAQxB,CAAC"}

package/dist/contexts/fishjamId.js

@@ -1,2 +1,9 @@
-import { createContext } from "react";
+import { createContext, useContext } from "react";
 export const FishjamIdContext = createContext(null);
+export const useFishjamId = () => {
+    const fishjamId = useContext(FishjamIdContext);
+    if (!fishjamId) {
+        console.error(`You haven't passed your Fishjam ID to the FishjamProvider. You can get your Fishjam ID at https://fishjam.io/app`);
+    }
+    return fishjamId ?? "";
+};

package/dist/hooks/useConnection.d.ts

@@ -1,9 +1,5 @@
 import type { GenericMetadata } from "@fishjam-cloud/ts-client";
 export interface JoinRoomConfig<PeerMetadata extends GenericMetadata = GenericMetadata> {
-    /**
-     * Overrides the default url derived from the Fishjam ID passed to FishjamProvider
-     */
-    url?: string;
     /**
      * Token received from server (or Room Manager)
      */
@@ -22,7 +18,7 @@ export declare function useConnection(): {
     /**
      * Join room and start streaming camera and microphone
      */
-    joinRoom: <PeerMetadata extends GenericMetadata = GenericMetadata>({ url, peerToken, peerMetadata, }: JoinRoomConfig<PeerMetadata>) => Promise<void>;
+    joinRoom: <PeerMetadata extends GenericMetadata = GenericMetadata>({ peerToken, peerMetadata, }: JoinRoomConfig<PeerMetadata>) => Promise<void>;
     /**
      * Leave room and stop streaming
      */

package/dist/hooks/useConnection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useConnection.d.ts","sourceRoot":"","sources":["../../src/hooks/useConnection.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAShE,MAAM,WAAW,cAAc,CAAC,YAAY,SAAS,eAAe,GAAG,eAAe;IACpF;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,SAAS,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B;AAED;;;;GAIG;AACH,wBAAgB,aAAa;IAgCzB;;OAEG;eAvBF,YAAY,SAAS,eAAe,uDAIlC,cAAc,CAAC,YAAY,CAAC;IAqB/B;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;EAGN"}
+{"version":3,"file":"useConnection.d.ts","sourceRoot":"","sources":["../../src/hooks/useConnection.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAShE,MAAM,WAAW,cAAc,CAAC,YAAY,SAAS,eAAe,GAAG,eAAe;IACpF;;OAEG;IACH,SAAS,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B;AAED;;;;GAIG;AACH,wBAAgB,aAAa;IAgCzB;;OAEG;eAtBF,YAAY,SAAS,eAAe,kDAGlC,cAAc,CAAC,YAAY,CAAC;IAqB/B;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;EAGN"}

package/dist/hooks/useConnection.js

@@ -1,8 +1,8 @@
 import { useCallback, useContext } from "react";
-import { FISHJAM_WS_CONNECT_URL } from "../consts";
 import { FishjamClientContext } from "../contexts/fishjamClient";
-import { FishjamIdContext } from "../contexts/fishjamId";
+import { useFishjamId } from "../contexts/fishjamId";
 import { PeerStatusContext } from "../contexts/peerStatus";
+import { httpToWebsocketUrl, resolveFishjamUrl } from "../utils/fishjamUrl";
 import { useReconnection } from "./internal/useReconnection";
 /**
  * Hook allows to join or leave a room and check the current connection status.
@@ -11,18 +11,18 @@ import { useReconnection } from "./internal/useReconnection";
  */
 export function useConnection() {
     const fishjamClientRef = useContext(FishjamClientContext);
-    const fishjamId = useContext(FishjamIdContext);
+    const fishjamId = useFishjamId();
     if (!fishjamClientRef)
         throw Error("useConnection must be used within FishjamProvider");
     const peerStatus = useContext(PeerStatusContext);
     const client = fishjamClientRef.current;
     const reconnectionStatus = useReconnection();
-    const joinRoom = useCallback(({ url, peerToken, peerMetadata, }) => {
-        if (!url && !fishjamId) {
+    const joinRoom = useCallback(({ peerToken, peerMetadata, }) => {
+        if (!fishjamId) {
             throw Error(`You haven't passed your Fishjam ID to the FishjamProvider. You can get your Fishjam ID at https://fishjam.io/app`);
         }
-        const connectUrl = `${FISHJAM_WS_CONNECT_URL}/${fishjamId}`;
-        return client.connect({ url: url ?? connectUrl, token: peerToken, peerMetadata: peerMetadata ?? {} });
+        const connectUrl = httpToWebsocketUrl(resolveFishjamUrl(fishjamId));
+        return client.connect({ url: connectUrl, token: peerToken, peerMetadata: peerMetadata ?? {} });
     }, [client, fishjamId]);
     const leaveRoom = useCallback(() => {
         client.disconnect();

package/dist/hooks/useSandbox.d.ts

@@ -1,6 +1,6 @@
 export type UseSandboxProps = {
     configOverride?: {
-        fishjamUrl?: string;
+        sandboxApiUrl?: string;
     };
 };
 export type RoomType = "conference" | "livestream" | "audio_only";

package/dist/hooks/useSandbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useSandbox.d.ts","sourceRoot":"","sources":["../../src/hooks/useSandbox.ts"],"names":[],"mappings":"AAmBA,MAAM,MAAM,eAAe,GAAG;IAE5B,cAAc,CAAC,EAAE;QAAE,UAAU,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CAC1C,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG,YAAY,GAAG,YAAY,GAAG,YAAY,CAAC;AAElE,eAAO,MAAM,UAAU,GAAI,QAAQ,eAAe;oCAUH,MAAM,YAAY,MAAM,aAAY,QAAQ;sCAmB1C,MAAM;qCAkBP,MAAM,aAAY,OAAO;uBAUxC,MAAM;cAAQ;YAAE,EAAE,EAAE,MAAM,CAAC;YAAC,IAAI,EAAE,MAAM,CAAA;SAAE;;CAK1E,CAAC"}
+{"version":3,"file":"useSandbox.d.ts","sourceRoot":"","sources":["../../src/hooks/useSandbox.ts"],"names":[],"mappings":"AAWA,MAAM,MAAM,eAAe,GAAG;IAE5B,cAAc,CAAC,EAAE;QAAE,aAAa,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CAC7C,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG,YAAY,GAAG,YAAY,GAAG,YAAY,CAAC;AAElE,eAAO,MAAM,UAAU,GAAI,QAAQ,eAAe;oCAOH,MAAM,YAAY,MAAM,aAAY,QAAQ;sCAiB1C,MAAM;qCAgBP,MAAM,aAAY,OAAO;uBAQxC,MAAM;cAAQ;YAAE,EAAE,EAAE,MAAM,CAAC;YAAC,IAAI,EAAE,MAAM,CAAA;SAAE;;CAK1E,CAAC"}

package/dist/hooks/useSandbox.js

@@ -1,21 +1,11 @@
-import { useContext } from "react";
-import { FISHJAM_HTTP_CONNECT_URL } from "../consts";
-import { FishjamIdContext } from "../contexts/fishjamId";
-class FishjamIdMisconfiguredError extends Error {
-    constructor() {
-        super("You haven't passed the fishjamId to the FishjamProvider.");
-    }
-}
+import { useFishjamId } from "../contexts/fishjamId";
+import { resolveFishjamUrl } from "../utils/fishjamUrl";
 export const useSandbox = (props) => {
-    const fishjamId = useContext(FishjamIdContext);
-    const overridenFishjamUrl = props?.configOverride?.fishjamUrl;
-    const fishjamUrl = `${FISHJAM_HTTP_CONNECT_URL}/${fishjamId}`;
-    const isFishjamIdMisconfigured = !fishjamId && !props?.configOverride?.fishjamUrl;
-    const roomManagerUrl = `${overridenFishjamUrl ?? fishjamUrl}/room-manager`;
+    const fishjamId = useFishjamId();
+    const fishjamUrl = resolveFishjamUrl(fishjamId);
+    const sandboxApiUrl = props?.configOverride?.sandboxApiUrl ?? `${fishjamUrl}/room-manager`;
     const getSandboxPeerToken = async (roomName, peerName, roomType = "conference") => {
-        if (isFishjamIdMisconfigured)
-            throw new FishjamIdMisconfiguredError();
-        const url = new URL(roomManagerUrl);
+        const url = new URL(sandboxApiUrl);
         url.searchParams.set("roomName", roomName);
         url.searchParams.set("peerName", peerName);
         url.searchParams.set("roomType", roomType);
@@ -28,9 +18,7 @@ export const useSandbox = (props) => {
         return data.peerToken;
     };
     const getSandboxViewerToken = async (roomName) => {
-        if (isFishjamIdMisconfigured)
-            throw new FishjamIdMisconfiguredError();
-        const url = new URL(`${roomManagerUrl}/${roomName}/livestream-viewer-token`);
+        const url = new URL(`${sandboxApiUrl}/${roomName}/livestream-viewer-token`);
         const res = await fetch(url);
         if (!res.ok) {
             let message = `Failed to retrieve viewer token for '${roomName}' livestream room.`;
@@ -43,9 +31,7 @@ export const useSandbox = (props) => {
         return data.token;
     };
     const getSandboxLivestream = async (roomName, isPublic = false) => {
-        if (isFishjamIdMisconfigured)
-            throw new FishjamIdMisconfiguredError();
-        const url = new URL(`${roomManagerUrl}/livestream`);
+        const url = new URL(`${sandboxApiUrl}/livestream`);
         url.searchParams.set("roomName", roomName);
         url.searchParams.set("public", isPublic.toString());
         const res = await fetch(url);

package/dist/utils/fishjamUrl.d.ts

@@ -0,0 +1,3 @@
+export declare function resolveFishjamUrl(fishjamId: string): string;
+export declare function httpToWebsocketUrl(url: string): string;
+//# sourceMappingURL=fishjamUrl.d.ts.map

package/dist/utils/fishjamUrl.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fishjamUrl.d.ts","sourceRoot":"","sources":["../../src/utils/fishjamUrl.ts"],"names":[],"mappings":"AAAA,wBAAgB,iBAAiB,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,CAM3D;AAED,wBAAgB,kBAAkB,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAEtD"}

package/dist/utils/fishjamUrl.js

@@ -0,0 +1,11 @@
+export function resolveFishjamUrl(fishjamId) {
+    try {
+        return new URL(fishjamId).href;
+    }
+    catch {
+        return `https://fishjam.io/api/v1/connect/${fishjamId}`;
+    }
+}
+export function httpToWebsocketUrl(url) {
+    return url.replace("https://", "wss://").replace("http://", "ws://");
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fishjam-cloud/react-client",
-  "version": "0.20.0",
+  "version": "0.22.0",
   "description": "React client library for Fishjam",
   "license": "Apache-2.0",
   "author": "Fishjam Team",
@@ -60,7 +60,7 @@
     "vitest": "^3.1.1"
   },
   "dependencies": {
-    "@fishjam-cloud/ts-client": "0.20.0",
+    "@fishjam-cloud/ts-client": "0.22.0",
     "events": "3.3.0",
     "lodash.isequal": "4.5.0"
   },