Extract isToolboxVisible function

react/features/toolbox/components/native/Toolbox.js

@@ -7,8 +7,12 @@ import { connect } from 'react-redux';
 import { Container } from '../../../base/react';
 import { ChatButton } from '../../../chat';
 
+import { isToolboxVisible } from '../../functions';
+
 import AudioMuteButton from '../AudioMuteButton';
 import HangupButton from '../HangupButton';
+import VideoMuteButton from '../VideoMuteButton';
+
 import OverflowMenuButton from './OverflowMenuButton';
 import styles, {
     chatButtonOverride,
@@ -16,7 +20,6 @@ import styles, {
     toolbarButtonStyles,
     toolbarToggledButtonStyles
 } from './styles';
-import VideoMuteButton from '../VideoMuteButton';
 
 /**
  * The number of buttons other than {@link HangupButton} to render in
@@ -262,10 +265,8 @@ class Toolbox extends Component<Props, State> {
  * }}
  */
 function _mapStateToProps(state: Object): Object {
-    const { alwaysVisible, enabled, visible } = state['features/toolbox'];
-
     return {
-        _visible: enabled && (alwaysVisible || visible)
+        _visible: isToolboxVisible(state)
     };
 }
 

react/features/toolbox/functions.any.js

@@ -0,0 +1,17 @@
+// @flow
+
+import { toState } from '../base/redux';
+
+/**
+ * Returns true if the toolbox is visible.
+ *
+ * @param {Object | Function} stateful - A function or object that can be
+ * resolved to Redux state by the function {@code toState}.
+ * @returns {boolean}
+ */
+export function isToolboxVisible(stateful: Object | Function) {
+    const { alwaysVisible, enabled, visible }
+        = toState(stateful)['features/toolbox'];
+
+    return enabled && (alwaysVisible || visible);
+}

react/features/toolbox/functions.native.js

@@ -0,0 +1,3 @@
+// @flow
+
+export * from './functions.any';

react/features/toolbox/functions.web.js

@@ -1,5 +1,7 @@
 // @flow
 
+export * from './functions.any';
+
 declare var interfaceConfig: Object;
 
 /**