feat(native-participants-pane) fixed lint errors

react/features/participants-pane/components/native/Button.js

@@ -13,35 +13,35 @@ let buttonContent;
  */
 type Props = {
 
+    /**
+     * Button content.
+     */
+    content?: string,
+
     /**
      * Is the button icon type?
      */
-    iconButton: boolean,
+    iconButton?: boolean,
 
     /**
      * Style for the icon
      */
-    iconStyle: Object,
+    iconStyle?: Object,
 
     /**
      * Size of the icon.
      */
-    iconSize: number,
+    iconSize?: number,
 
     /**
      * Icon component source.
      */
     iconSrc?: Object,
 
-    /**
-     * Button content.
-     */
-    content: string,
-
     /**
      * Button mode.
      */
-    mode: string,
+    mode?: string,
 
     /**
      * Style of button's inner content.
@@ -51,17 +51,17 @@ type Props = {
     /**
      * The action to be performed when the button is pressed.
      */
-    onPress: Function,
+    onPress?: Function,
 
     /**
      * An external style object passed to the component.
      */
-    style: Object,
+    style?: Object,
 
     /**
      * Theme to be applied.
      */
-    theme: Object
+    theme?: Object
 };
 
 /**

react/features/participants-pane/components/native/LobbyParticipantList.js

@@ -1,12 +1,36 @@
 // @flow
 
 import React from 'react';
+import { useTranslation } from 'react-i18next';
 import { View } from 'react-native';
+import { Text } from 'react-native-paper';
 import { useSelector } from 'react-redux';
 
-// import { getLobbyState } from '../../../lobby/functions';
+import { getLobbyState } from '../../../lobby/functions';
 
 import { LobbyParticipantItem } from './LobbyParticipantItem';
 import { participants } from './participants';
 
-export const LobbyParticipantList = () => null;
+export const LobbyParticipantList = () => {
+    const {
+        lobbyEnabled
+    } = useSelector(getLobbyState);
+    const { t } = useTranslation();
+
+    if (!lobbyEnabled || !participants.length) {
+        return null;
+    }
+
+    return (
+        <>
+            <Text>{t('participantsPane.headings.lobby', { count: participants.length })}</Text>
+            <View>
+                {participants.map(p => (
+                    <LobbyParticipantItem
+                        key = { p.id }
+                        participant = { p } />)
+                )}
+            </View>
+        </>
+    );
+};

react/features/participants-pane/components/native/MeetingParticipantItem.js

@@ -1,19 +0,0 @@
-// @flow
-
-import React from 'react';
-
-import ParticipantItem from './ParticipantItem';
-
-
-type Props = {
-
-    /**
-     * Participant reference
-     */
-    participant: Object
-};
-
-export const MeetingParticipantItem = ({ participant: p }: Props) => (
-    <ParticipantItem
-        participant = { p } />
-);

react/features/participants-pane/components/native/MeetingParticipantList.js

@@ -1,36 +0,0 @@
-// @flow
-
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { View } from 'react-native';
-import { Text } from 'react-native-paper';
-import { useSelector } from 'react-redux';
-
-import { getParticipants } from '../../../base/participants';
-
-import { MeetingParticipantItem } from './MeetingParticipantItem';
-import styles from './styles';
-
-
-export const MeetingParticipantList = () => {
-    const participants = useSelector(getParticipants);
-    const { t } = useTranslation();
-
-    return (
-        <View style = { styles.lobbyListContainer }>
-            <Text>
-                {
-                    t('participantsPane.headings.participantsList',
-                    { count: participants.length }
-                    )
-                }
-            </Text>
-            {
-                participants.map(p => (
-                    <MeetingParticipantItem
-                        key = { p.id }
-                        participant = { p } />)
-                )}
-        </View>
-    );
-};

react/features/participants-pane/components/native/ParticipantItem.js

@@ -9,7 +9,6 @@ import { useSelector } from 'react-redux';
 import { Avatar } from '../../../base/avatar';
 import { getParticipantDisplayNameWithId } from '../../../base/participants';
 import {
-    ActionTrigger,
     AudioStateIcons,
     MediaState,
     VideoStateIcons
@@ -20,11 +19,6 @@ import styles from './styles';
 
 type Props = {
 
-    /**
-     * Type of trigger for the participant actions
-     */
-    actionsTrigger: ActionTrigger,
-
     /**
      * Media state for audio
      */

react/features/participants-pane/components/native/ParticipantsPane.js

@@ -9,7 +9,7 @@ import { useDispatch, useSelector } from 'react-redux';
 import { IconClose, IconHorizontalPoints } from '../../../base/icons';
 import { JitsiModal } from '../../../base/modal';
 import { isLocalParticipantModerator } from '../../../base/participants';
-import { close } from '../../actions.native';
+import { close } from '../../actions.any';
 
 import Button from './Button';
 import { LobbyParticipantList } from './LobbyParticipantList';