mattermost-mobile/app/components/user_status/user_status.js
Elias Nahum 19e6b2a00e
[MM-18362] Sidebar improvements (#3223)
* sidebar lists displays past bottom safe area insets

* Sidebar animation speed

* Sidebar improvements

* Add status icons and avatars to mattermost font

* Bot icon the same size as other channel icons

* improvements to the channel badge

* Badge color and border

* More precision when showing more unread above

* Improve GM icon

* Fix badge on team sidebar

* Align channel sidebar badges

* alignments

* Fix tests

* Remove unnecessary isLandscape in main sidebar connector
2019-09-16 13:17:48 -03:00

62 lines
1.5 KiB
JavaScript

// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React, {PureComponent} from 'react';
import PropTypes from 'prop-types';
import {General} from 'mattermost-redux/constants';
import Icon from 'app/components/vector_icon';
import {changeOpacity} from 'app/utils/theme';
const statusToIcon = {
away: General.AWAY,
dnd: General.DND,
offline: General.OFFLINE,
ooo: General.OFFLINE,
online: General.ONLINE,
};
export default class UserStatus extends PureComponent {
static propTypes = {
isAvatar: PropTypes.bool,
size: PropTypes.number,
status: PropTypes.string,
theme: PropTypes.object.isRequired,
};
static defaultProps = {
size: 6,
status: General.OFFLINE,
};
render() {
const {size, status, theme} = this.props;
const iconName = statusToIcon[status];
let iconColor;
switch (status) {
case General.AWAY:
iconColor = theme.awayIndicator;
break;
case General.DND:
iconColor = theme.dndIndicator;
break;
case General.ONLINE:
iconColor = theme.onlineIndicator;
break;
default:
iconColor = changeOpacity(theme.centerChannelColor, 0.3);
break;
}
return (
<Icon
name={iconName}
style={{fontSize: size, color: iconColor}}
type='mattermost'
/>
);
}
}