Merge pull request #3012 from saghul/overflow-menu-dismiss

[RN] Dismiss OverflowMenu after selecting an option

react/features/base/toolbox/components/AbstractButton.js

@@ -7,6 +7,11 @@ import ToolboxItem from './ToolboxItem';
 
 export type Props = {
 
+    /**
+     * Function to be called after the click handler has been processed.
+     */
+    afterClick: ?Function,
+
     /**
      * Whether to show the label or not.
      */
@@ -38,6 +43,7 @@ export type Props = {
  */
 export default class AbstractButton<P: Props, S: *> extends Component<P, S> {
     static defaultProps = {
+        afterClick: undefined,
         showLabel: false,
         styles: undefined,
         toggledStyles: undefined,
@@ -165,7 +171,10 @@ export default class AbstractButton<P: Props, S: *> extends Component<P, S> {
      * @returns {void}
      */
     _onClick() {
+        const { afterClick } = this.props;
+
         this._handleClick();
+        afterClick && afterClick();
     }
 
     /**

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

@@ -56,23 +56,19 @@ class OverflowMenu extends Component<Props> {
      * @returns {ReactElement}
      */
     render() {
+        const buttonProps = {
+            afterClick: this._onCancel,
+            showLabel: true,
+            styles: overflowMenuItemStyles
+        };
+
         return (
             <BottomSheet onCancel = { this._onCancel }>
-                <AudioRouteButton
+                <AudioRouteButton { ...buttonProps } />
-                    showLabel = { true }
+                <ToggleCameraButton { ...buttonProps } />
-                    styles = { overflowMenuItemStyles } />
+                <AudioOnlyButton { ...buttonProps } />
-                <ToggleCameraButton
+                <RoomLockButton { ...buttonProps } />
-                    showLabel = { true }
+                <PictureInPictureButton { ...buttonProps } />
-                    styles = { overflowMenuItemStyles } />
-                <AudioOnlyButton
-                    showLabel = { true }
-                    styles = { overflowMenuItemStyles } />
-                <RoomLockButton
-                    showLabel = { true }
-                    styles = { overflowMenuItemStyles } />
-                <PictureInPictureButton
-                    showLabel = { true }
-                    styles = { overflowMenuItemStyles } />
             </BottomSheet>
         );
     }