chinwag/chinwagsocial
chinwag/chinwagsocial
2
0
Fork 0
Code Issues Pull requests Releases 14 Wiki Activity

Update "Follow" button labels (#36264)

Browse source
This commit is contained in:
diondiondion 2025-09-26 12:00:50 +02:00 • committed by GitHub
commit cb5bbbfb05
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 78 additions and 127 deletions
Download patch file Download diff file Expand all files Collapse all files

70
app/javascript/mastodon/components/follow_button.tsx
View file

@ -5,24 +5,61 @@ import { useIntl, defineMessages } from 'react-intl';
import classNames from 'classnames';
import { useIdentity } from '@/mastodon/identity_context';
import { fetchRelationships, followAccount } from 'mastodon/actions/accounts';
import {
fetchRelationships,
followAccount,
unblockAccount,
unmuteAccount,
} from 'mastodon/actions/accounts';
import { openModal } from 'mastodon/actions/modal';
import { Button } from 'mastodon/components/button';
import { LoadingIndicator } from 'mastodon/components/loading_indicator';
import { me } from 'mastodon/initial_state';
import { useAppDispatch, useAppSelector } from 'mastodon/store';
const messages = defineMessages({
import { useBreakpoint } from '../features/ui/hooks/useBreakpoint';
const longMessages = defineMessages({
unfollow: { id: 'account.unfollow', defaultMessage: 'Unfollow' },
unblock: { id: 'account.unblock_short', defaultMessage: 'Unblock' },
unmute: { id: 'account.unmute_short', defaultMessage: 'Unmute' },
follow: { id: 'account.follow', defaultMessage: 'Follow' },
followBack: { id: 'account.follow_back', defaultMessage: 'Follow back' },
followRequest: {
id: 'account.follow_request',
defaultMessage: 'Request to follow',
},
followRequestCancel: {
id: 'account.follow_request_cancel',
defaultMessage: 'Cancel request',
},
editProfile: { id: 'account.edit_profile', defaultMessage: 'Edit profile' },
});
const shortMessages = {
...longMessages, // Align type signature of shortMessages and longMessages
...defineMessages({
followBack: {
id: 'account.follow_back_short',
defaultMessage: 'Follow back',
},
followRequest: {
id: 'account.follow_request_short',
defaultMessage: 'Request',
},
followRequestCancel: {
id: 'account.follow_request_cancel_short',
defaultMessage: 'Cancel',
},
editProfile: { id: 'account.edit_profile_short', defaultMessage: 'Edit' },
}),
};
export const FollowButton: React.FC<{
accountId?: string;
compact?: boolean;
}> = ({ accountId, compact }) => {
labelLength?: 'auto' | 'short' | 'long';
}> = ({ accountId, compact, labelLength = 'auto' }) => {
const intl = useIntl();
const dispatch = useAppDispatch();
const { signedIn } = useIdentity();
@ -57,29 +94,48 @@ export const FollowButton: React.FC<{
if (accountId === me) {
return;
} else if (relationship.muting) {
dispatch(unmuteAccount(accountId));
} else if (account && (relationship.following || relationship.requested)) {
dispatch(
openModal({ modalType: 'CONFIRM_UNFOLLOW', modalProps: { account } }),
);
} else if (relationship.blocking) {
dispatch(unblockAccount(accountId));
} else {
dispatch(followAccount(accountId));
}
}, [dispatch, accountId, relationship, account, signedIn]);
const isNarrow = useBreakpoint('narrow');
const useShortLabel =
labelLength === 'short' || (labelLength === 'auto' && isNarrow);
const messages = useShortLabel ? shortMessages : longMessages;
const followMessage = account?.locked
? messages.followRequest
: messages.follow;
let label;
if (!signedIn) {
label = intl.formatMessage(messages.follow);
label = intl.formatMessage(followMessage);
} else if (accountId === me) {
label = intl.formatMessage(messages.editProfile);
} else if (!relationship) {
label = <LoadingIndicator />;
} else if (relationship.following || relationship.requested) {
} else if (relationship.muting) {
label = intl.formatMessage(messages.unmute);
} else if (relationship.following) {
label = intl.formatMessage(messages.unfollow);
} else if (relationship.followed_by) {
} else if (relationship.blocking) {
label = intl.formatMessage(messages.unblock);
} else if (relationship.requested) {
label = intl.formatMessage(messages.followRequestCancel);
} else if (relationship.followed_by && !account?.locked) {
label = intl.formatMessage(messages.followBack);
} else {
label = intl.formatMessage(messages.follow);
label = intl.formatMessage(followMessage);
}
if (accountId === me) {