bigbluebutton-Github/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx
prlanzarin 35f519206b Revert additional indentation to actions-bar component
I must have messed this up in the 2.2 - 2.3 merge or with vim somehow, mea culpa
2021-03-12 01:47:05 +00:00

95 lines
2.7 KiB
JavaScript
Executable File

import React, { PureComponent } from 'react';
import cx from 'classnames';
import { styles } from './styles.scss';
import ActionsDropdown from './actions-dropdown/container';
import ScreenshareButtonContainer from '/imports/ui/components/actions-bar/screenshare/container';
import AudioControlsContainer from '../audio/audio-controls/container';
import JoinVideoOptionsContainer from '../video-provider/video-button/container';
import CaptionsButtonContainer from '/imports/ui/components/actions-bar/captions/container';
import PresentationOptionsContainer from './presentation-options/component';
import { ACTIONSBAR_HEIGHT } from '/imports/ui/components/layout/layout-manager';
class ActionsBar extends PureComponent {
render() {
const {
amIPresenter,
amIModerator,
enableVideo,
isLayoutSwapped,
toggleSwapLayout,
handleTakePresenter,
intl,
isSharingVideo,
stopExternalVideoShare,
isCaptionsAvailable,
isMeteorConnected,
isPollingEnabled,
isPresentationDisabled,
isThereCurrentPresentation,
allowExternalVideo,
} = this.props;
const actionBarClasses = {};
actionBarClasses[styles.centerWithActions] = amIPresenter;
actionBarClasses[styles.center] = true;
actionBarClasses[styles.mobileLayoutSwapped] = isLayoutSwapped && amIPresenter;
return (
<div
className={styles.actionsbar}
style={{
height: ACTIONSBAR_HEIGHT,
}}
>
<div className={styles.left}>
<ActionsDropdown {...{
amIPresenter,
amIModerator,
isPollingEnabled,
allowExternalVideo,
handleTakePresenter,
intl,
isSharingVideo,
stopExternalVideoShare,
isMeteorConnected,
}}
/>
{isCaptionsAvailable
? (
<CaptionsButtonContainer {...{ intl }} />
)
: null
}
</div>
<div className={cx(actionBarClasses)}>
<AudioControlsContainer />
{enableVideo
? (
<JoinVideoOptionsContainer />
)
: null}
<ScreenshareButtonContainer {...{
amIPresenter,
isMeteorConnected,
}}
/>
</div>
<div className={styles.right}>
{isLayoutSwapped && !isPresentationDisabled
? (
<PresentationOptionsContainer
toggleSwapLayout={toggleSwapLayout}
isThereCurrentPresentation={isThereCurrentPresentation}
/>
)
: null
}
</div>
</div>
);
}
}
export default ActionsBar;