"Fossies" - the Fresh Open Source Software Archive

Member "jitsi-meet-7328/react/features/conference/components/native/carmode/TitleBar.tsx" (8 Jun 2023, 3276 Bytes) of package /linux/misc/jitsi-meet-7328.tar.gz:


As a special service "Fossies" has tried to format the requested source page into HTML format using (guessed) TSX (TypeScript with React) source code syntax highlighting (style: standard) with prefixed line numbers. Alternatively you can here view or download the uninterpreted source code file. See also the last Fossies "Diffs" side-by-side code changes report for "TitleBar.tsx": jitsi-meet_8319_vs_jitsi-meet_8615.

    1 import React from 'react';
    2 import { StyleProp, Text, View, ViewStyle } from 'react-native';
    3 import { connect, useSelector } from 'react-redux';
    4 
    5 import { IReduxState } from '../../../../app/types';
    6 import { getConferenceName } from '../../../../base/conference/functions';
    7 import { MEETING_NAME_ENABLED } from '../../../../base/flags/constants';
    8 import { getFeatureFlag } from '../../../../base/flags/functions';
    9 import { JitsiRecordingConstants } from '../../../../base/lib-jitsi-meet';
   10 import { getLocalParticipant } from '../../../../base/participants/functions';
   11 import ConnectionIndicator from '../../../../connection-indicator/components/native/ConnectionIndicator';
   12 import RecordingLabel from '../../../../recording/components/native/RecordingLabel';
   13 import VideoQualityLabel from '../../../../video-quality/components/VideoQualityLabel.native';
   14 
   15 import styles from './styles';
   16 
   17 
   18 interface IProps {
   19 
   20     /**
   21      * Name of the meeting we're currently in.
   22      */
   23     _meetingName: string;
   24 
   25     /**
   26      * Whether displaying the current meeting name is enabled or not.
   27      */
   28     _meetingNameEnabled: boolean;
   29 
   30 }
   31 
   32 /**
   33  * Implements a navigation bar component that is rendered on top of the
   34  * carmode screen.
   35  *
   36  * @param {IProps} props - The React props passed to this component.
   37  * @returns {JSX.Element}
   38  */
   39 const TitleBar = (props: IProps): JSX.Element => {
   40     const localParticipant = useSelector(getLocalParticipant);
   41     const localParticipantId = localParticipant?.id;
   42 
   43     return (
   44         <View
   45             style = { styles.titleBarWrapper as StyleProp<ViewStyle> }>
   46             <View
   47                 pointerEvents = 'box-none'
   48                 style = { styles.roomNameWrapper as StyleProp<ViewStyle> }>
   49                 <View style = { styles.qualityLabelContainer as StyleProp<ViewStyle> }>
   50                     <VideoQualityLabel />
   51                 </View>
   52                 <ConnectionIndicator
   53                     iconStyle = { styles.connectionIndicatorIcon }
   54                     participantId = { localParticipantId } />
   55                 <View style = { styles.headerLabels as StyleProp<ViewStyle> }>
   56                     <RecordingLabel mode = { JitsiRecordingConstants.mode.FILE } />
   57                     <RecordingLabel mode = { JitsiRecordingConstants.mode.STREAM } />
   58                 </View>
   59                 {
   60                     props._meetingNameEnabled
   61                     && <View style = { styles.roomNameView as StyleProp<ViewStyle> }>
   62                         <Text
   63                             numberOfLines = { 1 }
   64                             style = { styles.roomName }>
   65                             { props._meetingName }
   66                         </Text>
   67                     </View>
   68                 }
   69             </View>
   70         </View>
   71     );
   72 };
   73 
   74 /**
   75  * Maps part of the Redux store to the props of this component.
   76  *
   77  * @param {Object} state - The Redux state.
   78  * @returns {IProps}
   79  */
   80 function _mapStateToProps(state: IReduxState) {
   81     const { hideConferenceSubject } = state['features/base/config'];
   82 
   83     return {
   84         _meetingName: getConferenceName(state),
   85         _meetingNameEnabled:
   86             getFeatureFlag(state, MEETING_NAME_ENABLED, true) && !hideConferenceSubject
   87     };
   88 }
   89 
   90 export default connect(_mapStateToProps)(TitleBar);