diff --git a/frontend/src/scenes/notebooks/Marks/NotebookMarkLink.tsx b/frontend/src/scenes/notebooks/Marks/NotebookMarkLink.tsx index 52a66b633af6d..f50e1290734a2 100644 --- a/frontend/src/scenes/notebooks/Marks/NotebookMarkLink.tsx +++ b/frontend/src/scenes/notebooks/Marks/NotebookMarkLink.tsx @@ -59,5 +59,10 @@ export const NotebookMarkLink = Mark.create({ }) const isPostHogLink = (href: string): boolean => { - return new URL(href, window.location.origin).origin === window.location.origin + try { + const url = new URL(href, window.location.origin) + return url.origin === window.location.origin + } catch { + return false + } } diff --git a/frontend/src/scenes/notebooks/Notebook/InlineMenu.tsx b/frontend/src/scenes/notebooks/Notebook/InlineMenu.tsx index 275b4e3febde0..8df8854a0843e 100644 --- a/frontend/src/scenes/notebooks/Notebook/InlineMenu.tsx +++ b/frontend/src/scenes/notebooks/Notebook/InlineMenu.tsx @@ -3,10 +3,12 @@ import { Editor, isTextSelection } from '@tiptap/core' import { BubbleMenu } from '@tiptap/react' import { IconBold, IconDelete, IconItalic, IconLink, IconOpenInNew } from 'lib/lemon-ui/icons' import { isURL } from 'lib/utils' +import { useRef } from 'react' import NotebookIconHeading from './NotebookIconHeading' export const InlineMenu = ({ editor }: { editor: Editor }): JSX.Element => { const { href, target } = editor.getAttributes('link') + const menuRef = useRef(null) const setLink = (href: string): void => { editor.commands.setMark('link', { href: href }) @@ -19,25 +21,29 @@ export const InlineMenu = ({ editor }: { editor: Editor }): JSX.Element => { return ( { - const hasEditorFocus = view.hasFocus() + shouldShow={({ editor: { isEditable }, view, state, from, to }) => { + const isChildOfMenu = menuRef.current?.contains(document.activeElement) + const focused = view.hasFocus() || isChildOfMenu const isTextBlock = isTextSelection(state.selection) - if (!hasEditorFocus || !editor.isEditable || !isTextBlock) { + if (!focused || !isEditable || !isTextBlock) { return false } return state.doc.textBetween(from, to).length > 0 }} > -
+
{editor.isActive('link') ? ( <>