tarrien/Mastodon
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update block dialog copy to include quotes & collections (#38897)

Browse Source
This commit is contained in:
diondiondion 2026-05-04 17:22:24 +02:00 committed by GitHub
parent ee88da4511
commit a23b3c7c25
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
6 changed files with 66 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
app/javascript/mastodon/features/ui/components/block_modal.jsx
View File

@ -10,12 +10,14 @@ import { useDispatch } from 'react-redux';
import AlternateEmailIcon from '@/material-icons/400-24px/alternate_email.svg?react'; import AlternateEmailIcon from '@/material-icons/400-24px/alternate_email.svg?react';
import BlockIcon from '@/material-icons/400-24px/block.svg?react'; import BlockIcon from '@/material-icons/400-24px/block.svg?react';
import CampaignIcon from '@/material-icons/400-24px/campaign.svg?react'; import CampaignIcon from '@/material-icons/400-24px/campaign.svg?react';
import CollectionsIcon from '@/material-icons/400-24px/category.svg?react';
import ReplyIcon from '@/material-icons/400-24px/reply.svg?react'; import ReplyIcon from '@/material-icons/400-24px/reply.svg?react';
import VisibilityOffIcon from '@/material-icons/400-24px/visibility_off.svg?react'; import VisibilityOffIcon from '@/material-icons/400-24px/visibility_off.svg?react';
import { blockAccount } from 'mastodon/actions/accounts'; import { blockAccount } from 'mastodon/actions/accounts';
import { closeModal } from 'mastodon/actions/modal'; import { closeModal } from 'mastodon/actions/modal';
import { Button } from 'mastodon/components/button'; import { Button } from 'mastodon/components/button';
import { Icon } from 'mastodon/components/icon'; import { Icon } from 'mastodon/components/icon';
import { areCollectionsEnabled } from '../../collections/utils';
export const BlockModal = ({ accountId, acct }) => { export const BlockModal = ({ accountId, acct }) => {
const dispatch = useDispatch(); const dispatch = useDispatch();
@ -46,31 +48,38 @@ export const BlockModal = ({ accountId, acct }) => {
<div> <div>
<h1><FormattedMessage id='block_modal.title' defaultMessage='Block user?' /></h1> <h1><FormattedMessage id='block_modal.title' defaultMessage='Block user?' /></h1>
<div>@{acct}</div> <p>@{acct}</p>
</div> </div>
</div> </div>
<div className='safety-action-modal__bullet-points'> <ul className='safety-action-modal__bullet-points'>
<div> <li>
<div className='safety-action-modal__bullet-points__icon'><Icon icon={CampaignIcon} /></div> <div className='safety-action-modal__bullet-points__icon'><Icon icon={CampaignIcon} /></div>
<div><FormattedMessage id='block_modal.they_will_know' defaultMessage="They can see that they're blocked." /></div> <div><FormattedMessage id='block_modal.they_will_know' defaultMessage="They can see that they're blocked." /></div>
</div> </li>
<div> <li>
<div className='safety-action-modal__bullet-points__icon'><Icon icon={VisibilityOffIcon} /></div> <div className='safety-action-modal__bullet-points__icon'><Icon icon={VisibilityOffIcon} /></div>
<div><FormattedMessage id='block_modal.they_cant_see_posts' defaultMessage="They can't see your posts and you won't see theirs." /></div> <div><FormattedMessage id='block_modal.they_cant_see_posts' defaultMessage="They can't see your content and you won't see theirs." /></div>
</div> </li>
<div> <li>
<div className='safety-action-modal__bullet-points__icon'><Icon icon={AlternateEmailIcon} /></div> <div className='safety-action-modal__bullet-points__icon'><Icon icon={AlternateEmailIcon} /></div>
<div><FormattedMessage id='block_modal.you_wont_see_mentions' defaultMessage="You won't see posts that mentions them." /></div> <div><FormattedMessage id='block_modal.you_wont_see_mentions' defaultMessage="You won't see posts from others that mention them." /></div>
</div> </li>
<div> <li>
<div className='safety-action-modal__bullet-points__icon'><Icon icon={ReplyIcon} /></div> <div className='safety-action-modal__bullet-points__icon'><Icon icon={ReplyIcon} /></div>
<div><FormattedMessage id='block_modal.they_cant_mention' defaultMessage="They can't mention or follow you." /></div> <div><FormattedMessage id='block_modal.they_cant_mention' defaultMessage="You can't mention, follow, or quote each other." /></div>
</div> </li>
</div>
{areCollectionsEnabled() &&
<li>
<div className='safety-action-modal__bullet-points__icon'><Icon icon={CollectionsIcon} /></div>
<div><FormattedMessage id='block_modal.no_collections' defaultMessage="Neither of you can add each other to collections. You'll be automatically removed from each others' existing collections, if applicable." /></div>
</li>
}
</ul>
</div> </div>
<div className={classNames('safety-action-modal__bottom', { active: expanded })}> <div className={classNames('safety-action-modal__bottom', { active: expanded })}>

30
app/javascript/mastodon/features/ui/components/domain_block_modal.tsx
View File

@ -83,15 +83,15 @@ export const DomainBlockModal: React.FC<{
defaultMessage='Block domain?' defaultMessage='Block domain?'
/> />
</h1> </h1>
<div>{domain}</div> <p>{domain}</p>
</div> </div>
</div> </div>
<div className='safety-action-modal__bullet-points'> <ul className='safety-action-modal__bullet-points'>
{preview && {preview &&
preview !== 'error' && preview !== 'error' &&
preview.followers_count + preview.following_count > 0 && ( preview.followers_count + preview.following_count > 0 && (
<div> <li>
<div className='safety-action-modal__bullet-points__icon'> <div className='safety-action-modal__bullet-points__icon'>
<Icon id='' icon={PersonRemoveIcon} /> <Icon id='' icon={PersonRemoveIcon} />
</div> </div>
@ -113,11 +113,11 @@ export const DomainBlockModal: React.FC<{
/> />
</strong> </strong>
</div> </div>
</div> </li>
)} )}
{preview === 'error' && ( {preview === 'error' && (
<div> <li>
<div className='safety-action-modal__bullet-points__icon'> <div className='safety-action-modal__bullet-points__icon'>
<Icon id='' icon={PersonRemoveIcon} /> <Icon id='' icon={PersonRemoveIcon} />
</div> </div>
@ -129,10 +129,10 @@ export const DomainBlockModal: React.FC<{
/> />
</strong> </strong>
</div> </div>
</div> </li>
)} )}
<div className='safety-action-modal__bullet-points--deemphasized'> <li 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} />
</div> </div>
@ -142,9 +142,9 @@ export const DomainBlockModal: React.FC<{
defaultMessage="They won't know they've been blocked." defaultMessage="They won't know they've been blocked."
/> />
</div> </div>
</div> </li>
<div className='safety-action-modal__bullet-points--deemphasized'> <li 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={VisibilityOffIcon} /> <Icon id='' icon={VisibilityOffIcon} />
</div> </div>
@ -154,9 +154,9 @@ export const DomainBlockModal: React.FC<{
defaultMessage="You won't see posts or notifications from users on this server." defaultMessage="You won't see posts or notifications from users on this server."
/> />
</div> </div>
</div> </li>
<div className='safety-action-modal__bullet-points--deemphasized'> <li 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={ReplyIcon} /> <Icon id='' icon={ReplyIcon} />
</div> </div>
@ -166,9 +166,9 @@ export const DomainBlockModal: React.FC<{
defaultMessage='Nobody from this server can follow you.' defaultMessage='Nobody from this server can follow you.'
/> />
</div> </div>
</div> </li>
<div className='safety-action-modal__bullet-points--deemphasized'> <li 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={HistoryIcon} /> <Icon id='' icon={HistoryIcon} />
</div> </div>
@ -178,8 +178,8 @@ export const DomainBlockModal: React.FC<{
defaultMessage='People from this server can interact with your old posts.' defaultMessage='People from this server can interact with your old posts.'
/> />
</div> </div>
</div> </li>
</div> </ul>
</div> </div>
<div className='safety-action-modal__bottom'> <div className='safety-action-modal__bottom'>

16
app/javascript/mastodon/features/ui/components/ignore_notifications_modal.jsx
View File

@ -57,22 +57,22 @@ export const IgnoreNotificationsModal = ({ filterType }) => {
<h1>{title}</h1> <h1>{title}</h1>
</div> </div>
<div className='safety-action-modal__bullet-points'> <ul className='safety-action-modal__bullet-points'>
<div> <li>
<div className='safety-action-modal__bullet-points__icon'><Icon icon={InventoryIcon} /></div> <div className='safety-action-modal__bullet-points__icon'><Icon icon={InventoryIcon} /></div>
<div><FormattedMessage id='ignore_notifications_modal.filter_to_review_separately' defaultMessage='You can review filtered notifications separately' /></div> <div><FormattedMessage id='ignore_notifications_modal.filter_to_review_separately' defaultMessage='You can review filtered notifications separately' /></div>
</div> </li>
<div> <li>
<div className='safety-action-modal__bullet-points__icon'><Icon icon={PersonAlertIcon} /></div> <div className='safety-action-modal__bullet-points__icon'><Icon icon={PersonAlertIcon} /></div>
<div><FormattedMessage id='ignore_notifications_modal.filter_to_act_users' defaultMessage="You'll still be able to accept, reject, or report users" /></div> <div><FormattedMessage id='ignore_notifications_modal.filter_to_act_users' defaultMessage="You'll still be able to accept, reject, or report users" /></div>
</div> </li>
<div> <li>
<div className='safety-action-modal__bullet-points__icon'><Icon icon={ShieldQuestionIcon} /></div> <div className='safety-action-modal__bullet-points__icon'><Icon icon={ShieldQuestionIcon} /></div>
<div><FormattedMessage id='ignore_notifications_modal.filter_to_avoid_confusion' defaultMessage='Filtering helps avoid potential confusion' /></div> <div><FormattedMessage id='ignore_notifications_modal.filter_to_avoid_confusion' defaultMessage='Filtering helps avoid potential confusion' /></div>
</div> </li>
</div> </ul>
<div> <div>
<FormattedMessage id='ignore_notifications_modal.disclaimer' defaultMessage="Mastodon cannot inform users that you've ignored their notifications. Ignoring notifications will not stop the messages themselves from being sent." /> <FormattedMessage id='ignore_notifications_modal.disclaimer' defaultMessage="Mastodon cannot inform users that you've ignored their notifications. Ignoring notifications will not stop the messages themselves from being sent." />

22
app/javascript/mastodon/features/ui/components/mute_modal.jsx
View File

@ -85,31 +85,31 @@ export const MuteModal = ({ accountId, acct }) => {
<div> <div>
<h1><FormattedMessage id='mute_modal.title' defaultMessage='Mute user?' /></h1> <h1><FormattedMessage id='mute_modal.title' defaultMessage='Mute user?' /></h1>
<div>@{acct}</div> <p>@{acct}</p>
</div> </div>
</div> </div>
<div className='safety-action-modal__bullet-points'> <ul className='safety-action-modal__bullet-points'>
<div> <li>
<div className='safety-action-modal__bullet-points__icon'><Icon icon={CampaignIcon} /></div> <div className='safety-action-modal__bullet-points__icon'><Icon icon={CampaignIcon} /></div>
<div><FormattedMessage id='mute_modal.they_wont_know' defaultMessage="They won't know they've been muted." /></div> <div><FormattedMessage id='mute_modal.they_wont_know' defaultMessage="They won't know they've been muted." /></div>
</div> </li>
<div> <li>
<div className='safety-action-modal__bullet-points__icon'><Icon icon={VisibilityOffIcon} /></div> <div className='safety-action-modal__bullet-points__icon'><Icon icon={VisibilityOffIcon} /></div>
<div><FormattedMessage id='mute_modal.you_wont_see_posts' defaultMessage="They can still see your posts, but you won't see theirs." /></div> <div><FormattedMessage id='mute_modal.you_wont_see_posts' defaultMessage="They can still see your posts, but you won't see theirs." /></div>
</div> </li>
<div> <li>
<div className='safety-action-modal__bullet-points__icon'><Icon icon={AlternateEmailIcon} /></div> <div className='safety-action-modal__bullet-points__icon'><Icon icon={AlternateEmailIcon} /></div>
<div><FormattedMessage id='mute_modal.you_wont_see_mentions' defaultMessage="You won't see posts that mention them." /></div> <div><FormattedMessage id='mute_modal.you_wont_see_mentions' defaultMessage="You won't see posts that mention them." /></div>
</div> </li>
<div> <li>
<div className='safety-action-modal__bullet-points__icon'><Icon icon={ReplyIcon} /></div> <div className='safety-action-modal__bullet-points__icon'><Icon icon={ReplyIcon} /></div>
<div><FormattedMessage id='mute_modal.they_can_mention_and_follow' defaultMessage="They can mention and follow you, but you won't see them." /></div> <div><FormattedMessage id='mute_modal.they_can_mention_and_follow' defaultMessage="They can mention and follow you, but you won't see them." /></div>
</div> </li>
</div> </ul>
</div> </div>
<div className={classNames('safety-action-modal__bottom', { active: expanded })}> <div className={classNames('safety-action-modal__bottom', { active: expanded })}>

7
app/javascript/mastodon/locales/en.json
View File

@ -328,14 +328,15 @@
"annual_report.summary.share_on_mastodon": "Share on Mastodon", "annual_report.summary.share_on_mastodon": "Share on Mastodon",
"attachments_list.unprocessed": "(unprocessed)", "attachments_list.unprocessed": "(unprocessed)",
"audio.hide": "Hide audio", "audio.hide": "Hide audio",
"block_modal.no_collections": "Neither of you can add each other to collections. You'll be automatically removed from each others' existing collections, if applicable.",
"block_modal.remote_users_caveat": "We will ask the server {domain} to respect your decision. However, compliance is not guaranteed since some servers may handle blocks differently. Public posts may still be visible to non-logged-in users.", "block_modal.remote_users_caveat": "We will ask the server {domain} to respect your decision. However, compliance is not guaranteed since some servers may handle blocks differently. Public posts may still be visible to non-logged-in users.",
"block_modal.show_less": "Show less", "block_modal.show_less": "Show less",
"block_modal.show_more": "Show more", "block_modal.show_more": "Show more",
"block_modal.they_cant_mention": "They can't mention or follow you.", "block_modal.they_cant_mention": "You can't mention, follow, or quote each other.",
"block_modal.they_cant_see_posts": "They can't see your posts and you won't see theirs.", "block_modal.they_cant_see_posts": "They can't see your content and you won't see theirs.",
"block_modal.they_will_know": "They can see that they're blocked.", "block_modal.they_will_know": "They can see that they're blocked.",
"block_modal.title": "Block user?", "block_modal.title": "Block user?",
"block_modal.you_wont_see_mentions": "You won't see posts that mention them.", "block_modal.you_wont_see_mentions": "You won't see posts from others that mention them.",
"boost_modal.combo": "You can press {combo} to skip this next time", "boost_modal.combo": "You can press {combo} to skip this next time",
"boost_modal.reblog": "Boost post?", "boost_modal.reblog": "Boost post?",
"boost_modal.undo_reblog": "Unboost post?", "boost_modal.undo_reblog": "Unboost post?",

8
app/javascript/styles/mastodon/components.scss
View File

@ -6489,14 +6489,16 @@ a.status-card {
&__bullet-points { &__bullet-points {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 8px; gap: 16px;
font-size: 16px; font-size: 16px;
line-height: 24px; line-height: 24px;
& > li,
& > div { & > div {
display: flex; display: flex;
gap: 16px; gap: 16px;
align-items: center; align-items: start;
text-wrap: pretty;
strong { strong {
font-weight: 700; font-weight: 700;
@ -6509,7 +6511,7 @@ a.status-card {
&__icon { &__icon {
width: 40px; width: 40px;
height: 40px; height: 24px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;