From 4d9dcf5d43a4cf6b8b983738985ec5c71d3b1e0c Mon Sep 17 00:00:00 2001 From: Bettenbuk Zoltan Date: Tue, 2 Apr 2019 15:16:52 +0200 Subject: [PATCH] [RN] Add InfoDialogButton --- .../components/InfoDialogButton.native.js | 0 .../invite/components/InviteButton.native.js | 118 ------------------ .../invite/components/InviteButton.web.js | 0 .../add-people-dialog/native/InviteButton.js | 73 +++++++++++ .../add-people-dialog/native/index.js | 1 + react/features/invite/components/index.js | 3 +- .../info-dialog/DialInNumber.native.js | 0 .../info-dialog/InfoDialog.native.js | 0 .../info-dialog/PasswordForm.native.js | 0 .../invite/components/info-dialog/index.js | 1 - .../components/info-dialog/index.native.js | 3 + .../components/info-dialog/index.web.js | 3 + .../info-dialog/native/InfoDialogButton.js | 38 ++++++ .../components/info-dialog/native/index.js | 3 + .../DialInNumber.js} | 4 +- .../{InfoDialog.web.js => web/InfoDialog.js} | 16 +-- .../web/InfoDialogButton.js} | 22 ++-- .../PasswordForm.js} | 6 +- .../components/info-dialog/web/index.js | 4 + .../toolbox/components/native/OverflowMenu.js | 3 +- 20 files changed, 152 insertions(+), 146 deletions(-) delete mode 100644 react/features/invite/components/InfoDialogButton.native.js delete mode 100644 react/features/invite/components/InviteButton.native.js delete mode 100644 react/features/invite/components/InviteButton.web.js create mode 100644 react/features/invite/components/add-people-dialog/native/InviteButton.js delete mode 100644 react/features/invite/components/info-dialog/DialInNumber.native.js delete mode 100644 react/features/invite/components/info-dialog/InfoDialog.native.js delete mode 100644 react/features/invite/components/info-dialog/PasswordForm.native.js delete mode 100644 react/features/invite/components/info-dialog/index.js create mode 100644 react/features/invite/components/info-dialog/index.native.js create mode 100644 react/features/invite/components/info-dialog/index.web.js create mode 100644 react/features/invite/components/info-dialog/native/InfoDialogButton.js create mode 100644 react/features/invite/components/info-dialog/native/index.js rename react/features/invite/components/info-dialog/{DialInNumber.web.js => web/DialInNumber.js} (96%) rename react/features/invite/components/info-dialog/{InfoDialog.web.js => web/InfoDialog.js} (97%) rename react/features/invite/components/{InfoDialogButton.web.js => info-dialog/web/InfoDialogButton.js} (91%) rename react/features/invite/components/info-dialog/{PasswordForm.web.js => web/PasswordForm.js} (97%) create mode 100644 react/features/invite/components/info-dialog/web/index.js diff --git a/react/features/invite/components/InfoDialogButton.native.js b/react/features/invite/components/InfoDialogButton.native.js deleted file mode 100644 index e69de29bb..000000000 diff --git a/react/features/invite/components/InviteButton.native.js b/react/features/invite/components/InviteButton.native.js deleted file mode 100644 index 797383628..000000000 --- a/react/features/invite/components/InviteButton.native.js +++ /dev/null @@ -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 { - 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) { - 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)); diff --git a/react/features/invite/components/InviteButton.web.js b/react/features/invite/components/InviteButton.web.js deleted file mode 100644 index e69de29bb..000000000 diff --git a/react/features/invite/components/add-people-dialog/native/InviteButton.js b/react/features/invite/components/add-people-dialog/native/InviteButton.js new file mode 100644 index 000000000..06d1b810f --- /dev/null +++ b/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 +}; + +/** + * Implements an {@link AbstractButton} to enter add/invite people to the + * current call/conference/meeting. + */ +class InviteButton extends AbstractButton { + 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)); diff --git a/react/features/invite/components/add-people-dialog/native/index.js b/react/features/invite/components/add-people-dialog/native/index.js index f2e67e631..1aedf86dc 100644 --- a/react/features/invite/components/add-people-dialog/native/index.js +++ b/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'; diff --git a/react/features/invite/components/index.js b/react/features/invite/components/index.js index b5335af1d..791759e8e 100644 --- a/react/features/invite/components/index.js +++ b/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'; diff --git a/react/features/invite/components/info-dialog/DialInNumber.native.js b/react/features/invite/components/info-dialog/DialInNumber.native.js deleted file mode 100644 index e69de29bb..000000000 diff --git a/react/features/invite/components/info-dialog/InfoDialog.native.js b/react/features/invite/components/info-dialog/InfoDialog.native.js deleted file mode 100644 index e69de29bb..000000000 diff --git a/react/features/invite/components/info-dialog/PasswordForm.native.js b/react/features/invite/components/info-dialog/PasswordForm.native.js deleted file mode 100644 index e69de29bb..000000000 diff --git a/react/features/invite/components/info-dialog/index.js b/react/features/invite/components/info-dialog/index.js deleted file mode 100644 index 1bba5d390..000000000 --- a/react/features/invite/components/info-dialog/index.js +++ /dev/null @@ -1 +0,0 @@ -export { default as InfoDialog } from './InfoDialog'; diff --git a/react/features/invite/components/info-dialog/index.native.js b/react/features/invite/components/info-dialog/index.native.js new file mode 100644 index 000000000..a32ec6061 --- /dev/null +++ b/react/features/invite/components/info-dialog/index.native.js @@ -0,0 +1,3 @@ +// @flow + +export * from './native'; diff --git a/react/features/invite/components/info-dialog/index.web.js b/react/features/invite/components/info-dialog/index.web.js new file mode 100644 index 000000000..40d5f4652 --- /dev/null +++ b/react/features/invite/components/info-dialog/index.web.js @@ -0,0 +1,3 @@ +// @flow + +export * from './web'; diff --git a/react/features/invite/components/info-dialog/native/InfoDialogButton.js b/react/features/invite/components/info-dialog/native/InfoDialogButton.js new file mode 100644 index 000000000..19f7312b0 --- /dev/null +++ b/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 +}; + +/** + * Implements an {@link AbstractButton} to open the info dialog of the meeting. + */ +class InfoDialogButton extends AbstractButton { + 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)); diff --git a/react/features/invite/components/info-dialog/native/index.js b/react/features/invite/components/info-dialog/native/index.js new file mode 100644 index 000000000..716ff1f95 --- /dev/null +++ b/react/features/invite/components/info-dialog/native/index.js @@ -0,0 +1,3 @@ +// @flow + +export { default as InfoDialogButton } from './InfoDialogButton'; diff --git a/react/features/invite/components/info-dialog/DialInNumber.web.js b/react/features/invite/components/info-dialog/web/DialInNumber.js similarity index 96% rename from react/features/invite/components/info-dialog/DialInNumber.web.js rename to react/features/invite/components/info-dialog/web/DialInNumber.js index 8a2da804e..f8dc205c2 100644 --- a/react/features/invite/components/info-dialog/DialInNumber.web.js +++ b/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}. diff --git a/react/features/invite/components/info-dialog/InfoDialog.web.js b/react/features/invite/components/info-dialog/web/InfoDialog.js similarity index 97% rename from react/features/invite/components/info-dialog/InfoDialog.web.js rename to react/features/invite/components/info-dialog/web/InfoDialog.js index f77099025..8046dd81b 100644 --- a/react/features/invite/components/info-dialog/InfoDialog.web.js +++ b/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'; diff --git a/react/features/invite/components/InfoDialogButton.web.js b/react/features/invite/components/info-dialog/web/InfoDialogButton.js similarity index 91% rename from react/features/invite/components/InfoDialogButton.web.js rename to react/features/invite/components/info-dialog/web/InfoDialogButton.js index a6306c7f6..333fe5547 100644 --- a/react/features/invite/components/InfoDialogButton.web.js +++ b/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 { 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 InfoDialog from './InfoDialog'; /** * The type of the React {@code Component} props of {@link InfoDialogButton}. diff --git a/react/features/invite/components/info-dialog/PasswordForm.web.js b/react/features/invite/components/info-dialog/web/PasswordForm.js similarity index 97% rename from react/features/invite/components/info-dialog/PasswordForm.web.js rename to react/features/invite/components/info-dialog/web/PasswordForm.js index 7578ac5d2..fa03d9ded 100644 --- a/react/features/invite/components/info-dialog/PasswordForm.web.js +++ b/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}. diff --git a/react/features/invite/components/info-dialog/web/index.js b/react/features/invite/components/info-dialog/web/index.js new file mode 100644 index 000000000..9370dbefe --- /dev/null +++ b/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'; diff --git a/react/features/toolbox/components/native/OverflowMenu.js b/react/features/toolbox/components/native/OverflowMenu.js index e4a112b46..2aa954bae 100644 --- a/react/features/toolbox/components/native/OverflowMenu.js +++ b/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 { + );