Handles disabled dial-out codes. (#1847)

Hides the UI component showing dialout codes and uses the dial input without validating it.

Skips printing error when dial-in numbers is not configured.

react/features/dial-out/actions.js

@@ -47,6 +47,19 @@ export function checkDialNumber(dialNumber) {
     return (dispatch, getState) => {
         const { dialOutAuthUrl } = getState()['features/base/config'];
 
+        if (!dialOutAuthUrl) {
+            // no auth url, let's say it is valid
+            const response = {};
+
+            response.allow = true;
+            dispatch({
+                type: PHONE_NUMBER_CHECKED,
+                response
+            });
+
+            return;
+        }
+
         const fullUrl = `${dialOutAuthUrl}?phone=${dialNumber}`;
 
         $.getJSON(fullUrl)
@@ -82,6 +95,10 @@ export function updateDialOutCodes() {
     return (dispatch, getState) => {
         const { dialOutCodesUrl } = getState()['features/base/config'];
 
+        if (!dialOutCodesUrl) {
+            return;
+        }
+
         $.getJSON(dialOutCodesUrl)
             .success(response =>
                 dispatch({

react/features/dial-out/components/DialOutDialog.web.js

@@ -18,6 +18,11 @@ class DialOutDialog extends Component {
      * @static
      */
     static propTypes = {
+        /**
+         * The redux state representing the list of dial-out codes.
+         */
+        _dialOutCodes: React.PropTypes.array,
+
         /**
          * Property indicating if a dial number is allowed.
          */
@@ -176,15 +181,23 @@ class DialOutDialog extends Component {
      * @returns {void}
      */
     _onDialNumberChange(dialCode, dialInput) {
-        // We remove all starting zeros from the dial input before attaching it
-        // to the country code.
-        const formattedDialInput = dialInput.replace(/^(0+)/, '');
+        let formattedDialInput, formattedNumber;
 
-        const dialNumber = `${dialCode}${formattedDialInput}`;
+        // if there are no dial out codes it is possible they are disabled
+        // so we get the input as is, it can be just a sip address
+        if (this.props._dialOutCodes) {
+            // We remove all starting zeros from the dial input before attaching
+            // it to the country code.
+            formattedDialInput = dialInput.replace(/^(0+)/, '');
 
-        const formattedNumber = this._formatDialNumber(dialNumber);
+            const dialNumber = `${dialCode}${formattedDialInput}`;
 
-        this.props.checkDialNumber(formattedNumber);
+            formattedNumber = this._formatDialNumber(dialNumber);
+
+            this.props.checkDialNumber(formattedNumber);
+        } else {
+            formattedNumber = formattedDialInput = dialInput;
+        }
 
         this.setState({
             dialNumber: formattedNumber,
@@ -205,9 +218,17 @@ class DialOutDialog extends Component {
  * }}
  */
 function _mapStateToProps(state) {
-    const { isDialNumberAllowed } = state['features/dial-out'];
+    const { dialOutCodes, isDialNumberAllowed } = state['features/dial-out'];
 
     return {
+        /**
+         * List of dial-out codes.
+         *
+         * @private
+         * @type {array}
+         */
+        _dialOutCodes: dialOutCodes,
+
         /**
          * Property indicating if a dial number is allowed.
          *

react/features/dial-out/components/DialOutNumbersForm.web.js

@@ -141,12 +141,11 @@ class DialOutNumbersForm extends Component {
      */
     render() {
         const { t, _dialOutCodes } = this.props;
-        const items
-            = _dialOutCodes ? this._formatCountryCodes(_dialOutCodes) : [];
 
         return (
             <div className = 'form-control'>
-                { this._createDropdownMenu(items) }
+                { _dialOutCodes ? this._createDropdownMenu(
+                        this._formatCountryCodes(_dialOutCodes)) : null }
                 <div className = 'dial-out-input'>
                     <AKFieldText
                         autoFocus = { true }
@@ -155,7 +154,8 @@ class DialOutNumbersForm extends Component {
                         onChange = { this._onInputChange }
                         placeholder = { t('dialOut.enterPhone') }
                         ref = { this._setDialInputElement }
-                        shouldFitContainer = { true } />
+                        shouldFitContainer = { true }
+                        value = { this.state.dialInput } />
                 </div>
             </div>
         );

react/features/dial-out/reducer.js

@@ -20,7 +20,12 @@ ReducerRegistry.register(
     (state = DEFAULT_STATE, action) => {
         switch (action.type) {
         case DIAL_OUT_CANCELED: {
-            return DEFAULT_STATE;
+            // if we have already downloaded codes fill them in default state
+            // to skip another ajax query
+            return {
+                ...DEFAULT_STATE,
+                dialOutCodes: state.dialOutCodes
+            };
         }
         case DIAL_OUT_CODES_UPDATED: {
             return {

react/features/invite/actions.js

@@ -40,11 +40,7 @@ export function updateDialInNumbers() {
         const mucURL = hosts && hosts.muc;
 
         if (!dialInConfCodeUrl || !dialInNumbersUrl || !mucURL) {
-            dispatch({
-                type: UPDATE_DIAL_IN_NUMBERS_FAILED,
-                error: 'URLs for fetching dial in numbers not properly defined'
-            });
-
+            // URLs for fetching dial in numbers not defined
             return;
         }