diff --git a/src/frontend/src/features/participantTile/components/ParticipantMetadata.tsx b/src/frontend/src/features/participantTile/components/ParticipantMetadata.tsx index 48365901..ec2624b3 100644 --- a/src/frontend/src/features/participantTile/components/ParticipantMetadata.tsx +++ b/src/frontend/src/features/participantTile/components/ParticipantMetadata.tsx @@ -3,7 +3,6 @@ import { LockLockedIcon, ScreenShareIcon, useIsEncrypted, - useParticipantInfo, } from '@livekit/components-react' import { HStack } from '@/styled-system/jsx' import { Participant } from 'livekit-client' @@ -12,13 +11,14 @@ import { ParticipantName } from './ParticipantName' import { RaisedHandMetadataWrapper } from './RaisedHandMetadataWrapper' export const ParticipantMetadata = ({ + displayedName, participant, isScreenShare, }: { + displayedName: string participant: Participant isScreenShare: boolean }) => { - const { identity, name } = useParticipantInfo({ participant }) const isEncrypted = useIsEncrypted(participant) return ( @@ -42,7 +42,7 @@ export const ParticipantMetadata = ({ )}
diff --git a/src/frontend/src/features/participantTile/components/ParticipantTile.tsx b/src/frontend/src/features/participantTile/components/ParticipantTile.tsx index c64786b2..ae2f0cd4 100644 --- a/src/frontend/src/features/participantTile/components/ParticipantTile.tsx +++ b/src/frontend/src/features/participantTile/components/ParticipantTile.tsx @@ -9,6 +9,7 @@ import { VideoTrack, TrackRefContext, ParticipantContextIfNeeded, + useParticipantInfo, } from '@livekit/components-react' import { isEqualTrackRef, @@ -19,7 +20,6 @@ import { Track } from 'livekit-client' import { ParticipantPlaceholder } from './ParticipantPlaceholder' import { ParticipantTileFocus } from './ParticipantTileFocus' import { FullScreenShareWarning } from './FullScreenShareWarning' -import { getParticipantName } from '@/features/rooms/utils/getParticipantName' import { useTranslation } from 'react-i18next' import { getShortcutDescriptorById } from '@/features/shortcuts/catalog' import { formatShortcutLabel } from '@/features/shortcuts/formatLabels' @@ -93,7 +93,11 @@ export const ParticipantTile: ( const participantColor = getParticipantColor(trackReference.participant) - const participantName = getParticipantName(trackReference.participant) + const { identity, name } = useParticipantInfo({ + participant: trackReference.participant, + }) + const participantName = name || identity || 'Unknown' + const { t } = useTranslation('rooms', { keyPrefix: 'participantTileFocus' }) const interactiveProps = { @@ -145,14 +149,12 @@ export const ParticipantTile: (
{!disableMetadata && (