mattermost-mobile/app/components/user_status/user_status.tsx
Elias Nahum 1b36529853
MM-34407 Use Avatars for Sidebar DMs (#5334)
* MM-34407 Use Avatars for Sidebar DMs

* Update app/components/channel_icon.js

Co-authored-by: Joseph Baylon <joseph.baylon@mattermost.com>

* UI feedback

* Align the private channel icon

Co-authored-by: Joseph Baylon <joseph.baylon@mattermost.com>
2021-04-28 18:54:54 -04:00

54 lines
1.3 KiB
TypeScript

// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React from 'react';
import CompassIcon from '@components/compass_icon';
import {General} from '@mm-redux/constants';
import {changeOpacity} from '@utils/theme';
import type {Theme} from '@mm-redux/types/preferences';
type UserStatusProps = {
size: number;
status: string;
theme: Theme;
};
const UserStatus = ({size, status, theme}: UserStatusProps) => {
let iconName;
let iconColor;
switch (status) {
case General.AWAY:
iconName = 'clock';
iconColor = theme.awayIndicator;
break;
case General.DND:
iconName = 'minus-circle';
iconColor = theme.dndIndicator;
break;
case General.ONLINE:
iconName = 'check-circle';
iconColor = theme.onlineIndicator;
break;
default:
iconName = 'circle-outline';
iconColor = changeOpacity('#B8B8B8', 0.64);
break;
}
return (
<CompassIcon
name={iconName}
style={{fontSize: size, color: iconColor}}
testID={`user_status.icon.${status}`}
/>
);
};
UserStatus.defaultProps = {
size: 6,
status: General.OFFLINE,
};
export default UserStatus;