Remove old avatar variants of status icons (#31768)
These predate the "circle with a check"-style status indicators we've used for years now.
Этот коммит содержится в:
Harrison Healey
коммит произвёл
GitHub
GitHub
родитель
a3f60f797b
Коммит
ebb68759ad
@@ -3,27 +3,21 @@
|
||||
|
||||
import React, {memo} from 'react';
|
||||
|
||||
import StatusAwayAvatarIcon from 'components/widgets/icons/status_away_avatar_icon';
|
||||
import StatusAwayIcon from 'components/widgets/icons/status_away_icon';
|
||||
import StatusDndAvatarIcon from 'components/widgets/icons/status_dnd_avatar_icon';
|
||||
import StatusDndIcon from 'components/widgets/icons/status_dnd_icon';
|
||||
import StatusOfflineAvatarIcon from 'components/widgets/icons/status_offline_avatar_icon';
|
||||
import StatusOfflineIcon from 'components/widgets/icons/status_offline_icon';
|
||||
import StatusOnlineAvatarIcon from 'components/widgets/icons/status_online_avatar_icon';
|
||||
import StatusOnlineIcon from 'components/widgets/icons/status_online_icon';
|
||||
|
||||
type Props = {
|
||||
button?: boolean;
|
||||
status?: string;
|
||||
className?: string;
|
||||
type?: string;
|
||||
}
|
||||
|
||||
const StatusIcon = ({
|
||||
className = '',
|
||||
button = false,
|
||||
status,
|
||||
type,
|
||||
}: Props) => {
|
||||
if (!status) {
|
||||
return null;
|
||||
@@ -35,16 +29,7 @@ const StatusIcon = ({
|
||||
iconClassName = className || '';
|
||||
}
|
||||
|
||||
if (type === 'avatar') {
|
||||
if (status === 'online') {
|
||||
return <StatusOnlineAvatarIcon className={iconClassName}/>;
|
||||
} else if (status === 'away') {
|
||||
return <StatusAwayAvatarIcon className={iconClassName}/>;
|
||||
} else if (status === 'dnd') {
|
||||
return <StatusDndAvatarIcon className={iconClassName}/>;
|
||||
}
|
||||
return <StatusOfflineAvatarIcon className={iconClassName}/>;
|
||||
} else if (status === 'online') {
|
||||
if (status === 'online') {
|
||||
return <StatusOnlineIcon className={iconClassName}/>;
|
||||
} else if (status === 'away') {
|
||||
return <StatusAwayIcon className={iconClassName}/>;
|
||||
|
||||
@@ -1,34 +0,0 @@
|
||||
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
||||
// See LICENSE.txt for license information.
|
||||
|
||||
import React from 'react';
|
||||
import type {CSSProperties} from 'react';
|
||||
import {useIntl} from 'react-intl';
|
||||
|
||||
export default function StatusAwayAvatarIcon(props: React.HTMLAttributes<HTMLSpanElement>) {
|
||||
const {formatMessage} = useIntl();
|
||||
return (
|
||||
<span {...props}>
|
||||
<svg
|
||||
width='13px'
|
||||
height='13px'
|
||||
viewBox='0 0 12 12'
|
||||
style={style}
|
||||
role='img'
|
||||
aria-label={formatMessage({id: 'mobile.set_status.away.icon', defaultMessage: 'Away Icon'})}
|
||||
>
|
||||
<path
|
||||
className='away--icon'
|
||||
d='M9.081,5.712C9.267,5.712 9.417,5.863 9.417,6.048L9.417,9.086L11.864,10.499C12.025,10.592 12.08,10.797 11.987,10.958L11.482,11.832C11.39,11.993 11.184,12.048 11.023,11.955L7.904,10.154C7.788,10.087 7.727,9.961 7.737,9.836C7.736,9.827 7.736,9.818 7.736,9.809L7.736,6.048C7.736,5.863 7.886,5.712 8.072,5.712L9.081,5.712ZM4.812,11.513L4.605,11.513C2.325,11.41 0.253,10.374 0.046,9.027C-0.058,8.923 0.046,8.509 0.046,8.405C0.15,7.576 0.357,6.437 0.771,5.815C0.978,5.401 2.015,5.297 2.015,5.297C2.015,5.297 2.015,7.369 4.605,7.369L5.019,7.369C4.915,7.784 4.812,8.198 4.812,8.612C4.812,9.648 5.226,10.581 5.848,11.41C5.537,11.513 5.123,11.513 4.812,11.513ZM4.605,0.117C6.034,0.117 7.195,1.277 7.195,2.707C7.195,4.136 6.034,5.297 4.605,5.297C3.175,5.297 2.015,4.136 2.015,2.707C2.015,1.277 3.175,0.117 4.605,0.117Z'
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
);
|
||||
}
|
||||
|
||||
const style: CSSProperties = {
|
||||
fillRule: 'evenodd',
|
||||
clipRule: 'evenodd',
|
||||
strokeLinejoin: 'round',
|
||||
strokeMiterlimit: 1.41421,
|
||||
};
|
||||
@@ -1,41 +0,0 @@
|
||||
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
||||
// See LICENSE.txt for license information.
|
||||
|
||||
import React from 'react';
|
||||
import {useIntl} from 'react-intl';
|
||||
|
||||
export default function StatusDndAvatarIcon(props: React.HTMLAttributes<HTMLSpanElement>) {
|
||||
const {formatMessage} = useIntl();
|
||||
return (
|
||||
<span {...props}>
|
||||
<svg
|
||||
x='0px'
|
||||
y='0px'
|
||||
width='13px'
|
||||
height='13px'
|
||||
viewBox='-299 391 12 12'
|
||||
enableBackground='new -299 391 12 12'
|
||||
role='img'
|
||||
aria-label={formatMessage({id: 'mobile.set_status.dnd.icon', defaultMessage: 'Do Not Disturb Icon'})}
|
||||
>
|
||||
<g>
|
||||
<ellipse
|
||||
className='dnd--icon'
|
||||
cx='-294.6'
|
||||
cy='394'
|
||||
rx='2.5'
|
||||
ry='2.5'
|
||||
/>
|
||||
<path
|
||||
className='dnd--icon'
|
||||
d='M-293.8,399.4c0-0.4,0.1-0.7,0.2-1c-0.3,0.1-0.6,0.2-1,0.2c-2.5,0-2.5-2-2.5-2s-1,0.1-1.2,0.5c-0.4,0.6-0.6,1.7-0.7,2.5 c0,0.1-0.1,0.5,0,0.6c0.2,1.3,2.2,2.3,4.4,2.4c0,0,0.1,0,0.1,0c0,0,0.1,0,0.1,0c0.7,0,1.4-0.1,2-0.3 C-293.3,401.5-293.8,400.5-293.8,399.4z'
|
||||
/>
|
||||
</g>
|
||||
<path
|
||||
className='dnd--icon'
|
||||
d='M-287,400c0,0.1-0.1,0.1-0.1,0.1l-4.9,0c-0.1,0-0.1-0.1-0.1-0.1v-1.6c0-0.1,0.1-0.1,0.1-0.1l4.9,0c0.1,0,0.1,0.1,0.1,0.1 V400z'
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
);
|
||||
}
|
||||
@@ -1,45 +0,0 @@
|
||||
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
||||
// See LICENSE.txt for license information.
|
||||
|
||||
import React from 'react';
|
||||
import {useIntl} from 'react-intl';
|
||||
|
||||
export default function StatusOfflineAvatarIcon(props: React.HTMLAttributes<HTMLSpanElement>) {
|
||||
const {formatMessage} = useIntl();
|
||||
return (
|
||||
<span {...props}>
|
||||
<svg
|
||||
x='0px'
|
||||
y='0px'
|
||||
width='13px'
|
||||
height='13px'
|
||||
viewBox='-299 391 12 12'
|
||||
enableBackground='new -299 391 12 12'
|
||||
role='img'
|
||||
aria-label={formatMessage({id: 'mobile.set_status.offline.icon', defaultMessage: 'Offline Icon'})}
|
||||
>
|
||||
<g>
|
||||
<g>
|
||||
<ellipse
|
||||
className='offline--icon'
|
||||
cx='-294.5'
|
||||
cy='394'
|
||||
rx='2.5'
|
||||
ry='2.5'
|
||||
/>
|
||||
<path
|
||||
className='offline--icon'
|
||||
d='M-294.3,399.7c0-0.4,0.1-0.8,0.2-1.2c-0.1,0-0.2,0-0.4,0c-2.5,0-2.5-2-2.5-2s-1,0.1-1.2,0.5c-0.4,0.6-0.6,1.7-0.7,2.5 c0,0.1-0.1,0.5,0,0.6c0.2,1.3,2.2,2.3,4.4,2.4h0.1h0.1c0.3,0,0.7,0,1-0.1C-293.9,401.6-294.3,400.7-294.3,399.7z'
|
||||
/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<path
|
||||
className='offline--icon'
|
||||
d='M-288.9,399.4l1.8-1.8c0.1-0.1,0.1-0.3,0-0.3l-0.7-0.7c-0.1-0.1-0.3-0.1-0.3,0l-1.8,1.8l-1.8-1.8c-0.1-0.1-0.3-0.1-0.3,0 l-0.7,0.7c-0.1,0.1-0.1,0.3,0,0.3l1.8,1.8l-1.8,1.8c-0.1,0.1-0.1,0.3,0,0.3l0.7,0.7c0.1,0.1,0.3,0.1,0.3,0l1.8-1.8l1.8,1.8 c0.1,0.1,0.3,0.1,0.3,0l0.7-0.7c0.1-0.1,0.1-0.3,0-0.3L-288.9,399.4z'
|
||||
/>
|
||||
</g>
|
||||
</svg>
|
||||
</span>
|
||||
);
|
||||
}
|
||||
@@ -1,49 +0,0 @@
|
||||
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
||||
// See LICENSE.txt for license information.
|
||||
|
||||
import React from 'react';
|
||||
import {useIntl} from 'react-intl';
|
||||
|
||||
export default function StatusOnlineAvatarIcon(props: React.HTMLAttributes<HTMLSpanElement>) {
|
||||
const {formatMessage} = useIntl();
|
||||
return (
|
||||
<span {...props}>
|
||||
<svg
|
||||
x='0px'
|
||||
y='0px'
|
||||
width='13px'
|
||||
height='13px'
|
||||
viewBox='-243 245 12 12'
|
||||
enableBackground='new -243 245 12 12'
|
||||
role='img'
|
||||
aria-label={formatMessage({id: 'mobile.set_status.online.icon', defaultMessage: 'Online Icon'})}
|
||||
>
|
||||
<g>
|
||||
<path
|
||||
className='online--icon'
|
||||
d='M-236,250.5C-236,250.5-236,250.5-236,250.5C-236,250.5-236,250.5-236,250.5C-236,250.5-236,250.5-236,250.5z'
|
||||
/>
|
||||
<ellipse
|
||||
className='online--icon'
|
||||
cx='-238.5'
|
||||
cy='248'
|
||||
rx='2.5'
|
||||
ry='2.5'
|
||||
/>
|
||||
</g>
|
||||
<path
|
||||
className='online--icon'
|
||||
d='M-238.9,253.8c0-0.4,0.1-0.9,0.2-1.3c-2.2-0.2-2.2-2-2.2-2s-1,0.1-1.2,0.5c-0.4,0.6-0.6,1.7-0.7,2.5c0,0.1-0.1,0.5,0,0.6 c0.2,1.3,2.2,2.3,4.4,2.4c0,0,0.1,0,0.1,0c0,0,0.1,0,0.1,0c0,0,0.1,0,0.1,0C-238.7,255.7-238.9,254.8-238.9,253.8z'
|
||||
/>
|
||||
<g>
|
||||
<g>
|
||||
<path
|
||||
className='online--icon'
|
||||
d='M-232.3,250.1l1.3,1.3c0,0,0,0.1,0,0.1l-4.1,4.1c0,0,0,0-0.1,0c0,0,0,0,0,0l-2.7-2.7c0,0,0-0.1,0-0.1l1.2-1.2 c0,0,0.1,0,0.1,0l1.4,1.4l2.9-2.9C-232.4,250.1-232.3,250.1-232.3,250.1z'
|
||||
/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
</span>
|
||||
);
|
||||
}
|
||||
Ссылка в новой задаче
Block a user