diff --git a/src/components/middle/message/Message.tsx b/src/components/middle/message/Message.tsx index 91633055..e5b52f78 100644 --- a/src/components/middle/message/Message.tsx +++ b/src/components/middle/message/Message.tsx @@ -231,7 +231,7 @@ const Message: FC = ({ isContextMenuOpen, contextMenuPosition, handleBeforeContextMenu, handleContextMenu, handleContextMenuClose, handleContextMenuHide, - } = useContextMenuHandlers(ref); + } = useContextMenuHandlers(ref, false, true); const noAppearanceAnimation = appearanceOrder <= 0; const [isShown, markShown] = useFlag(noAppearanceAnimation); diff --git a/src/hooks/useContextMenuHandlers.ts b/src/hooks/useContextMenuHandlers.ts index 3b8d4328..71173005 100644 --- a/src/hooks/useContextMenuHandlers.ts +++ b/src/hooks/useContextMenuHandlers.ts @@ -17,6 +17,7 @@ function checkIsDisabledForMobile() { export default ( elementRef: RefObject, isMenuDisabled?: boolean, + shouldDisableOnLink?: boolean, ) => { const [isContextMenuOpen, setIsContextMenuOpen] = useState(false); const [contextMenuPosition, setContextMenuPosition] = useState(undefined); @@ -28,11 +29,12 @@ export default ( }, [isMenuDisabled]); const handleContextMenu = useCallback((e: React.MouseEvent) => { - if (isMenuDisabled) { + document.body.classList.remove('no-selection'); + + if (isMenuDisabled || (shouldDisableOnLink && (e.target as HTMLElement).matches('a.text-entity-link[href]'))) { return; } e.preventDefault(); - document.body.classList.remove('no-selection'); if (contextMenuPosition) { return; @@ -45,7 +47,7 @@ export default ( setIsContextMenuOpen(true); setContextMenuPosition({ x: e.clientX, y: e.clientY }); - }, [isMenuDisabled, contextMenuPosition]); + }, [isMenuDisabled, shouldDisableOnLink, contextMenuPosition]); const handleContextMenuClose = useCallback(() => { setIsContextMenuOpen(false);