[RN] Add InfoDialogButton

react/features/invite/components/InviteButton.native.js

@@ -1,118 +0,0 @@
-// @flow
-
-import type { Dispatch } from 'redux';
-
-import { translate } from '../../base/i18n';
-import { connect } from '../../base/redux';
-import { AbstractButton } from '../../base/toolbox';
-import type { AbstractButtonProps } from '../../base/toolbox';
-import { beginShareRoom } from '../../share-room';
-
-import { setAddPeopleDialogVisible } from '../actions';
-import { isAddPeopleEnabled, isDialOutEnabled } from '../functions';
-
-type Props = AbstractButtonProps & {
-
-    /**
-     * Whether or not the feature to invite people to join the
-     * conference is available.
-     */
-    _addPeopleEnabled: boolean,
-
-    /**
-     * Opens the add people dialog.
-     */
-    _onOpenAddPeopleDialog: Function,
-
-    /**
-     * Begins the UI procedure to share the conference/room URL.
-     */
-    _onShareRoom: Function
-};
-
-/**
- * Implements an {@link AbstractButton} to enter add/invite people to the
- * current call/conference/meeting.
- */
-class InviteButton extends AbstractButton<Props, *> {
-    accessibilityLabel = 'toolbar.accessibilityLabel.shareRoom';
-    iconName = 'icon-link';
-    label = 'toolbar.shareRoom';
-
-    /**
-     * Handles clicking / pressing the button, and opens the appropriate dialog.
-     *
-     * @private
-     * @returns {void}
-     */
-    _handleClick() {
-        const {
-            _addPeopleEnabled,
-            _onOpenAddPeopleDialog,
-            _onShareRoom
-        } = this.props;
-
-        if (_addPeopleEnabled) {
-            _onOpenAddPeopleDialog();
-        } else {
-            _onShareRoom();
-        }
-    }
-}
-
-/**
- * Maps redux actions to {@link InviteButton}'s React
- * {@code Component} props.
- *
- * @param {Function} dispatch - The redux action {@code dispatch} function.
- * @returns {{
- *     _onOpenAddPeopleDialog,
- *     _onShareRoom
- * }}
- * @private
- */
-function _mapDispatchToProps(dispatch: Dispatch<any>) {
-    return {
-
-        /**
-         * Opens the add people dialog.
-         *
-         * @private
-         * @returns {void}
-         * @type {Function}
-         */
-        _onOpenAddPeopleDialog() {
-            dispatch(setAddPeopleDialogVisible(true));
-        },
-
-        /**
-         * Begins the UI procedure to share the conference/room URL.
-         *
-         * @private
-         * @returns {void}
-         * @type {Function}
-         */
-        _onShareRoom() {
-            dispatch(beginShareRoom());
-        }
-    };
-}
-
-/**
- * Maps (parts of) the redux state to {@link Toolbox}'s React {@code Component}
- * props.
- *
- * @param {Object} state - The redux store/state.
- * @private
- * @returns {{
- *   _addPeopleEnabled: boolean
- * }}
- */
-function _mapStateToProps(state) {
-    return {
-        _addPeopleEnabled: isAddPeopleEnabled(state) || isDialOutEnabled(state)
-    };
-}
-
-export default translate(
-    connect(_mapStateToProps, _mapDispatchToProps)(InviteButton));

react/features/invite/components/add-people-dialog/native/InviteButton.js

