From e0f4bf8eab514a96177d4b970c8ece05d238a87b Mon Sep 17 00:00:00 2001
From: Timo <toger5@hotmail.de>
Date: Thu, 19 Dec 2024 17:39:34 +0100
Subject: [PATCH] working version

---
 src/livekit/TrackProcessorContext.tsx | 17 +++++++++++------
 src/livekit/useLiveKit.ts             |  8 +++++++-
 2 files changed, 18 insertions(+), 7 deletions(-)

diff --git a/src/livekit/TrackProcessorContext.tsx b/src/livekit/TrackProcessorContext.tsx
index e131dcb1..1fc0005a 100644
--- a/src/livekit/TrackProcessorContext.tsx
+++ b/src/livekit/TrackProcessorContext.tsx
@@ -6,8 +6,9 @@ Please see LICENSE in the repository root for full details.
 */
 
 import {
+  BackgroundBlur as backgroundBlur,
+  type ProcessorWrapper,
   type BackgroundOptions,
-  ProcessorWrapper,
 } from "@livekit/track-processors";
 import {
   createContext,
@@ -25,7 +26,6 @@ import {
   backgroundBlur as backgroundBlurSettings,
   useSetting,
 } from "../settings/settings";
-import { BlurBackgroundTransformer } from "./BlurBackgroundTransformer";
 
 type ProcessorState = {
   supported: boolean | undefined;
@@ -89,10 +89,15 @@ export const ProcessorProvider: FC<Props> = ({ children }) => {
     if (!shouldCheckSupport) return;
     try {
       if (!blur.current) {
-        blur.current = new ProcessorWrapper(
-          new BlurBackgroundTransformer({ blurRadius: 15 }),
-          "background-blur",
-        );
+        // TODO: move to our own local version of the transformer.
+        // Currently this is broken: error when trying to pipe IndexSizeError: Failed to construct 'ImageData': The source width is zero or not a number.
+        // blur.current = new ProcessorWrapper(
+        //   new BlurBackgroundTransformer({}),
+        //   "background-blur",
+        // );
+
+        // eslint-disable-next-line new-cap
+        blur.current = backgroundBlur();
       }
       setProcessorState({
         checkSupported,
diff --git a/src/livekit/useLiveKit.ts b/src/livekit/useLiveKit.ts
index 72a972a7..aca6ed92 100644
--- a/src/livekit/useLiveKit.ts
+++ b/src/livekit/useLiveKit.ts
@@ -134,8 +134,14 @@ export function useLiveKit(
       Array.from(room.localParticipant.videoTrackPublications.values()).find(
         (v) => v.source === Track.Source.Camera,
       )?.track as LocalVideoTrack | null,
-    [room.localParticipant.videoTrackPublications],
+    [
+      room.localParticipant.videoTrackPublications,
+      // We need to update on map changes
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+      room.localParticipant.videoTrackPublications.keys(),
+    ],
   );
+
   useTrackProcessorSync(videoTrack);
 
   const connectionState = useECConnectionState(