feat(toolbox): move visibleButtons to redux

Technically we still depend on interfaceConfig, but this paves the way for when
that is no longer the case.
This commit is contained in:
Saúl Ibarra Corretgé 2018-04-20 13:56:24 +02:00 committed by Lyubo Marinov
parent 9a3effe97a
commit 9ca7ca9515
1 changed files with 13 additions and 7 deletions

View File

@ -158,6 +158,11 @@ type Props = {
*/ */
_visible: boolean, _visible: boolean,
/**
* Set with the buttons which this Toolbox should display.
*/
_visibleButtons: Set<string>,
/** /**
* Invoked to active other features of the app. * Invoked to active other features of the app.
*/ */
@ -178,8 +183,6 @@ declare var interfaceConfig: Object;
* @extends Component * @extends Component
*/ */
class Toolbox extends Component<Props> { class Toolbox extends Component<Props> {
_visibleButtons: Object;
/** /**
* Initializes a new {@code Toolbox} instance. * Initializes a new {@code Toolbox} instance.
* *
@ -189,8 +192,6 @@ class Toolbox extends Component<Props> {
constructor(props: Props) { constructor(props: Props) {
super(props); super(props);
this._visibleButtons = new Set(interfaceConfig.TOOLBAR_BUTTONS);
// Bind event handlers so they are only bound once per instance. // Bind event handlers so they are only bound once per instance.
this._onMouseOut = this._onMouseOut.bind(this); this._onMouseOut = this._onMouseOut.bind(this);
this._onMouseOver = this._onMouseOver.bind(this); this._onMouseOver = this._onMouseOver.bind(this);
@ -315,10 +316,11 @@ class Toolbox extends Component<Props> {
_overflowMenuVisible, _overflowMenuVisible,
_raisedHand, _raisedHand,
_visible, _visible,
_visibleButtons,
t t
} = this.props; } = this.props;
const rootClassNames = `new-toolbox ${_visible ? 'visible' : ''} ${ const rootClassNames = `new-toolbox ${_visible ? 'visible' : ''} ${
this._visibleButtons.size ? '' : 'no-buttons'}`; _visibleButtons.size ? '' : 'no-buttons'}`;
const overflowMenuContent = this._renderOverflowMenuContent(); const overflowMenuContent = this._renderOverflowMenuContent();
const overflowHasItems = Boolean(overflowMenuContent.filter( const overflowHasItems = Boolean(overflowMenuContent.filter(
child => child).length); child => child).length);
@ -1030,7 +1032,7 @@ class Toolbox extends Component<Props> {
* @returns {boolean} True if the button should be displayed. * @returns {boolean} True if the button should be displayed.
*/ */
_shouldShowButton(buttonName) { _shouldShowButton(buttonName) {
return this._visibleButtons.has(buttonName); return this.props._visibleButtons.has(buttonName);
} }
} }
@ -1093,7 +1095,11 @@ function _mapStateToProps(state) {
_sharingVideo: sharedVideoStatus === 'playing' _sharingVideo: sharedVideoStatus === 'playing'
|| sharedVideoStatus === 'start' || sharedVideoStatus === 'start'
|| sharedVideoStatus === 'pause', || sharedVideoStatus === 'pause',
_visible: Boolean(timeoutID || visible || alwaysVisible) _visible: Boolean(timeoutID || visible || alwaysVisible),
// XXX: We are not currently using state here, but in the future, when
// interfaceConfig is part of redux we will.
_visibleButtons: new Set(interfaceConfig.TOOLBAR_BUTTONS)
}; };
} }