mastodon-glitch/app/javascript/mastodon/components/domain.tsx

48 lines
1.2 KiB
TypeScript
Raw Normal View History

2023-05-23 08:52:27 +00:00
import { useCallback } from 'react';
2023-05-31 21:43:39 +00:00
import { defineMessages, useIntl } from 'react-intl';
import LockOpenIcon from '@/material-icons/400-24px/lock_open.svg?react';
import { unblockDomain } from 'mastodon/actions/domain_blocks';
import { useAppDispatch } from 'mastodon/store';
import { IconButton } from './icon_button';
const messages = defineMessages({
unblockDomain: {
id: 'account.unblock_domain',
defaultMessage: 'Unblock domain {domain}',
},
});
export const Domain: React.FC<{
domain: string;
}> = ({ domain }) => {
2023-05-31 21:43:39 +00:00
const intl = useIntl();
const dispatch = useAppDispatch();
2023-05-31 21:43:39 +00:00
const handleDomainUnblock = useCallback(() => {
dispatch(unblockDomain(domain));
}, [dispatch, domain]);
return (
<div className='domain'>
<div className='domain__wrapper'>
<span className='domain__domain-name'>
<strong>{domain}</strong>
</span>
<div className='domain__buttons'>
<IconButton
active
icon='unlock'
iconComponent={LockOpenIcon}
title={intl.formatMessage(messages.unblockDomain, { domain })}
onClick={handleDomainUnblock}
/>
</div>
</div>
</div>
);
};