diff --git a/CHANGELOG.md b/CHANGELOG.md index 36f336ea..59338f3c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -30,6 +30,7 @@ and this project adheres to - 🐛(frontend) use state instead of a ref for MoreControls container - 🐛(frontend) stop init_virtual_background from firing on blur updates - 🐛(frontend) hoist mute confirmation dialog to VideoConference level +- 🐛(frontend) fix joined notification tile no longer rendering properly ## [1.27.0] - 2026-08-14 diff --git a/src/frontend/src/features/notifications/components/ToastJoined.tsx b/src/frontend/src/features/notifications/components/ToastJoined.tsx index fd4f9863..336dc9d9 100644 --- a/src/frontend/src/features/notifications/components/ToastJoined.tsx +++ b/src/frontend/src/features/notifications/components/ToastJoined.tsx @@ -1,5 +1,5 @@ import { useToast } from 'react-aria' -import { useRef } from 'react' +import { useMemo, useRef } from 'react' import { Button as RACButton } from 'react-aria-components' import { Track } from 'livekit-client' import Source = Track.Source @@ -11,6 +11,7 @@ import { Div } from '@/primitives' import { useTranslation } from 'react-i18next' import { StyledToastContainer } from './StyledToastContainer' import { setPinnedTrack } from '@/stores/layout' +import { useParticipantTracks } from '@livekit/components-react' const ClickableToast = styled(RACButton, { base: { @@ -30,13 +31,17 @@ export function ToastJoined({ state, ...props }: Readonly) { ) const participant = props.toast.content.participant - if (!participant) return + const [cameraTrack] = useParticipantTracks( + [Source.Camera], + participant?.identity + ) - const trackReference = { - participant, - publication: participant.getTrackPublication(Source.Camera), - source: Source.Camera, - } + const trackReference = useMemo( + () => cameraTrack ?? { participant, source: Source.Camera }, + [cameraTrack, participant] + ) + + if (!participant) return return (