make audio work

Signed-off-by: Timo K <toger5@hotmail.de>

src/livekit/MatrixAudioRenderer.test.tsx

@@ -18,7 +18,7 @@ import { useTracks } from "@livekit/components-react";
 
 import { testAudioContext } from "../useAudioContext.test";
 import * as MediaDevicesContext from "../MediaDevicesContext";
-import { MatrixAudioRenderer } from "./MatrixAudioRenderer";
+import { LivekitRoomAudioRenderer } from "./MatrixAudioRenderer";
 import { mockMediaDevices, mockTrack } from "../utils/test";
 
 export const TestAudioContextConstructor = vi.fn(() => testAudioContext);
@@ -54,7 +54,7 @@ vi.mocked(useTracks).mockReturnValue(tracks);
 it("should render for member", () => {
   const { container, queryAllByTestId } = render(
     <MediaDevicesProvider value={mockMediaDevices({})}>
-      <MatrixAudioRenderer
+      <LivekitRoomAudioRenderer
         members={[{ sender: "test", deviceId: "123" }] as CallMembership[]}
       />
     </MediaDevicesProvider>,
@@ -69,7 +69,7 @@ it("should not render without member", () => {
   ] as CallMembership[];
   const { container, queryAllByTestId } = render(
     <MediaDevicesProvider value={mockMediaDevices({})}>
-      <MatrixAudioRenderer members={memberships} />
+      <LivekitRoomAudioRenderer members={memberships} />
     </MediaDevicesProvider>,
   );
   expect(container).toBeTruthy();
@@ -79,7 +79,7 @@ it("should not render without member", () => {
 it("should not setup audioContext gain and pan if there is no need to.", () => {
   render(
     <MediaDevicesProvider value={mockMediaDevices({})}>
-      <MatrixAudioRenderer
+      <LivekitRoomAudioRenderer
         members={[{ sender: "test", deviceId: "123" }] as CallMembership[]}
       />
     </MediaDevicesProvider>,
@@ -102,7 +102,7 @@ it("should setup audioContext gain and pan", () => {
   });
   render(
     <MediaDevicesProvider value={mockMediaDevices({})}>
-      <MatrixAudioRenderer
+      <LivekitRoomAudioRenderer
         members={[{ sender: "test", deviceId: "123" }] as CallMembership[]}
       />
     </MediaDevicesProvider>,

src/livekit/MatrixAudioRenderer.tsx

@@ -6,6 +6,7 @@ Please see LICENSE in the repository root for full details.
 */
 
 import { getTrackReferenceId } from "@livekit/components-core";
+import { type Room as LivekitRoom } from "livekit-client";
 import { type RemoteAudioTrack, Track } from "livekit-client";
 import { useEffect, useMemo, useRef, useState, type ReactNode } from "react";
 import {
@@ -19,7 +20,7 @@ import { logger } from "matrix-js-sdk/lib/logger";
 import { useEarpieceAudioConfig } from "../MediaDevicesContext";
 import { useReactiveState } from "../useReactiveState";
 import * as controls from "../controls";
-
+import {} from "@livekit/components-core";
 export interface MatrixAudioRendererProps {
   /**
    * The list of participants to render audio for.
@@ -27,6 +28,7 @@ export interface MatrixAudioRendererProps {
    * that are not expected to be in the rtc session.
    */
   members: CallMembership[];
+  livekitRoom: LivekitRoom;
   /**
    * If set to `true`, mutes all audio tracks rendered by the component.
    * @remarks
@@ -49,9 +51,10 @@ export interface MatrixAudioRendererProps {
  * ```
  * @public
  */
-export function MatrixAudioRenderer({
+export function LivekitRoomAudioRenderer({
   members,
   muted,
+  livekitRoom,
 }: MatrixAudioRendererProps): ReactNode {
   const validIdentities = useMemo(
     () =>
@@ -89,6 +92,7 @@ export function MatrixAudioRenderer({
     {
       updateOnlyOn: [],
       onlySubscribed: true,
+      room: livekitRoom,
     },
   ).filter((ref) => {
     const isValid = validIdentities?.has(ref.participant.identity);