From a83afdbb0cbcf6a35115e1292b562a7bf23fdbcb Mon Sep 17 00:00:00 2001
From: lebaudantoine <lebaud.antoine131@gmail.com>
Date: Fri, 22 Aug 2025 12:22:52 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B(frontend)=20prevent=20state=20upda?=
 =?UTF-8?q?tes=20when=20device=20selection=20unchanged?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Skip state updates when selected device hasn't actually changed to
prevent unnecessary re-renders that caused visible camera track
blinking.

Improves user experience by eliminating visual artifacts during device
selection interactions when no actual change occurs.
---
 .../livekit/components/controls/Device/SelectDevice.tsx      | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/frontend/src/features/rooms/livekit/components/controls/Device/SelectDevice.tsx b/src/frontend/src/features/rooms/livekit/components/controls/Device/SelectDevice.tsx
index 1e16a35f..6dcbea59 100644
--- a/src/frontend/src/features/rooms/livekit/components/controls/Device/SelectDevice.tsx
+++ b/src/frontend/src/features/rooms/livekit/components/controls/Device/SelectDevice.tsx
@@ -58,6 +58,8 @@ const SelectDevicePermissions = <T extends string | number>({
     setActiveMediaDevice(items[0].value)
   }, [items, onSubmit, kind, setActiveMediaDevice, activeDeviceId])
 
+  const selectedKey = id || activeDeviceId
+
   return (
     <Select
       aria-label={t(`${kind}.choose`)}
@@ -66,8 +68,9 @@ const SelectDevicePermissions = <T extends string | number>({
       items={items}
       iconComponent={iconComponent}
       placeholder={items.length === 0 ? t('loading') : t('select')}
-      selectedKey={id || activeDeviceId}
+      selectedKey={selectedKey}
       onSelectionChange={(key) => {
+        if (key === selectedKey) return
         onSubmit?.(key as string)
         setActiveMediaDevice(key as string)
       }}