tweak the behavior of status context menu

This commit is contained in:
Osma Ahvenlampi 2023-06-14 17:23:56 +03:00
parent 3b3668ba13
commit 804e4571d9

View file

@ -682,9 +682,13 @@ function Status({
x: 0, x: 0,
y: 0, y: 0,
}); });
const bindLongPress = useLongPress( const bindLongPressContext = useLongPress(
(e) => { (e) => {
const { clientX, clientY } = e.touches?.[0] || e; const { clientX, clientY } = e.touches?.[0] || e;
// link detection copied from onContextMenu because here it works
const link = e.target.closest('a');
if (link && /^https?:\/\//.test(link.getAttribute('href'))) return;
e.preventDefault();
setContextMenuAnchorPoint({ setContextMenuAnchorPoint({
x: clientX, x: clientX,
y: clientY, y: clientY,
@ -695,7 +699,7 @@ function Status({
threshold: 600, threshold: 600,
captureEvent: true, captureEvent: true,
detect: 'touch', detect: 'touch',
cancelOnMovement: true, cancelOnMovement: 4, // true allows movement of up to 25 pixels
}, },
); );
@ -716,6 +720,7 @@ function Status({
} ${_deleted ? 'status-deleted' : ''} ${quoted ? 'status-card' : ''}`} } ${_deleted ? 'status-deleted' : ''} ${quoted ? 'status-card' : ''}`}
onMouseEnter={debugHover} onMouseEnter={debugHover}
onContextMenu={(e) => { onContextMenu={(e) => {
// FIXME: this code isn't getting called on Chrome at all?
if (!showContextMenu) return; if (!showContextMenu) return;
if (e.metaKey) return; if (e.metaKey) return;
// console.log('context menu', e); // console.log('context menu', e);
@ -728,7 +733,7 @@ function Status({
}); });
setIsContextMenuOpen(true); setIsContextMenuOpen(true);
}} }}
{...(showContextMenu ? bindLongPress() : {})} {...(showContextMenu ? bindLongPressContext() : {})}
> >
{showContextMenu && ( {showContextMenu && (
<ControlledMenu <ControlledMenu
@ -1854,7 +1859,7 @@ function FilteredStatus({ status, filterInfo, instance, containerProps = {} }) {
const statusPeekText = statusPeek(status.reblog || status); const statusPeekText = statusPeek(status.reblog || status);
const [showPeek, setShowPeek] = useState(false); const [showPeek, setShowPeek] = useState(false);
const bindLongPress = useLongPress( const bindLongPressPeek = useLongPress(
() => { () => {
setShowPeek(true); setShowPeek(true);
}, },
@ -1862,7 +1867,7 @@ function FilteredStatus({ status, filterInfo, instance, containerProps = {} }) {
threshold: 600, threshold: 600,
captureEvent: true, captureEvent: true,
detect: 'touch', detect: 'touch',
cancelOnMovement: true, cancelOnMovement: 4, // true allows movement of up to 25 pixels
}, },
); );
@ -1875,7 +1880,7 @@ function FilteredStatus({ status, filterInfo, instance, containerProps = {} }) {
e.preventDefault(); e.preventDefault();
setShowPeek(true); setShowPeek(true);
}} }}
{...bindLongPress()} {...bindLongPressPeek()}
> >
<article class="status filtered" tabindex="-1"> <article class="status filtered" tabindex="-1">
<b <b