bigbuffet/bigbuffet-rw
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

VerificationBadge: use tsx, add className prop

Browse source
This commit is contained in:
Alex Gleason 2022-03-07 12:42:00 -06:00
parent 2c97aa8d11
commit e7ed56127f
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7
1 changed files with 9 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
app/soapbox/components/verification_badge.js → app/soapbox/components/verification_badge.tsx
View file

@ -1,3 +1,5 @@
import classNames from 'classnames';
import { Map as ImmutableMap } from 'immutable';
import React from 'react'; import React from 'react';
import { useIntl, defineMessages } from 'react-intl'; import { useIntl, defineMessages } from 'react-intl';
import { useSelector } from 'react-redux'; import { useSelector } from 'react-redux';
@ -8,11 +10,15 @@ const messages = defineMessages({
verified: { id: 'account.verified', defaultMessage: 'Verified Account' }, verified: { id: 'account.verified', defaultMessage: 'Verified Account' },
}); });
const VerificationBadge = () => { interface IVerificationBadge {
className?: string,
}
const VerificationBadge = ({ className }: IVerificationBadge) => {
const intl = useIntl(); const intl = useIntl();
// Prefer a custom icon if found // Prefer a custom icon if found
const customIcon = useSelector(state => state.getIn(['soapbox', 'verifiedIcon'])); const customIcon = useSelector((state: ImmutableMap<string, any>) => state.getIn(['soapbox', 'verifiedIcon']));
const icon = customIcon || require('icons/verified.svg'); const icon = customIcon || require('icons/verified.svg');
// Render component based on file extension // Render component based on file extension
@ -20,7 +26,7 @@ const VerificationBadge = () => {
return ( return (
<span className='verified-icon'> <span className='verified-icon'>
<Icon src={icon} alt={intl.formatMessage(messages.verified)} /> <Icon className={classNames(className)} src={icon} alt={intl.formatMessage(messages.verified)} />
</span> </span>
); );
}; };