diff --git a/packages/web/src/javascripts/Components/SuperEditor/Plugins/ToolbarPlugin/FloatingLinkEditor.tsx b/packages/web/src/javascripts/Components/SuperEditor/Plugins/ToolbarPlugin/FloatingLinkEditor.tsx index 45d3c710d..25422e043 100644 --- a/packages/web/src/javascripts/Components/SuperEditor/Plugins/ToolbarPlugin/FloatingLinkEditor.tsx +++ b/packages/web/src/javascripts/Components/SuperEditor/Plugins/ToolbarPlugin/FloatingLinkEditor.tsx @@ -57,13 +57,6 @@ const FloatingLinkEditor = ({ return } - const linkEditorElement = linkEditorRef.current - - if (!linkEditorElement) { - setTimeout(updateLinkEditorPosition) - return - } - const nativeSelection = window.getSelection() const rootElement = editor.getRootElement() @@ -71,24 +64,36 @@ const FloatingLinkEditor = ({ if (rootElement.contains(nativeSelection.anchorNode)) { rangeRect.current = getDOMRangeRect(nativeSelection, rootElement) } - const linkEditorRect = linkEditorElement.getBoundingClientRect() - const rootElementRect = rootElement.getBoundingClientRect() + } - const calculatedStyles = getPositionedPopoverStyles({ - align: 'center', - side: 'top', - anchorRect: rangeRect.current, - popoverRect: linkEditorRect, - documentRect: rootElementRect, - offset: 12, - maxHeightFunction: () => 'none', + const linkEditorElement = linkEditorRef.current + + if (!linkEditorElement) { + setTimeout(updateLinkEditorPosition) + return + } + + if (!rootElement) { + return + } + + const linkEditorRect = linkEditorElement.getBoundingClientRect() + const rootElementRect = rootElement.getBoundingClientRect() + + const calculatedStyles = getPositionedPopoverStyles({ + align: 'center', + side: 'top', + anchorRect: rangeRect.current, + popoverRect: linkEditorRect, + documentRect: rootElementRect, + offset: 12, + maxHeightFunction: () => 'none', + }) + if (calculatedStyles) { + Object.entries(calculatedStyles).forEach(([key, value]) => { + linkEditorElement.style.setProperty(key, value) }) - if (calculatedStyles) { - Object.entries(calculatedStyles).forEach(([key, value]) => { - linkEditorElement.style.setProperty(key, value) - }) - linkEditorElement.style.opacity = '1' - } + linkEditorElement.style.opacity = '1' } }, [editor, isMobile]) diff --git a/packages/web/src/javascripts/Components/SuperEditor/Plugins/ToolbarPlugin/ToolbarPlugin.tsx b/packages/web/src/javascripts/Components/SuperEditor/Plugins/ToolbarPlugin/ToolbarPlugin.tsx index 7ed7e8999..776ec33f5 100644 --- a/packages/web/src/javascripts/Components/SuperEditor/Plugins/ToolbarPlugin/ToolbarPlugin.tsx +++ b/packages/web/src/javascripts/Components/SuperEditor/Plugins/ToolbarPlugin/ToolbarPlugin.tsx @@ -267,6 +267,7 @@ const ToolbarPlugin = () => { return activeEditor.dispatchCommand(TOGGLE_LINK_COMMAND, null) } else if (typeof payload === 'string') { const dispatched = activeEditor.dispatchCommand(TOGGLE_LINK_COMMAND, payload) + setIsLink(true) setLinkUrl(payload) setIsLinkEditMode(true) return dispatched