diff --git a/app/components/user_status/__snapshots__/user_status.test.js.snap b/app/components/user_status/__snapshots__/user_status.test.js.snap
new file mode 100644
index 000000000..0f3fdf55b
--- /dev/null
+++ b/app/components/user_status/__snapshots__/user_status.test.js.snap
@@ -0,0 +1,69 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`UserStatus should match snapshot, away status 1`] = `
+
+`;
+
+exports[`UserStatus should match snapshot, dnd status 1`] = `
+
+`;
+
+exports[`UserStatus should match snapshot, online status 1`] = `
+
+`;
+
+exports[`UserStatus should match snapshot, should default to offline status 1`] = `
+
+`;
diff --git a/app/components/user_status/user_status.js b/app/components/user_status/user_status.js
index 8666d96a1..9e2f1511c 100644
--- a/app/components/user_status/user_status.js
+++ b/app/components/user_status/user_status.js
@@ -6,6 +6,9 @@ import {Image} from 'react-native';
import PropTypes from 'prop-types';
import {General} from 'mattermost-redux/constants';
+
+import {changeOpacity} from 'app/utils/theme';
+
import away from 'assets/images/status/away.png';
import dnd from 'assets/images/status/dnd.png';
import offline from 'assets/images/status/offline.png';
@@ -47,7 +50,7 @@ export default class UserStatus extends PureComponent {
iconColor = theme.onlineIndicator;
break;
default:
- iconColor = theme.centerChannelColor;
+ iconColor = changeOpacity(theme.centerChannelColor, 0.3);
break;
}
diff --git a/app/components/user_status/user_status.test.js b/app/components/user_status/user_status.test.js
new file mode 100644
index 000000000..4e9c06fae
--- /dev/null
+++ b/app/components/user_status/user_status.test.js
@@ -0,0 +1,58 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import React from 'react';
+import {shallow} from 'enzyme';
+
+import {General} from 'mattermost-redux/constants';
+import Preferences from 'mattermost-redux/constants/preferences';
+
+import UserStatus from './user_status';
+
+describe('UserStatus', () => {
+ const baseProps = {
+ size: 32,
+ theme: Preferences.THEMES.default,
+ };
+
+ test('should match snapshot, should default to offline status', () => {
+ const wrapper = shallow(
+
+ );
+
+ expect(wrapper.getElement()).toMatchSnapshot();
+ });
+
+ test('should match snapshot, away status', () => {
+ const wrapper = shallow(
+
+ );
+
+ expect(wrapper.getElement()).toMatchSnapshot();
+ });
+
+ test('should match snapshot, dnd status', () => {
+ const wrapper = shallow(
+
+ );
+
+ expect(wrapper.getElement()).toMatchSnapshot();
+ });
+
+ test('should match snapshot, online status', () => {
+ const wrapper = shallow(
+
+ );
+
+ expect(wrapper.getElement()).toMatchSnapshot();
+ });
+});