Add useIsRecording hook (#931)

.changeset/lemon-geese-exercise.md

@@ -0,0 +1,6 @@
+---
+"@livekit/components-core": patch
+"@livekit/components-react": patch
+---
+
+Add useIsRecording hook

packages/core/etc/components-core.api.md

@@ -415,6 +415,9 @@ export type ReceivedTranscriptionSegment = TranscriptionSegment & {
     receivedAt: number;
 };
 
+// @public (undocumented)
+export function recordingStatusObservable(room: Room): Observable<boolean>;
+
 // @public (undocumented)
 export type RequireOnlyOne<T, Keys extends keyof T = keyof T> = Pick<T, Exclude<keyof T, Keys>> & {
     [K in Keys]-?: Required<Pick<T, K>> & Partial<Record<Exclude<Keys, K>, undefined>>;

packages/core/src/observables/room.ts

@@ -261,3 +261,10 @@ export function encryptionStatusObservable(room: Room, participant: Participant)
     ),
   );
 }
+
+export function recordingStatusObservable(room: Room) {
+  return roomEventSelector(room, RoomEvent.RecordingStatusChanged).pipe(
+    map(([recording]) => recording),
+    startWith(room.isRecording),
+  );
+}

packages/react/src/hooks/useIsRecording.ts

@@ -0,0 +1,22 @@
+import { recordingStatusObservable } from '@livekit/components-core';
+import * as React from 'react';
+import { useRoomContext } from '../context';
+import { useObservableState } from './internal';
+import { useConnectionState } from './useConnectionStatus';
+
+/**
+ * The `useIsRecording` hook returns a `boolean` that indicates if the room is currently being recorded.
+ * @example
+ * ```tsx
+ * const isRecording = useIsRecording();
+ * ```
+ * @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);
+
+  return isRecording;
+}