jiti-meet/react/features/conference/components/web/Subject.js

83 lines
2.0 KiB
JavaScript
Raw Normal View History

2019-03-12 17:45:53 +00:00
/* @flow */
import React, { Component } from 'react';
import { getConferenceName } from '../../../base/conference/functions';
import { getParticipantCount } from '../../../base/participants/functions';
2019-03-21 16:38:29 +00:00
import { connect } from '../../../base/redux';
2019-03-12 17:45:53 +00:00
import { isToolboxVisible } from '../../../toolbox';
2020-01-13 17:12:25 +00:00
import ConferenceTimer from '../ConferenceTimer';
2020-05-20 10:57:03 +00:00
2019-10-31 06:14:15 +00:00
import ParticipantsCount from './ParticipantsCount';
2019-03-12 17:45:53 +00:00
/**
* The type of the React {@code Component} props of {@link Subject}.
*/
type Props = {
/**
* Whether then participant count should be shown or not.
*/
_showParticipantCount: boolean,
2019-03-12 17:45:53 +00:00
/**
* The subject or the of the conference.
* Falls back to conference name.
2019-03-12 17:45:53 +00:00
*/
_subject: string,
/**
* Indicates whether the component should be visible or not.
*/
_visible: boolean
};
/**
* Subject react component.
*
* @class Subject
*/
class Subject extends Component<Props> {
/**
* Implements React's {@link Component#render()}.
*
* @inheritdoc
* @returns {ReactElement}
*/
render() {
const { _showParticipantCount, _subject, _visible } = this.props;
2019-03-12 17:45:53 +00:00
return (
<div className = { `subject ${_visible ? 'visible' : ''}` }>
2019-10-31 06:14:15 +00:00
<span className = 'subject-text'>{ _subject }</span>
{ _showParticipantCount && <ParticipantsCount /> }
2020-01-13 17:12:25 +00:00
<ConferenceTimer />
2019-03-12 17:45:53 +00:00
</div>
);
}
}
/**
* Maps (parts of) the Redux state to the associated
* {@code Subject}'s props.
*
* @param {Object} state - The Redux state.
* @private
* @returns {{
* _subject: string,
* _visible: boolean
* }}
*/
function _mapStateToProps(state) {
const participantCount = getParticipantCount(state);
2019-03-12 17:45:53 +00:00
return {
_showParticipantCount: participantCount > 2,
_subject: getConferenceName(state),
_visible: isToolboxVisible(state) && participantCount > 1
2019-03-12 17:45:53 +00:00
};
}
2019-03-19 15:42:25 +00:00
2019-03-12 17:45:53 +00:00
export default connect(_mapStateToProps)(Subject);