Fix follow button in hover cards not working when signed out in web UI (#30864)
parent
0f3fef6fda
commit
ea6c455e81
|
@ -2,11 +2,13 @@ import { useCallback, useEffect } from 'react';
|
||||||
|
|
||||||
import { useIntl, defineMessages } from 'react-intl';
|
import { useIntl, defineMessages } from 'react-intl';
|
||||||
|
|
||||||
|
import { useIdentity } from '@/mastodon/identity_context';
|
||||||
import {
|
import {
|
||||||
fetchRelationships,
|
fetchRelationships,
|
||||||
followAccount,
|
followAccount,
|
||||||
unfollowAccount,
|
unfollowAccount,
|
||||||
} from 'mastodon/actions/accounts';
|
} from 'mastodon/actions/accounts';
|
||||||
|
import { openModal } from 'mastodon/actions/modal';
|
||||||
import { Button } from 'mastodon/components/button';
|
import { Button } from 'mastodon/components/button';
|
||||||
import { LoadingIndicator } from 'mastodon/components/loading_indicator';
|
import { LoadingIndicator } from 'mastodon/components/loading_indicator';
|
||||||
import { me } from 'mastodon/initial_state';
|
import { me } from 'mastodon/initial_state';
|
||||||
|
@ -29,17 +31,37 @@ export const FollowButton: React.FC<{
|
||||||
}> = ({ accountId }) => {
|
}> = ({ accountId }) => {
|
||||||
const intl = useIntl();
|
const intl = useIntl();
|
||||||
const dispatch = useAppDispatch();
|
const dispatch = useAppDispatch();
|
||||||
|
const { signedIn } = useIdentity();
|
||||||
|
const account = useAppSelector((state) =>
|
||||||
|
accountId ? state.accounts.get(accountId) : undefined,
|
||||||
|
);
|
||||||
const relationship = useAppSelector((state) =>
|
const relationship = useAppSelector((state) =>
|
||||||
state.relationships.get(accountId),
|
state.relationships.get(accountId),
|
||||||
);
|
);
|
||||||
const following = relationship?.following || relationship?.requested;
|
const following = relationship?.following || relationship?.requested;
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
dispatch(fetchRelationships([accountId]));
|
if (accountId && signedIn) {
|
||||||
}, [dispatch, accountId]);
|
dispatch(fetchRelationships([accountId]));
|
||||||
|
}
|
||||||
|
}, [dispatch, accountId, signedIn]);
|
||||||
|
|
||||||
const handleClick = useCallback(() => {
|
const handleClick = useCallback(() => {
|
||||||
|
if (!signedIn) {
|
||||||
|
dispatch(
|
||||||
|
openModal({
|
||||||
|
modalType: 'INTERACTION',
|
||||||
|
modalProps: {
|
||||||
|
type: 'follow',
|
||||||
|
accountId: accountId,
|
||||||
|
url: account?.url,
|
||||||
|
},
|
||||||
|
}),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
if (!relationship) return;
|
if (!relationship) return;
|
||||||
|
|
||||||
if (accountId === me) {
|
if (accountId === me) {
|
||||||
return;
|
return;
|
||||||
} else if (relationship.following || relationship.requested) {
|
} else if (relationship.following || relationship.requested) {
|
||||||
|
@ -47,11 +69,13 @@ export const FollowButton: React.FC<{
|
||||||
} else {
|
} else {
|
||||||
dispatch(followAccount(accountId));
|
dispatch(followAccount(accountId));
|
||||||
}
|
}
|
||||||
}, [dispatch, accountId, relationship]);
|
}, [dispatch, accountId, relationship, account, signedIn]);
|
||||||
|
|
||||||
let label;
|
let label;
|
||||||
|
|
||||||
if (accountId === me) {
|
if (!signedIn) {
|
||||||
|
label = intl.formatMessage(messages.follow);
|
||||||
|
} else if (accountId === me) {
|
||||||
label = intl.formatMessage(messages.edit_profile);
|
label = intl.formatMessage(messages.edit_profile);
|
||||||
} else if (!relationship) {
|
} else if (!relationship) {
|
||||||
label = <LoadingIndicator />;
|
label = <LoadingIndicator />;
|
||||||
|
|
Loading…
Reference in New Issue