feat(participants-pane) changed to standard header

lang/main.json

@@ -592,6 +592,7 @@
     },
     "participantsPane": {
         "close": "Close",
+        "header": "Participants",
         "headings": {
             "lobby": "Lobby ({{count}})",
             "participantsList": "Meeting participants ({{count}})",

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

@@ -7,7 +7,7 @@ import { Button } from 'react-native-paper';
 import { useDispatch, useSelector } from 'react-redux';
 
 import { openDialog } from '../../../base/dialog';
-import { Icon, IconClose, IconHorizontalPoints } from '../../../base/icons';
+import { Icon, IconHorizontalPoints } from '../../../base/icons';
 import { JitsiModal } from '../../../base/modal';
 import {
     getParticipantCount,
@@ -40,21 +40,11 @@ const ParticipantsPane = () => {
 
     return (
         <JitsiModal
-            hideHeaderWithNavigation = { true }
+            headerProps = {{
+                headerLabelKey: 'participantsPane.header'
+            }}
+            onClose = { closePane }
             style = { styles.participantsPane }>
-            <View style = { styles.header }>
-                <Button
-                    /* eslint-disable-next-line react/jsx-no-bind */
-                    icon = { () =>
-                        (<Icon
-                            size = { 20 }
-                            src = { IconClose } />)
-                    }
-                    labelStyle = { styles.closeIcon }
-                    mode = 'contained'
-                    onPress = { closePane }
-                    style = { styles.closeButton } />
-            </View>
             <ScrollView>
                 <LobbyParticipantList />
                 <MeetingParticipantList />

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

@@ -213,19 +213,6 @@ export default {
         marginLeft: BaseTheme.spacing[3]
     },
 
-    header: {
-        alignItems: 'center',
-        backgroundColor: BaseTheme.palette.ui01,
-        top: BaseTheme.spacing[0],
-        display: 'flex',
-        flexDirection: 'row',
-        height: BaseTheme.spacing[10],
-        paddingRight: BaseTheme.spacing[3],
-        position: 'relative',
-        right: BaseTheme.spacing[0],
-        left: BaseTheme.spacing[0]
-    },
-
     footer: {
         alignItems: 'center',
         backgroundColor: BaseTheme.palette.ui01,
@@ -240,17 +227,6 @@ export default {
         left: BaseTheme.spacing[0]
     },
 
-    closeButton: {
-        ...smallButton,
-        marginLeft: 'auto'
-    },
-
-    closeIcon: {
-        ...buttonContent,
-        height: BaseTheme.spacing[5],
-        marginLeft: 'auto'
-    },
-
     inviteButton: {
         backgroundColor: BaseTheme.palette.action01,
         marginTop: BaseTheme.spacing[2],