diff --git a/app/javascript/flavours/glitch/components/status.jsx b/app/javascript/flavours/glitch/components/status.jsx index 168b5f2071..81ba9eb101 100644 --- a/app/javascript/flavours/glitch/components/status.jsx +++ b/app/javascript/flavours/glitch/components/status.jsx @@ -28,6 +28,7 @@ import { Avatar } from './avatar'; import { AvatarOverlay } from './avatar_overlay'; import { DisplayName } from './display_name'; import { getHashtagBarForStatus } from './hashtag_bar'; +import { Permalink } from './permalink'; import StatusActionBar from './status_action_bar'; import StatusContent from './status_content'; import StatusIcons from './status_icons'; @@ -270,28 +271,18 @@ class Status extends ImmutablePureComponent { }; handleClick = e => { - if (e && (e.button !== 0 || e.ctrlKey || e.metaKey)) { - return; - } - - if (e) { - e.preventDefault(); - } - - this.handleHotkeyOpen(); + e.preventDefault(); + this.handleHotkeyOpen(e); }; - handleAccountClick = (e, proper = true) => { - if (e && (e.button !== 0 || e.ctrlKey || e.metaKey)) { + handleMouseUp = e => { + // Only handle clicks on the empty space above the content + + if (e.target !== e.currentTarget) { return; } - - if (e) { - e.preventDefault(); - e.stopPropagation(); - } - - this._openProfile(proper); + + this.handleClick(e); }; handleExpandedToggle = () => { @@ -358,7 +349,7 @@ class Status extends ImmutablePureComponent { this.props.onMention(this.props.status.get('account')); }; - handleHotkeyOpen = () => { + handleHotkeyOpen = (e) => { if (this.props.onClick) { this.props.onClick(); return; @@ -371,7 +362,13 @@ class Status extends ImmutablePureComponent { return; } - history.push(`/@${status.getIn(['account', 'acct'])}/${status.get('id')}`); + const path = `/@${status.getIn(['account', 'acct'])}/${status.get('id')}`; + + if (e?.button === 0 && !(e?.ctrlKey || e?.metaKey)) { + history.push(path); + } else if (e?.button === 1 || (e?.button === 0 && (e?.ctrlKey || e?.metaKey))) { + window.open(path, '_blank', 'noreferrer noopener'); + } }; handleHotkeyOpenProfile = () => { @@ -697,15 +694,14 @@ class Status extends ImmutablePureComponent { {(connectReply || connectUp || connectToRoot) &&
} {(!muted) && ( - /* eslint-disable-next-line jsx-a11y/no-static-element-interactions */ -
- +
+
{statusAvatar}
-
+ = ({ ); const handleMouseUp = useCallback>( - ({ clientX, clientY, target, button }) => { + ({ clientX, clientY, target, button, ctrlKey, metaKey }) => { const [startX, startY] = clickCoordinatesRef.current ?? [0, 0]; const [deltaX, deltaY] = [ Math.abs(clientX - startX), @@ -64,8 +64,14 @@ export const EmbeddedStatus: React.FC<{ statusId: string }> = ({ element = element.parentNode as HTMLDivElement | null; } - if (deltaX + deltaY < 5 && button === 0 && account) { - history.push(`/@${account.acct}/${statusId}`); + if (deltaX + deltaY < 5 && account) { + const path = `/@${account.acct}/${statusId}`; + + if (button === 0 && !(ctrlKey || metaKey)) { + history.push(path); + } else if (button === 1 || (button === 0 && (ctrlKey || metaKey))) { + window.open(path, '_blank', 'noreferrer noopener'); + } } clickCoordinatesRef.current = null;