PLT-5608 App crashes when invalid server url is selected (#285)

* PLT-5608 App crashes with wrong URL

* Review feedback

* FormattedError Modification

* Rename i18n id for server ping failure message

* Display friendly error message if server ping fails w/o response

app/components/error_text.js

@@ -1,31 +1,33 @@
 // Copyright (c) 2016 Mattermost, Inc. All Rights Reserved.
 // See License.txt for license information.
 
-import React, {Component, PropTypes} from 'react';
+import React, {PropTypes, PureComponent} from 'react';
 import {Text} from 'react-native';
 import FormattedText from 'app/components/formatted_text';
 
 import {GlobalStyles} from 'app/styles';
 
-const propTypes = {
-    error: PropTypes.oneOfType([PropTypes.string, PropTypes.object])
-};
+export default class ErrorText extends PureComponent {
+    static propTypes = {
+        error: PropTypes.oneOfType([PropTypes.string, PropTypes.object])
+    };
 
-export default class ErrorText extends Component {
-    static propTypes = propTypes;
+    static defaultProps = {
+        error: {}
+    };
 
     render() {
         if (!this.props.error) {
             return null;
         }
 
-        if (this.props.error.hasOwnProperty('id')) {
-            const {error} = this.props;
+        if (this.props.error.hasOwnProperty('intl')) {
+            const {intl} = this.props.error;
             return (
                 <FormattedText
-                    id={error.id}
-                    defaultMessage={error.defaultMessage}
-                    values={error.values}
+                    id={intl.id}
+                    defaultMessage={intl.defaultMessage}
+                    values={intl.values}
                     style={GlobalStyles.errorLabel}
                 />
             );

app/styles/index.js

@@ -89,7 +89,8 @@ export const GlobalStyles = StyleSheet.create({
         color: 'red',
         marginTop: 15,
         marginBottom: 15,
-        fontSize: 12
+        fontSize: 12,
+        textAlign: 'center'
     },
 
     switchUp: {

assets/base/i18n/en.json

@@ -1521,6 +1521,7 @@
   "mobile.routes.thread": "{channelName} Thread",
   "mobile.routes.user_profile": "Profile",
   "mobile.routes.user_profile.send_message": "Send Message",
+  "mobile.server_ping_failed": "Cannot connect to the server. Please check your server URL and internet connection.",
   "more_channels.close": "Close",
   "more_channels.create": "Create New Channel",
   "more_channels.createClick": "Click 'Create New Channel' to make a new one",

service/actions/general.js

@@ -2,17 +2,33 @@
 // See License.txt for license information.
 
 import Client from 'service/client';
-import {bindClientFunc} from './helpers.js';
+import {bindClientFunc, FormattedError} from './helpers.js';
 import {GeneralTypes} from 'service/constants';
 import {getMyChannelMembers} from './channels';
 
 export function getPing() {
-    return bindClientFunc(
-        Client.getPing,
-        GeneralTypes.PING_REQUEST,
-        GeneralTypes.PING_SUCCESS,
-        GeneralTypes.PING_FAILURE
-    );
+    return async (dispatch, getState) => {
+        dispatch({type: GeneralTypes.PING_REQUEST}, getState);
+
+        let data;
+        const pingError = new FormattedError(
+            'mobile.server_ping_failed',
+            'Cannot connect to the server. Please check your server URL and internet connection.'
+        );
+        try {
+            data = await Client.getPing();
+            if (!data.version) {
+                // successful ping but not the right return data
+                dispatch({type: GeneralTypes.PING_FAILURE, error: pingError}, getState);
+                return;
+            }
+        } catch (error) {
+            dispatch({type: GeneralTypes.PING_FAILURE, error: pingError}, getState);
+            return;
+        }
+
+        dispatch({type: GeneralTypes.PING_SUCCESS, data}, getState);
+    };
 }
 
 export function getClientConfig() {

service/actions/helpers.js

@@ -88,3 +88,14 @@ export function debounce(func, wait, immediate, cb) {
         }
     };
 }
+
+export class FormattedError extends Error {
+    constructor(id, defaultMessage, values = {}) {
+        super(defaultMessage);
+        this.intl = {
+            id,
+            defaultMessage,
+            values
+        };
+    }
+}

service/reducers/requests/helpers.js

@@ -25,8 +25,9 @@ export function handleRequest(REQUEST, SUCCESS, FAILURE, state, action) {
         };
     case FAILURE: {
         let error = action.error;
+
         if (error instanceof Error) {
-            error = error.toString();
+            error = error.hasOwnProperty('intl') ? {...error} : error.toString();
         }
 
         return {