diff --git a/css/unsupported-browser/_unsupported-mobile-browser.scss b/css/unsupported-browser/_unsupported-mobile-browser.scss index 2b2d2c666..0ab5dbda1 100644 --- a/css/unsupported-browser/_unsupported-mobile-browser.scss +++ b/css/unsupported-browser/_unsupported-mobile-browser.scss @@ -2,7 +2,6 @@ background-color: #fff; height: 100vh; overflow: auto; - padding: 35px 0; position: relative; width: 100vw; @@ -14,7 +13,7 @@ color: $unsupportedBrowserTextColor; margin: auto; max-width: 40em; - padding-bottom: 40px; + padding: 35px 0 40px 0; text-align: center; width: 75%; diff --git a/lang/main.json b/lang/main.json index 0f10649e2..fdb588de9 100644 --- a/lang/main.json +++ b/lang/main.json @@ -499,7 +499,9 @@ "invitePhoneAlternatives": "To view more phone numbers, click this link: __url__", "inviteURL": "To join the video meeting, click this link: __url__", "moreNumbers": "More numbers", + "noNumbers": "No dial-in numbers.", "noPassword": "None", + "noRoom": "No room was specified to dial-in into.", "numbers": "Dial-in Numbers", "password": "Password:", "title": "Call info", diff --git a/react/features/invite/components/dial-in-info-page/DialInInfoApp.web.js b/react/features/invite/components/dial-in-info-page/DialInInfoApp.web.js index a3b56b86a..62c978334 100644 --- a/react/features/invite/components/dial-in-info-page/DialInInfoApp.web.js +++ b/react/features/invite/components/dial-in-info-page/DialInInfoApp.web.js @@ -7,15 +7,20 @@ import { i18next } from '../../../base/i18n'; import { DialInSummary } from '../dial-in-summary'; +import NoRoomError from './NoRoomError'; + document.addEventListener('DOMContentLoaded', () => { const params = parseURLParams(window.location, true, 'search'); + const { room } = params; ReactDOM.render( - + { room + ? + : } , document.getElementById('react') ); diff --git a/react/features/invite/components/dial-in-info-page/NoRoomError.native.js b/react/features/invite/components/dial-in-info-page/NoRoomError.native.js new file mode 100644 index 000000000..e69de29bb diff --git a/react/features/invite/components/dial-in-info-page/NoRoomError.web.js b/react/features/invite/components/dial-in-info-page/NoRoomError.web.js new file mode 100644 index 000000000..10fb9429a --- /dev/null +++ b/react/features/invite/components/dial-in-info-page/NoRoomError.web.js @@ -0,0 +1,48 @@ +import PropTypes from 'prop-types'; +import React, { Component } from 'react'; + +import { translate } from '../../../base/i18n'; + +/** + * Displays an error message stating no room name was specified to fetch dial-in + * numbers for. + * + * @extends Component + */ +class NoRoomError extends Component { + /** + * {@code NoRoomError} component's property types. + * + * @static + */ + static propTypes = { + /** + * Additional CSS classnames to append to the root of the component. + */ + className: PropTypes.string, + + /** + * Invoked to obtain translated strings. + */ + t: PropTypes.func + }; + + /** + * Implements React's {@link Component#render()}. + * + * @inheritdoc + * @returns {ReactElement} + */ + render() { + const { t } = this.props; + + return ( +
+
{ t('info.noNumbers') }
+
{ t('info.noRoom') }
+
+ ); + } +} + +export default translate(NoRoomError); diff --git a/react/features/unsupported-browser/components/UnsupportedMobileBrowser.js b/react/features/unsupported-browser/components/UnsupportedMobileBrowser.js index 2b3e769b7..644c03ae6 100644 --- a/react/features/unsupported-browser/components/UnsupportedMobileBrowser.js +++ b/react/features/unsupported-browser/components/UnsupportedMobileBrowser.js @@ -96,7 +96,7 @@ class UnsupportedMobileBrowser extends Component<*, *> { * @returns {ReactElement} */ render() { - const { t } = this.props; + const { _room, t } = this.props; const openAppButtonClassName = `${_SNS}__button ${_SNS}__button_primary`; @@ -128,10 +128,12 @@ class UnsupportedMobileBrowser extends Component<*, *> { { t(`${_TNS}.downloadApp`) } - + { _room + ? + : null }