@@ -0,0 +1,73 @@
+// @flow
+
+import type { Dispatch } from 'redux';
+
+import { translate } from '../../../../base/i18n';
+import { connect } from '../../../../base/redux';
+import { AbstractButton } from '../../../../base/toolbox';
+import type { AbstractButtonProps } from '../../../../base/toolbox';
+
+import { setAddPeopleDialogVisible } from '../../../actions';
+import { isAddPeopleEnabled, isDialOutEnabled } from '../../../functions';
+
+type Props = AbstractButtonProps & {
+
+    /**
+     * Whether or not the feature to invite people to join the
+     * conference is available.
+     */
+    _addPeopleEnabled: boolean,
+
+    /**
+     * The Redux dispatch function.
+     */
+    dispatch: Dispatch<any>
+};
+
+/**
+ * Implements an {@link AbstractButton} to enter add/invite people to the
+ * current call/conference/meeting.
+ */
+class InviteButton extends AbstractButton<Props, *> {
+    accessibilityLabel = 'toolbar.accessibilityLabel.shareRoom';
+    iconName = 'icon-link';
+    label = 'toolbar.shareRoom';
+
+    /**
+     * Handles clicking / pressing the button, and opens the appropriate dialog.
+     *
+     * @private
+     * @returns {void}
+     */
+    _handleClick() {
+        this.props.dispatch(setAddPeopleDialogVisible(true));
+    }
+
+    /**
+     * Returns true if none of the invite methods are available.
+     *
+     * @protected
+     * @returns {boolean}
+     */
+    _isDisabled() {
+        return !this.props._addPeopleEnabled;
+    }
+}
+
+/**
+ * Maps (parts of) the redux state to {@link InviteButton}'s React {@code Component}
+ * props.
+ *
+ * @param {Object} state - The redux store/state.
+ * @private
+ * @returns {{
+ *   _addPeopleEnabled: boolean
+ * }}
+ */
+function _mapStateToProps(state) {
+    return {
+        _addPeopleEnabled: isAddPeopleEnabled(state) || isDialOutEnabled(state)
+    };
+}
+
+export default translate(connect(_mapStateToProps)(InviteButton));

react/features/invite/components/add-people-dialog/native/index.js

@@ -1,3 +1,4 @@
 // @flow
 
 export { default as AddPeopleDialog } from './AddPeopleDialog';
+export { default as InviteButton } from './InviteButton';

react/features/invite/components/index.js

@@ -2,6 +2,5 @@
 
 export * from './add-people-dialog';
 export { DialInSummary } from './dial-in-summary';
-export { default as InfoDialogButton } from './InfoDialogButton';
-export { default as InviteButton } from './InviteButton';
+export * from './info-dialog';
 export * from './callee-info';

react/features/invite/components/info-dialog/index.js

@@ -1 +0,0 @@
-export { default as InfoDialog } from './InfoDialog';

react/features/invite/components/info-dialog/index.native.js

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

react/features/invite/components/info-dialog/index.web.js

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

react/features/invite/components/info-dialog/native/InfoDialogButton.js

@@ -0,0 +1,38 @@
+// @flow
+
+import type { Dispatch } from 'redux';
+
+import { translate } from '../../../../base/i18n';
+import { connect } from '../../../../base/redux';
+import { AbstractButton } from '../../../../base/toolbox';
+import type { AbstractButtonProps } from '../../../../base/toolbox';
+import { beginShareRoom } from '../../../../share-room';
+
+type Props = AbstractButtonProps & {
+
+    /**
+     * The Redux dispatch function.
+     */
+    dispatch: Dispatch<any>
+};
+
+/**
+ * Implements an {@link AbstractButton} to open the info dialog of the meeting.
+ */
+class InfoDialogButton extends AbstractButton<Props, *> {
+    accessibilityLabel = 'info.accessibilityLabel';
+    iconName = 'icon-info';
+    label = 'info.label';
+
+    /**
+     * Handles clicking / pressing the button, and opens the appropriate dialog.
+     *
+     * @private
+     * @returns {void}
+     */
+    _handleClick() {
+        this.props.dispatch(beginShareRoom());
+    }
+}
+
+export default translate(connect()(InfoDialogButton));

react/features/invite/components/info-dialog/native/index.js

@@ -0,0 +1,3 @@
+// @flow
+
+export { default as InfoDialogButton } from './InfoDialogButton';

react/features/invite/components/info-dialog/web/DialInNumber.js

@@ -1,8 +1,8 @@
-/* @flow */
+// @flow
 
 import React, { Component } from 'react';
 
-import { translate } from '../../../base/i18n';
+import { translate } from '../../../../base/i18n';
 
 /**
  * The type of the React {@code Component} props of {@link DialInNumber}.

react/features/invite/components/info-dialog/web/InfoDialog.js

@@ -1,16 +1,16 @@
-/* @flow */
+// @flow
 
 import React, { Component } from 'react';
 import type { Dispatch } from 'redux';
 
