fix(info): do not show dial in numbers without a room specified

For the static page an error message displays stating no room
was specified. On mobile for unsupported browsers, the dial in
info will not show.

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%;
 

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",

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(
         <I18nextProvider i18n = { i18next }>
-            <DialInSummary
-                className = 'dial-in-page'
-                clickableNumbers = { false }
-                room = { params.room } />
+            { room
+                ? <DialInSummary
+                    className = 'dial-in-page'
+                    clickableNumbers = { false }
+                    room = { params.room } />
+                : <NoRoomError className = 'dial-in-page' /> }
         </I18nextProvider>,
         document.getElementById('react')
     );

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 (
+            <div className = { this.props.className } >
+                <div>{ t('info.noNumbers') }</div>
+                <div>{ t('info.noRoom') }</div>
+            </div>
+        );
+    }
+}
+
+export default translate(NoRoomError);

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`) }
                         </button>
                     </a>
-                    <DialInSummary
-                        className = 'unsupported-dial-in'
-                        clickableNumbers = { true }
-                        room = { this.props._room } />
+                    { _room
+                        ? <DialInSummary
+                            className = 'unsupported-dial-in'
+                            clickableNumbers = { true }
+                            room = { _room } />
+                        : null }
                 </div>
                 <HideNotificationBarStyle />
             </div>