Fix glitch-soc status media icons
This commit is contained in:
		
							parent
							
								
									731f01adb1
								
							
						
					
					
						commit
						46128f25b6
					
				| 
						 | 
					@ -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)}
 | 
				
			||||||
      />
 | 
					      />
 | 
				
			||||||
    );
 | 
					    );
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
		Reference in New Issue