diff --git a/react/features/participants-pane/components/web/CurrentVisitorsList.tsx b/react/features/participants-pane/components/web/CurrentVisitorsList.tsx index 499a909064..ec02c50da7 100644 --- a/react/features/participants-pane/components/web/CurrentVisitorsList.tsx +++ b/react/features/participants-pane/components/web/CurrentVisitorsList.tsx @@ -6,6 +6,7 @@ import AutoSizer from 'react-virtualized-auto-sizer'; import { FixedSizeList } from 'react-window'; import { makeStyles } from 'tss-react/mui'; +import { IReduxState } from '../../../app/types'; import Icon from '../../../base/icons/components/Icon'; import { IconArrowDown, IconArrowUp } from '../../../base/icons/svg'; import { withPixelLineHeight } from '../../../base/styles/functions.web'; @@ -78,6 +79,7 @@ export default function CurrentVisitorsList({ searchString }: IProps) { const visitors = useSelector(getVisitorsList); const featureEnabled = useSelector(isVisitorsListEnabled); const shouldDisplayList = useSelector(shouldDisplayCurrentVisitorsList); + const { defaultRemoteDisplayName } = useSelector((state: IReduxState) => state['features/base/config']); const { t } = useTranslation(); const { classes } = useStyles(); const dispatch = useDispatch(); @@ -109,9 +111,11 @@ export default function CurrentVisitorsList({ searchString }: IProps) { return null; } - const filtered = visitors.filter(v => - normalizeAccents(v.name).toLowerCase().includes(normalizeAccents(searchString).toLowerCase()) - ); + const filtered = visitors.filter(v => { + const displayName = v.name || defaultRemoteDisplayName || 'Fellow Jitster'; + + return normalizeAccents(displayName).toLowerCase().includes(normalizeAccents(searchString).toLowerCase()); + }); // ListItem height is 56px including padding so the item size // for virtualization needs to match it exactly to avoid clipping. @@ -125,7 +129,7 @@ export default function CurrentVisitorsList({ searchString }: IProps) {