-import { setPassword } from '../../../base/conference';
-import { getInviteURL } from '../../../base/connection';
-import { Dialog } from '../../../base/dialog';
-import { translate } from '../../../base/i18n';
-import { connect } from '../../../base/redux';
-import { isLocalParticipantModerator } from '../../../base/participants';
+import { setPassword } from '../../../../base/conference';
+import { getInviteURL } from '../../../../base/connection';
+import { Dialog } from '../../../../base/dialog';
+import { translate } from '../../../../base/i18n';
+import { connect } from '../../../../base/redux';
+import { isLocalParticipantModerator } from '../../../../base/participants';
 
-import { _getDefaultPhoneNumber, getDialInfoPageURL } from '../../functions';
+import { _getDefaultPhoneNumber, getDialInfoPageURL } from '../../../functions';
 import DialInNumber from './DialInNumber';
 import PasswordForm from './PasswordForm';
 

react/features/invite/components/info-dialog/web/InfoDialogButton.js

@@ -4,18 +4,18 @@ import InlineDialog from '@atlaskit/inline-dialog';
 import React, { Component } from 'react';
 import type { Dispatch } from 'redux';
 
-import { createToolbarEvent, sendAnalytics } from '../../analytics';
-import { openDialog } from '../../base/dialog';
-import { translate } from '../../base/i18n';
-import { JitsiRecordingConstants } from '../../base/lib-jitsi-meet';
-import { getParticipantCount } from '../../base/participants';
-import { OverflowMenuItem } from '../../base/toolbox';
-import { connect } from '../../base/redux';
-import { getActiveSession } from '../../recording';
-import { ToolbarButton } from '../../toolbox';
-import { updateDialInNumbers } from '../actions';
-
-import { InfoDialog } from './info-dialog';
+import { createToolbarEvent, sendAnalytics } from '../../../../analytics';
+import { openDialog } from '../../../../base/dialog';
+import { translate } from '../../../../base/i18n';
+import { JitsiRecordingConstants } from '../../../../base/lib-jitsi-meet';
+import { getParticipantCount } from '../../../../base/participants';
+import { OverflowMenuItem } from '../../../../base/toolbox';
+import { connect } from '../../../../base/redux';
+import { getActiveSession } from '../../../../recording';
+import { ToolbarButton } from '../../../../toolbox';
+import { updateDialInNumbers } from '../../../actions';
+
+import InfoDialog from './InfoDialog';
 
 /**
  * The type of the React {@code Component} props of {@link InfoDialogButton}.

react/features/invite/components/info-dialog/web/PasswordForm.js

@@ -1,9 +1,9 @@
-/* @flow */
+// @flow
 
 import React, { Component } from 'react';
 
-import { translate } from '../../../base/i18n';
-import { LOCKED_LOCALLY } from '../../../room-lock';
+import { translate } from '../../../../base/i18n';
+import { LOCKED_LOCALLY } from '../../../../room-lock';
 
 /**
  * The type of the React {@code Component} props of {@link PasswordForm}.

react/features/invite/components/info-dialog/web/index.js

@@ -0,0 +1,4 @@
+// @flow
+
+export { default as InfoDialog } from './InfoDialog';
+export { default as InfoDialogButton } from './InfoDialogButton';

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

@@ -10,7 +10,7 @@ import {
 } from '../../../base/dialog';
 import { connect } from '../../../base/redux';
 import { StyleType } from '../../../base/styles';
-import { InviteButton } from '../../../invite';
+import { InfoDialogButton, InviteButton } from '../../../invite';
 import { AudioRouteButton } from '../../../mobile/audio-mode';
 import { LiveStreamButton, RecordButton } from '../../../recording';
 import { RoomLockButton } from '../../../room-lock';
@@ -96,6 +96,7 @@ class OverflowMenu extends Component<Props> {
                 <LiveStreamButton { ...buttonProps } />
                 <TileViewButton { ...buttonProps } />
                 <InviteButton { ...buttonProps } />
+                <InfoDialogButton { ...buttonProps } />
                 <RaiseHandButton { ...buttonProps } />
             </BottomSheet>
         );