Formatting the banner text correctly

app/components/topbar/banners/ServerErrorBanner.js

@@ -1,23 +1,22 @@
 // @flow
 import React, { Component } from 'react';
 import { observer } from 'mobx-react';
-import { intlShape, defineMessages, FormattedMessage } from 'react-intl';
+import { intlShape, defineMessages, FormattedHTMLMessage } from 'react-intl';
 import SvgInline from 'react-svg-inline';
 import globalMessages from '../../../i18n/global-messages';
 import { handleExternalLinkClick } from '../../../utils/routing';
 import styles from './ServerErrorBanner.scss';
-import environment from '../../../environment';
 import warningSvg from '../../../assets/images/warning.inline.svg';
 import type { ServerStatusErrorType } from '../../../types/serverStatusErrorType';
 
 const messages = defineMessages({
   serverErrorLabel: {
     id: 'serverError.label.message',
-    defaultMessage: '!!!WARNING: Connection to the server failed. Please check our Twitter account {twitterLink}',
+    defaultMessage: '!!!WARNING: Connection to the server failed. Please check our Twitter account {twitterLink}. Your funds are safe (SAFU), you can check them in any block explorer.',
   },
   networkErrorLabel: {
     id: 'networkError.label.message',
-    defaultMessage: '!!!WARNING: Connection to the server failed. Please check your internet connection or our Twitter account {twitterLink}',
+    defaultMessage: '!!!WARNING: Connection to the server failed. Please check your internet connection or our Twitter account {twitterLink}. Your funds are safe (SAFU), you can check them in any block explorer.',
   },
 });
 
@@ -64,11 +63,7 @@ export default class ServerErrorBanner extends Component<Props> {
         {displayMessage === null ? null : (
           <div className={styles.serverError}>
             <SvgInline key="0" svg={warningSvg} className={styles.warningIcon} />
-            <FormattedMessage
-              {...displayMessage}
-              values={{ twitterLink, network: environment.NETWORK }}
-              key="1"
-            />
+            <FormattedHTMLMessage {...displayMessage} values={{ twitterLink }} key="1" />
           </div>)
         }
       </div>

app/i18n/locales/en-US.json

@@ -187,6 +187,8 @@
   "settings.support.reportProblem.content": "If the FAQ does not solve the issue you are experiencing, please use our {supportRequestLink} feature.",
   "settings.support.reportProblem.link": "Support request",
   "settings.support.reportProblem.title": "Reporting a problem",
+  "serverError.label.message": "WARNING: Connection to the server failed.<br>Please check our Twitter account {twitterLink}.<br>Your funds are safe (SAFU), you can check them in any block explorer.",
+  "networkError.label.message": "WARNING: Connection to the server failed.<br>Please check your internet connection or our Twitter account {twitterLink}.<br>Your funds are safe (SAFU), you can check them in any block explorer.",
   "testnet.label.message": "WARNING: This is a {network} network. ADA has no monetary value here. For more information, check out the FAQ at {faqLink}",
   "transfer.form.errors.invalidRecoveryPhrase": "Invalid recovery phrase",
   "transfer.form.instructions.step1.text": "It will take about 1 minute to restore your balance. In the next step, you will be presented with a transaction that will move all of your funds. Please review the details of the transaction carefully. You will need to pay a standard transaction fee on the Cardano network to make the transaction.",