Expose useIsRecording hook with optional room param (#934)

livekit · Jul 30, 2024 · 9e24ef4 · 9e24ef4
1 parent 6bbc83b
commit 9e24ef4
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 6 deletions.
diff --git a/.changeset/sixty-years-whisper.md 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
@@ -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
@@ -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
@@ -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;
 }