diff --git a/react/features/conference/components/native/AlwaysOnLabels.js b/react/features/conference/components/native/AlwaysOnLabels.js index a040c8bf6..ca9cb3014 100644 --- a/react/features/conference/components/native/AlwaysOnLabels.js +++ b/react/features/conference/components/native/AlwaysOnLabels.js @@ -8,12 +8,14 @@ import { JitsiRecordingConstants } from '../../../base/lib-jitsi-meet'; import { RecordingLabel } from '../../../recording'; import { openHighlightDialog } from '../../../recording/actions.native'; import HighlightButton from '../../../recording/components/Recording/native/HighlightButton'; +import VisitorsCountLabel from '../../../visitors/components/native/VisitorsCountLabel'; import RaisedHandsCountLabel from './RaisedHandsCountLabel'; import { LABEL_ID_RAISED_HANDS_COUNT, LABEL_ID_RECORDING, LABEL_ID_STREAMING, + LABEL_ID_VISITORS_COUNT, LabelHitSlop } from './constants'; @@ -51,6 +53,11 @@ const AlwaysOnLabels = ({ createOnPress }: Props) => { onPress = { createOnPress(LABEL_ID_RAISED_HANDS_COUNT) } > + + + ); }; diff --git a/react/features/conference/components/native/constants.js b/react/features/conference/components/native/constants.js index 341b50038..aebf53276 100644 --- a/react/features/conference/components/native/constants.js +++ b/react/features/conference/components/native/constants.js @@ -26,6 +26,7 @@ export const LABEL_ID_STREAMING = 'streaming'; export const LABEL_ID_TRANSCRIBING = 'transcribing'; export const LABEL_ID_INSECURE_ROOM_NAME = 'insecure-room-name'; export const LABEL_ID_RAISED_HANDS_COUNT = 'raised-hands-count'; +export const LABEL_ID_VISITORS_COUNT = 'visitors-count'; /** * The {@code ExpandedLabel} components to be rendered for the individual diff --git a/react/features/participants-pane/components/native/MeetingParticipantList.tsx b/react/features/participants-pane/components/native/MeetingParticipantList.tsx index ca3dcd0c9..1f97b09bf 100644 --- a/react/features/participants-pane/components/native/MeetingParticipantList.tsx +++ b/react/features/participants-pane/components/native/MeetingParticipantList.tsx @@ -2,7 +2,7 @@ import React, { PureComponent } from 'react'; import { WithTranslation } from 'react-i18next'; -import { FlatList } from 'react-native'; +import { FlatList, Text } from 'react-native'; import { IReduxState } from '../../../app/types'; import { translate } from '../../../base/i18n/functions'; @@ -68,6 +68,11 @@ type Props = WithTranslation & { */ _sortedRemoteParticipants: Map; + /** + * The current visitors count if any. + */ + _visitorsCount: number; + /** * List of breakout rooms that were created. */ @@ -189,6 +194,7 @@ class MeetingParticipantList extends PureComponent { _participantsCount, _showInviteButton, _sortedRemoteParticipants, + _visitorsCount, breakoutRooms, isLocalModerator, lobbyParticipants, @@ -217,48 +223,54 @@ class MeetingParticipantList extends PureComponent { const finalContainerStyle = _participantsCount > 6 && containerStyle; const { color, shareDialogVisible } = _inviteOthersControl; + const _visitorsLabelText = _visitorsCount > 0 + ? t('participantsPane.headings.visitors', { count: _visitorsCount }) + : undefined; return ( - - { - _showInviteButton - &&