Add API notice to users who run the app in dev mode

meetfranz · Oct 24, 2017 · 880da2d · 880da2d
1 parent f6ac322
commit 880da2d
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 0 deletions.
diff --git a/src/components/auth/Login.js b/src/components/auth/Login.js
@@ -3,11 +3,14 @@ import PropTypes from 'prop-types';
 import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
 
+import { isDevMode, useLiveAPI } from '../../environment';
 import Form from '../../lib/Form';
 import { required, email } from '../../helpers/validation-helpers';
 import Input from '../ui/Input';
 import Button from '../ui/Button';
 import Link from '../ui/Link';
+import Infobox from '../ui/Infobox';
+
 
 import { globalError as globalErrorPropType } from '../../prop-types';
 
@@ -117,6 +120,11 @@ export default class Login extends Component {
             alt=""
           />
           <h1>{intl.formatMessage(messages.headline)}</h1>
+          {isDevMode && !useLiveAPI && (
+            <Infobox type="warning">
+              In Dev Mode your data is not persistent. Please use the live app for accesing the production API.
+            </Infobox>
+          )}
           {isTokenExpired && (
             <p className="error-message center">{intl.formatMessage(messages.tokenExpired)}</p>
           )}

diff --git a/src/components/auth/Signup.js b/src/components/auth/Signup.js
@@ -3,12 +3,14 @@ import PropTypes from 'prop-types';
 import { observer } from 'mobx-react';
 import { defineMessages, intlShape } from 'react-intl';
 
+import { isDevMode, useLiveAPI } from '../../environment';
 import Form from '../../lib/Form';
 import { required, email, minLength } from '../../helpers/validation-helpers';
 import Input from '../ui/Input';
 import Radio from '../ui/Radio';
 import Button from '../ui/Button';
 import Link from '../ui/Link';
+import Infobox from '../ui/Infobox';
 
 import { globalError as globalErrorPropType } from '../../prop-types';
 
@@ -145,6 +147,11 @@ export default class Signup extends Component {
               alt=""
             />
             <h1>{intl.formatMessage(messages.headline)}</h1>
+            {isDevMode && !useLiveAPI && (
+              <Infobox type="warning">
+                In Dev Mode your data is not persistent. Please use the live app for accesing the production API.
+              </Infobox>
+            )}
             <Radio field={form.$('accountType')} showLabel={false} />
             <div className="grid__row">
               <Input field={form.$('firstname')} focus />