Fix glitch-soc status media icons
This commit is contained in:
parent
731f01adb1
commit
46128f25b6
1 changed files with 31 additions and 12 deletions
|
@ -9,6 +9,11 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
|
|||
import { ReactComponent as ExpandLessIcon } from '@material-symbols/svg-600/outlined/expand_less.svg';
|
||||
import { ReactComponent as ForumIcon } from '@material-symbols/svg-600/outlined/forum.svg';
|
||||
import { ReactComponent as HomeIcon } from '@material-symbols/svg-600/outlined/home.svg';
|
||||
import { ReactComponent as ImageIcon } from '@material-symbols/svg-600/outlined/image.svg';
|
||||
import { ReactComponent as InsertChartIcon } from '@material-symbols/svg-600/outlined/insert_chart.svg';
|
||||
import { ReactComponent as LinkIcon } from '@material-symbols/svg-600/outlined/link.svg';
|
||||
import { ReactComponent as MovieIcon } from '@material-symbols/svg-600/outlined/movie.svg';
|
||||
import { ReactComponent as MusicNoteIcon } from '@material-symbols/svg-600/outlined/music_note.svg';
|
||||
|
||||
import { Icon } from 'flavours/glitch/components/icon';
|
||||
import { languages } from 'flavours/glitch/initial_state';
|
||||
|
@ -66,29 +71,43 @@ class StatusIcons extends PureComponent {
|
|||
}
|
||||
};
|
||||
|
||||
mediaIconTitleText (mediaIcon) {
|
||||
renderIcon (mediaIcon) {
|
||||
const { intl } = this.props;
|
||||
|
||||
const message = {
|
||||
'link': messages.previewCard,
|
||||
'picture-o': messages.pictures,
|
||||
'tasks': messages.poll,
|
||||
'video-camera': messages.video,
|
||||
'music': messages.audio,
|
||||
}[mediaIcon];
|
||||
let title, iconComponent;
|
||||
|
||||
return message && intl.formatMessage(message);
|
||||
}
|
||||
switch (mediaIcon) {
|
||||
case 'link':
|
||||
title = messages.previewCard;
|
||||
iconComponent = LinkIcon;
|
||||
break;
|
||||
case 'picture-o':
|
||||
title = messages.pictures;
|
||||
iconComponent = ImageIcon;
|
||||
break;
|
||||
case 'tasks':
|
||||
title = messages.poll;
|
||||
iconComponent = InsertChartIcon;
|
||||
break;
|
||||
case 'video-camera':
|
||||
title = messages.video;
|
||||
iconComponent = MovieIcon;
|
||||
break;
|
||||
case 'music':
|
||||
title = messages.audio;
|
||||
iconComponent = MusicNoteIcon;
|
||||
break;
|
||||
}
|
||||
|
||||
renderIcon (mediaIcon) {
|
||||
return (
|
||||
<Icon
|
||||
fixedWidth
|
||||
className='status__media-icon'
|
||||
key={`media-icon--${mediaIcon}`}
|
||||
id={mediaIcon}
|
||||
icon={iconComponent}
|
||||
aria-hidden='true'
|
||||
title={this.mediaIconTitleText(mediaIcon)}
|
||||
title={title && intl.formatMessage(title)}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue