Fix glitch-soc status media icons

This commit is contained in:
Claire 2024-01-13 23:35:53 +01:00
parent 731f01adb1
commit 46128f25b6

View File

@ -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 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 ForumIcon } from '@material-symbols/svg-600/outlined/forum.svg';
import { ReactComponent as HomeIcon } from '@material-symbols/svg-600/outlined/home.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 { Icon } from 'flavours/glitch/components/icon';
import { languages } from 'flavours/glitch/initial_state'; import { languages } from 'flavours/glitch/initial_state';
@ -66,29 +71,43 @@ class StatusIcons extends PureComponent {
} }
}; };
mediaIconTitleText (mediaIcon) { renderIcon (mediaIcon) {
const { intl } = this.props; const { intl } = this.props;
const message = { let title, iconComponent;
'link': messages.previewCard,
'picture-o': messages.pictures,
'tasks': messages.poll,
'video-camera': messages.video,
'music': messages.audio,
}[mediaIcon];
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 ( return (
<Icon <Icon
fixedWidth fixedWidth
className='status__media-icon' className='status__media-icon'
key={`media-icon--${mediaIcon}`} key={`media-icon--${mediaIcon}`}
id={mediaIcon} id={mediaIcon}
icon={iconComponent}
aria-hidden='true' aria-hidden='true'
title={this.mediaIconTitleText(mediaIcon)} title={title && intl.formatMessage(title)}
/> />
); );
} }