[Glitch] Add fallback to domain block confirmation modal

Port 7a62d57427 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
This commit is contained in:
Claire 2024-09-26 14:47:56 +02:00
parent 7b290cee47
commit 8439084587

View file

@ -30,9 +30,9 @@ export const DomainBlockModal: React.FC<{
}> = ({ domain, accountId, acct }) => { }> = ({ domain, accountId, acct }) => {
const dispatch = useAppDispatch(); const dispatch = useAppDispatch();
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const [preview, setPreview] = useState<DomainBlockPreviewResponse | null>( const [preview, setPreview] = useState<
null, DomainBlockPreviewResponse | 'error' | null
); >(null);
const handleClick = useCallback(() => { const handleClick = useCallback(() => {
if (loading) { if (loading) {
@ -65,6 +65,7 @@ export const DomainBlockModal: React.FC<{
return ''; return '';
}) })
.catch(() => { .catch(() => {
setPreview('error');
setLoading(false); setLoading(false);
}); });
}, [setPreview, setLoading, domain]); }, [setPreview, setLoading, domain]);
@ -89,7 +90,9 @@ export const DomainBlockModal: React.FC<{
</div> </div>
<div className='safety-action-modal__bullet-points'> <div className='safety-action-modal__bullet-points'>
{preview && preview.followers_count + preview.following_count > 0 && ( {preview &&
preview !== 'error' &&
preview.followers_count + preview.following_count > 0 && (
<div> <div>
<div className='safety-action-modal__bullet-points__icon'> <div className='safety-action-modal__bullet-points__icon'>
<Icon id='' icon={PersonRemoveIcon} /> <Icon id='' icon={PersonRemoveIcon} />
@ -115,6 +118,22 @@ export const DomainBlockModal: React.FC<{
</div> </div>
)} )}
{preview === 'error' && (
<div>
<div className='safety-action-modal__bullet-points__icon'>
<Icon id='' icon={PersonRemoveIcon} />
</div>
<div>
<strong>
<FormattedMessage
id='domain_block_modal.you_will_lose_relationships'
defaultMessage='You will lose all followers and people you follow from this server.'
/>
</strong>
</div>
</div>
)}
<div className='safety-action-modal__bullet-points--deemphasized'> <div className='safety-action-modal__bullet-points--deemphasized'>
<div className='safety-action-modal__bullet-points__icon'> <div className='safety-action-modal__bullet-points__icon'>
<Icon id='' icon={CampaignIcon} /> <Icon id='' icon={CampaignIcon} />