diff --git a/.changeset/sixty-years-whisper.md b/.changeset/sixty-years-whisper.md new file mode 100644 index 000000000..1c47e0bd7 --- /dev/null +++ b/.changeset/sixty-years-whisper.md @@ -0,0 +1,5 @@ +--- +"@livekit/components-react": patch +--- + +Expose useIsRecording hook with optional room param diff --git a/packages/react/etc/components-react.api.md b/packages/react/etc/components-react.api.md index c6deb3194..98a717562 100644 --- a/packages/react/etc/components-react.api.md +++ b/packages/react/etc/components-react.api.md @@ -822,6 +822,9 @@ export interface UseIsMutedOptions { participant?: Participant; } +// @public +export function useIsRecording(room?: Room): boolean; + // @public export function useIsSpeaking(participant?: Participant): boolean; diff --git a/packages/react/src/hooks/index.ts b/packages/react/src/hooks/index.ts index 6498a11a5..da8df0596 100644 --- a/packages/react/src/hooks/index.ts +++ b/packages/react/src/hooks/index.ts @@ -52,3 +52,4 @@ export * from './useTrackVolume'; export * from './useParticipantTracks'; export * from './useTrackTranscription'; export * from './useParticipantAttributes'; +export * from './useIsRecording'; diff --git a/packages/react/src/hooks/useIsRecording.ts b/packages/react/src/hooks/useIsRecording.ts index f4e8a5c76..0bc4db867 100644 --- a/packages/react/src/hooks/useIsRecording.ts +++ b/packages/react/src/hooks/useIsRecording.ts @@ -1,8 +1,9 @@ import { recordingStatusObservable } from '@livekit/components-core'; import * as React from 'react'; -import { useRoomContext } from '../context'; +import { useEnsureRoom } from '../context'; import { useObservableState } from './internal'; import { useConnectionState } from './useConnectionStatus'; +import type { Room } from 'livekit-client'; /** * The `useIsRecording` hook returns a `boolean` that indicates if the room is currently being recorded. @@ -12,11 +13,11 @@ import { useConnectionState } from './useConnectionStatus'; * ``` * @public */ -export function useIsRecording() { - const room = useRoomContext(); - const connectionState = useConnectionState(room); - const observable = React.useMemo(() => recordingStatusObservable(room), [room, connectionState]); - const isRecording = useObservableState(observable, room.isRecording); +export function useIsRecording(room?: Room) { + const r = useEnsureRoom(room); + const connectionState = useConnectionState(r); + const observable = React.useMemo(() => recordingStatusObservable(r), [r, connectionState]); + const isRecording = useObservableState(observable, r.isRecording); return isRecording; }