diff --git a/app/components/error_text/__snapshots__/error_text.test.js.snap b/app/components/error_text/__snapshots__/error_text.test.js.snap
new file mode 100644
index 000000000..20e2c68f9
--- /dev/null
+++ b/app/components/error_text/__snapshots__/error_text.test.js.snap
@@ -0,0 +1,26 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ErrorText should match snapshot 1`] = `
+
+ Username must begin with a letter and contain between 3 and 22 characters including numbers, lowercase letters, and the symbols
+
+`;
diff --git a/app/components/error_text.js b/app/components/error_text/error_text.js
similarity index 82%
rename from app/components/error_text.js
rename to app/components/error_text/error_text.js
index 50976b35e..3968265f1 100644
--- a/app/components/error_text.js
+++ b/app/components/error_text/error_text.js
@@ -1,18 +1,16 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
-import {connect} from 'react-redux';
import React, {PureComponent} from 'react';
import PropTypes from 'prop-types';
import {Text} from 'react-native';
import CustomPropTypes from 'app/constants/custom_prop_types';
import FormattedText from 'app/components/formatted_text';
-import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
import {GlobalStyles} from 'app/styles';
import {makeStyleSheetFromTheme} from 'app/utils/theme';
-class ErrorText extends PureComponent {
+export default class ErrorText extends PureComponent {
static propTypes = {
error: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
textStyle: CustomPropTypes.Style,
@@ -54,12 +52,3 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
},
};
});
-
-function mapStateToProps(state, ownProps) {
- return {
- ...ownProps,
- theme: getTheme(state),
- };
-}
-
-export default connect(mapStateToProps)(ErrorText);
diff --git a/app/components/error_text/error_text.test.js b/app/components/error_text/error_text.test.js
new file mode 100644
index 000000000..6c85f56b8
--- /dev/null
+++ b/app/components/error_text/error_text.test.js
@@ -0,0 +1,29 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import React from 'react';
+import {shallow} from 'enzyme';
+import Preferences from 'mattermost-redux/constants/preferences';
+
+import ErrorText from './error_text.js';
+
+describe('ErrorText', () => {
+ const baseProps = {
+ textStyle: {
+ fontSize: 14,
+ marginHorizontal: 15,
+ },
+ theme: Preferences.THEMES.default,
+ error: {
+ message: 'Username must begin with a letter and contain between 3 and 22 characters including numbers, lowercase letters, and the symbols',
+ },
+ };
+
+ test('should match snapshot', () => {
+ const wrapper = shallow(
+ ,
+ );
+
+ expect(wrapper.getElement()).toMatchSnapshot();
+ });
+});
diff --git a/app/components/error_text/index.js b/app/components/error_text/index.js
new file mode 100644
index 000000000..ba5888b96
--- /dev/null
+++ b/app/components/error_text/index.js
@@ -0,0 +1,15 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import {connect} from 'react-redux';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
+
+import ErrorText from './error_text.js';
+
+function mapStateToProps(state) {
+ return {
+ theme: getTheme(state),
+ };
+}
+
+export default connect(mapStateToProps)(ErrorText);
diff --git a/app/screens/edit_profile/edit_profile.js b/app/screens/edit_profile/edit_profile.js
index 38879ee28..ff40c1e3c 100644
--- a/app/screens/edit_profile/edit_profile.js
+++ b/app/screens/edit_profile/edit_profile.js
@@ -550,6 +550,7 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
},
errorText: {
fontSize: 14,
+ marginHorizontal: 15,
},
separator: {
height: 15,
@@ -560,4 +561,3 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
},
};
});
-