diff --git a/app/soapbox/components/status-hover-card.tsx b/app/soapbox/components/status-hover-card.tsx index 7a9685b85..dc02af3f4 100644 --- a/app/soapbox/components/status-hover-card.tsx +++ b/app/soapbox/components/status-hover-card.tsx @@ -70,6 +70,7 @@ export const StatusHoverCard: React.FC = ({ visible = true }) diff --git a/app/soapbox/components/status-reply-mentions.tsx b/app/soapbox/components/status-reply-mentions.tsx index c7d642b99..ce0451fda 100644 --- a/app/soapbox/components/status-reply-mentions.tsx +++ b/app/soapbox/components/status-reply-mentions.tsx @@ -11,9 +11,10 @@ import type { Account, Status } from 'soapbox/types/entities'; interface IStatusReplyMentions { status: Status, + hoverable?: boolean, } -const StatusReplyMentions: React.FC = ({ status }) => { +const StatusReplyMentions: React.FC = ({ status, hoverable = true }) => { const dispatch = useAppDispatch(); const handleOpenMentionsModal: React.MouseEventHandler = (e) => { @@ -47,11 +48,21 @@ const StatusReplyMentions: React.FC = ({ status }) => { } // The typical case with a reply-to and a list of mentions. - const accounts = to.slice(0, 2).map(account => ( - + const accounts = to.slice(0, 2).map(account => { + const link = ( @{account.username} - - )).toArray(); + ); + + if (hoverable) { + return ( + + {link} + + ); + } else { + return link; + } + }).toArray(); if (to.size > 2) { accounts.push( @@ -68,17 +79,23 @@ const StatusReplyMentions: React.FC = ({ status }) => { defaultMessage='Replying to {accounts}' values={{ accounts: , - hover: (children: React.ReactNode) => ( - - - {children} - - - ), + hover: (children: React.ReactNode) => { + if (hoverable) { + return ( + + + {children} + + + ); + } else { + return children; + } + }, }} /> diff --git a/app/soapbox/components/status.tsx b/app/soapbox/components/status.tsx index 73a59519c..f4bd15495 100644 --- a/app/soapbox/components/status.tsx +++ b/app/soapbox/components/status.tsx @@ -94,6 +94,7 @@ interface IStatus extends RouteComponentProps { featured?: boolean, withDismiss?: boolean, hideActionBar?: boolean, + hoverable?: boolean, } interface IStatusState { @@ -106,6 +107,7 @@ class Status extends ImmutablePureComponent { static defaultProps = { focusable: true, + hoverable: true, }; didShowCard = false; @@ -481,6 +483,7 @@ class Status extends ImmutablePureComponent { action={reblogElement} hideActions={!reblogElement} showEdit={!!status.edited_at} + showProfileHoverCard={this.props.hoverable} /> @@ -492,7 +495,10 @@ class Status extends ImmutablePureComponent { )} - +