Enhance SessionUsersPanel and UserCamera components by implementing local speaking state management with debounce for efficient updates. Refactor grid column calculation and participant filtering for improved performance. Adjust logging in useVoiceActivity and useWebRTC hooks to reduce console noise.

client/src/hooks/useVoiceActivity.ts

@@ -132,9 +132,9 @@ export function useVoiceActivity(
           }
         }
 
-        // Логируем каждые 30 вызовов (~500ms при частоте 60 Hz)
+        // Логируем каждые 180 вызовов (~3 секунды при частоте 60 Hz) - снижено для меньшего шума
         frameCount++;
-        if (frameCount % 30 === 0) {
+        if (frameCount % 180 === 0) {
           console.log(
             `[VoiceActivity] Level: ${audioLevel.toFixed(
               1

client/src/hooks/useWebRTC.ts

@@ -19,6 +19,14 @@ export const useWebRTC = (roomId?: string, autoJoin = false) => {
   const [isConnected, setIsConnected] = useState(false);
   const [isInitialized, setIsInitialized] = useState(false);
 
+  // Мониторинг изменений участников (отключено для снижения шума в консоли)
+  // useEffect(() => {
+  //   console.log("[useWebRTC] Participants state updated:", participants.map(p => ({
+  //     id: p.id,
+  //     hasStream: !!p.stream,
+  //   })));
+  // }, [participants]);
+
   useEffect(() => {
     // Создаем сервис только один раз (синглтон)
     if (!webrtcServiceInstance) {
@@ -63,11 +71,6 @@ export const useWebRTC = (roomId?: string, autoJoin = false) => {
         setParticipants((prev) => {
           const existing = prev.find((p) => p.id === participantId);
           if (existing) {
-            // Если поток уже тот же самый, не обновляем
-            if (existing.stream === stream) {
-              console.log("[useWebRTC] Stream already set for:", participantId);
-              return prev;
-            }
             console.log("[useWebRTC] Updating stream for existing participant:", participantId);
             return prev.map((p) =>
               p.id === participantId ? { ...p, stream } : p
@@ -97,43 +100,26 @@ export const useWebRTC = (roomId?: string, autoJoin = false) => {
       },
       onParticipantAudioToggle: (participantId, isEnabled) => {
         console.log(`[useWebRTC] Audio toggle for ${participantId}: ${isEnabled}`);
-        setParticipants((prev) => {
-          const participant = prev.find((p) => p.id === participantId);
-          const newMutedState = !isEnabled;
-          // Только обновляем, если значение действительно изменилось
-          if (participant && participant.isMuted === newMutedState) {
-            return prev;
-          }
-          return prev.map((p) =>
-            p.id === participantId ? { ...p, isMuted: newMutedState } : p
-          );
-        });
+        setParticipants((prev) =>
+          prev.map((p) =>
+            p.id === participantId ? { ...p, isMuted: !isEnabled } : p
+          )
+        );
       },
       onParticipantVideoToggle: (participantId, isEnabled) => {
         console.log(`[useWebRTC] Video toggle for ${participantId}: ${isEnabled}`);
-        setParticipants((prev) => {
-          const participant = prev.find((p) => p.id === participantId);
-          const newVideoOffState = !isEnabled;
-          // Только обновляем, если значение действительно изменилось
-          if (participant && participant.isVideoOff === newVideoOffState) {
-            return prev;
-          }
-          return prev.map((p) =>
-            p.id === participantId ? { ...p, isVideoOff: newVideoOffState } : p
-          );
-        });
+        setParticipants((prev) =>
+          prev.map((p) =>
+            p.id === participantId ? { ...p, isVideoOff: !isEnabled } : p
+          )
+        );
       },
       onParticipantSpeakingChange: (participantId, isSpeaking) => {
-        setParticipants((prev) => {
-          const participant = prev.find((p) => p.id === participantId);
-          // Только обновляем, если значение действительно изменилось
-          if (participant && participant.isSpeaking === isSpeaking) {
-            return prev;
-          }
-          return prev.map((p) =>
+        setParticipants((prev) =>
+          prev.map((p) =>
             p.id === participantId ? { ...p, isSpeaking } : p
-          );
-        });
+          )
+        );
       },
       onChatMessage: (message) => {
         console.log("[useWebRTC] onChatMessage called:", message);