From 126e2d6e1482d51242fef031b2634e1b1a96658b Mon Sep 17 00:00:00 2001 From: Bettenbuk Zoltan Date: Mon, 3 Sep 2018 15:53:24 +0200 Subject: [PATCH] Move DialogContainer to BaseApp to have dialogs on the welcome screen too --- react/features/app/components/App.native.js | 12 +++++++++++ react/features/app/components/App.web.js | 14 +++++++++++++ react/features/base/app/components/BaseApp.js | 8 +++++++ .../base/dialog/components/DialogContainer.js | 21 ++++++++++++++----- .../components/Conference.native.js | 7 +------ .../conference/components/Conference.web.js | 2 -- .../welcome/components/WelcomePage.web.js | 4 ---- 7 files changed, 51 insertions(+), 17 deletions(-) diff --git a/react/features/app/components/App.native.js b/react/features/app/components/App.native.js index 358b8b9c1..900652e95 100644 --- a/react/features/app/components/App.native.js +++ b/react/features/app/components/App.native.js @@ -5,6 +5,7 @@ import { Linking } from 'react-native'; import '../../analytics'; import '../../authentication'; +import { DialogContainer } from '../../base/dialog'; import '../../base/jwt'; import { Platform } from '../../base/react'; import { @@ -180,6 +181,17 @@ export class App extends AbstractApp { _onLinkingURL({ url }) { super._openURL(url); } + + /** + * Renders the platform specific dialog container. + * + * @returns {React$Element} + */ + _renderDialogContainer() { + return ( + + ); + } } /** diff --git a/react/features/app/components/App.web.js b/react/features/app/components/App.web.js index b71ccc6ea..5e5bcae7a 100644 --- a/react/features/app/components/App.web.js +++ b/react/features/app/components/App.web.js @@ -3,6 +3,7 @@ import { AtlasKitThemeProvider } from '@atlaskit/theme'; import React from 'react'; +import { DialogContainer } from '../../base/dialog'; import '../../base/responsive-ui'; import '../../chat'; import '../../room-lock'; @@ -39,4 +40,17 @@ export class App extends AbstractApp { ); } + + /** + * Renders the platform specific dialog container. + * + * @returns {React$Element} + */ + _renderDialogContainer() { + return ( + + + + ); + } } diff --git a/react/features/base/app/components/BaseApp.js b/react/features/base/app/components/BaseApp.js index c7f47e972..000ff56a2 100644 --- a/react/features/base/app/components/BaseApp.js +++ b/react/features/base/app/components/BaseApp.js @@ -127,6 +127,7 @@ export default class BaseApp extends Component<*, State> { { this._createMainElement(component) } { this._createExtraElement() } + { this._renderDialogContainer() } @@ -235,4 +236,11 @@ export default class BaseApp extends Component<*, State> { this.setState({ route }, resolve); }); } + + /** + * Renders the platform specific dialog container. + * + * @returns {React$Element} + */ + _renderDialogContainer: () => React$Element<*> } diff --git a/react/features/base/dialog/components/DialogContainer.js b/react/features/base/dialog/components/DialogContainer.js index 3ac8f7d52..7648c3a6a 100644 --- a/react/features/base/dialog/components/DialogContainer.js +++ b/react/features/base/dialog/components/DialogContainer.js @@ -22,7 +22,12 @@ export class DialogContainer extends Component { /** * The props to pass to the component that will be rendered. */ - _componentProps: PropTypes.object + _componentProps: PropTypes.object, + + /** + * True if the UI is in a compact state where we don't show dialogs. + */ + _reducedUI: PropTypes.bool }; /** @@ -32,10 +37,13 @@ export class DialogContainer extends Component { * @returns {ReactElement} */ render() { - const { _component: component } = this.props; + const { + _component: component, + _reducedUI: reducedUI + } = this.props; return ( - component + component && !reducedUI ? React.createElement(component, this.props._componentProps) : null); } @@ -49,15 +57,18 @@ export class DialogContainer extends Component { * @private * @returns {{ * _component: React.Component, - * _componentProps: Object + * _componentProps: Object, + * _reducedUI: boolean * }} */ function _mapStateToProps(state) { const stateFeaturesBaseDialog = state['features/base/dialog']; + const { reducedUI } = state['features/base/responsive-ui']; return { _component: stateFeaturesBaseDialog.component, - _componentProps: stateFeaturesBaseDialog.componentProps + _componentProps: stateFeaturesBaseDialog.componentProps, + _reducedUI: reducedUI }; } diff --git a/react/features/conference/components/Conference.native.js b/react/features/conference/components/Conference.native.js index 312877436..046114088 100644 --- a/react/features/conference/components/Conference.native.js +++ b/react/features/conference/components/Conference.native.js @@ -8,7 +8,6 @@ import { connect as reactReduxConnect } from 'react-redux'; import { appNavigate } from '../../app'; import { connect, disconnect } from '../../base/connection'; -import { DialogContainer } from '../../base/dialog'; import { getParticipantCount } from '../../base/participants'; import { Container, LoadingIndicator, TintedView } from '../../base/react'; import { @@ -315,11 +314,7 @@ class Conference extends Component { this._renderConferenceNotification() } - {/* - * The dialogs are in the topmost stacking layers. - */ - this.props._reducedUI || - } + ); } diff --git a/react/features/conference/components/Conference.web.js b/react/features/conference/components/Conference.web.js index 1a4e43925..687ba5a6b 100644 --- a/react/features/conference/components/Conference.web.js +++ b/react/features/conference/components/Conference.web.js @@ -8,7 +8,6 @@ import VideoLayout from '../../../../modules/UI/videolayout/VideoLayout'; import { obtainConfig } from '../../base/config'; import { connect, disconnect } from '../../base/connection'; -import { DialogContainer } from '../../base/dialog'; import { translate } from '../../base/i18n'; import { Filmstrip } from '../../filmstrip'; import { CalleeInfoContainer } from '../../invite'; @@ -226,7 +225,6 @@ class Conference extends Component { { filmstripOnly || } { filmstripOnly || } - diff --git a/react/features/welcome/components/WelcomePage.web.js b/react/features/welcome/components/WelcomePage.web.js index a0360362a..258ea7d49 100644 --- a/react/features/welcome/components/WelcomePage.web.js +++ b/react/features/welcome/components/WelcomePage.web.js @@ -7,7 +7,6 @@ import { AtlasKitThemeProvider } from '@atlaskit/theme'; import React from 'react'; import { connect } from 'react-redux'; -import { DialogContainer } from '../../base/dialog'; import { translate } from '../../base/i18n'; import { Platform, Watermarks } from '../../base/react'; import { CalendarList } from '../../calendar-sync'; @@ -168,9 +167,6 @@ class WelcomePage extends AbstractWelcomePage { ref = { this._setAdditionalContentRef } /> : null } - - - ); }