From 9d0767ccfebd3088209a0b76e3b34e271b902741 Mon Sep 17 00:00:00 2001 From: lebaudantoine Date: Thu, 19 Sep 2024 22:36:34 +0200 Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F(frontend)=20refactor=20usePa?= =?UTF-8?q?rticipants=20to=20streamline=20updatesOnlyOn=20logic?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Simplified the logic to avoid redundancy. Removed unnecessary duplication of eventGroups, as it's already exported from the core. My bad for the initial complication — code is now cleaner. --- .../Participants/ParticipantsList.tsx | 8 +++-- .../rooms/livekit/constants/events.ts | 33 ------------------- 2 files changed, 6 insertions(+), 35 deletions(-) delete mode 100644 src/frontend/src/features/rooms/livekit/constants/events.ts diff --git a/src/frontend/src/features/rooms/livekit/components/controls/Participants/ParticipantsList.tsx b/src/frontend/src/features/rooms/livekit/components/controls/Participants/ParticipantsList.tsx index 6c79ee9c..63207799 100644 --- a/src/frontend/src/features/rooms/livekit/components/controls/Participants/ParticipantsList.tsx +++ b/src/frontend/src/features/rooms/livekit/components/controls/Participants/ParticipantsList.tsx @@ -1,13 +1,14 @@ import { css } from '@/styled-system/css' +import { allParticipantRoomEvents } from '@livekit/components-core' import { useParticipants } from '@livekit/components-react' import { Div, H } from '@/primitives' import { useTranslation } from 'react-i18next' -import { allParticipantRoomEvents } from '@/features/rooms/livekit/constants/events' import { ParticipantListItem } from '../../controls/Participants/ParticipantListItem' import { ParticipantsCollapsableList } from '../../controls/Participants/ParticipantsCollapsableList' import { HandRaisedListItem } from '../../controls/Participants/HandRaisedListItem' import { LowerAllHandsButton } from '../../controls/Participants/LowerAllHandsButton' +import { RoomEvent } from 'livekit-client' // TODO: Optimize rendering performance, especially for longer participant lists, even though they are generally short. export const ParticipantsList = () => { @@ -17,7 +18,10 @@ export const ParticipantsList = () => { // because the 'useLocalParticipant' hook does not update the participant's information when their // metadata/name changes. The LiveKit team has marked this as a TODO item in the code. const participants = useParticipants({ - updateOnlyOn: allParticipantRoomEvents, + updateOnlyOn: [ + RoomEvent.ParticipantNameChanged, + ...allParticipantRoomEvents, + ], }) const sortedRemoteParticipants = participants diff --git a/src/frontend/src/features/rooms/livekit/constants/events.ts b/src/frontend/src/features/rooms/livekit/constants/events.ts deleted file mode 100644 index 1d1c6a87..00000000 --- a/src/frontend/src/features/rooms/livekit/constants/events.ts +++ /dev/null @@ -1,33 +0,0 @@ -import { RoomEvent } from 'livekit-client' - -// Issue: 'allRemoteParticipantRoomEvents' is not exposed or importable. One event is missing -// to trigger the real-time update of participants when they change their name. -// This code is duplicated from LiveKit. -export const allRemoteParticipantRoomEvents = [ - RoomEvent.ConnectionStateChanged, - RoomEvent.RoomMetadataChanged, - - RoomEvent.ActiveSpeakersChanged, - RoomEvent.ConnectionQualityChanged, - - RoomEvent.ParticipantConnected, - RoomEvent.ParticipantDisconnected, - RoomEvent.ParticipantPermissionsChanged, - RoomEvent.ParticipantMetadataChanged, - RoomEvent.ParticipantNameChanged, // This element is missing in LiveKit and causes problems - - RoomEvent.TrackMuted, - RoomEvent.TrackUnmuted, - RoomEvent.TrackPublished, - RoomEvent.TrackUnpublished, - RoomEvent.TrackStreamStateChanged, - RoomEvent.TrackSubscriptionFailed, - RoomEvent.TrackSubscriptionPermissionChanged, - RoomEvent.TrackSubscriptionStatusChanged, -] - -export const allParticipantRoomEvents = [ - ...allRemoteParticipantRoomEvents, - RoomEvent.LocalTrackPublished, - RoomEvent.LocalTrackUnpublished, -]