fix: More context menu fixes

app/components/ContextMenu/MenuItem.js

@@ -26,20 +26,29 @@ const MenuItem = ({
   hide,
   ...rest
 }: Props) => {
-  // We bind to mousedown instead of onClick here as otherwise menu items do not
-  // work in Firefox which triggers the hideOnClickOutside handler first via
-  // mousedown.
-  const handleMouseDown = React.useCallback(
+  const handleClick = React.useCallback(
     (ev) => {
       if (onClick) {
         ev.preventDefault();
         ev.stopPropagation();
         onClick(ev);
       }
+
+      if (hide) {
+        hide();
+      }
     },
-    [onClick]
+    [onClick, hide]
   );
 
+  // Preventing default mousedown otherwise menu items do not work in Firefox,
+  // which triggers the hideOnClickOutside handler first via mousedown – hiding
+  // and un-rendering the menu contents.
+  const handleMouseDown = React.useCallback((ev) => {
+    ev.preventDefault();
+    ev.stopPropagation();
+  }, []);
+
   return (
     <BaseMenuItem
       onClick={disabled ? undefined : onClick}
@@ -52,8 +61,8 @@ const MenuItem = ({
           {...props}
           $toggleable={selected !== undefined}
           as={onClick ? "button" : as}
+          onClick={handleClick}
           onMouseDown={handleMouseDown}
-          onClick={hide}
         >
           {selected !== undefined && (
             <>

app/scenes/Document/components/Editor.js

@@ -33,7 +33,7 @@ type Props = {|
 @observer
 class DocumentEditor extends React.Component<Props> {
   @observable activeLinkEvent: ?MouseEvent;
-  @observable ref = React.createRef<HTMLDivElement | HTMLInputElement>();
+  ref = React.createRef<HTMLDivElement | HTMLInputElement>();
 
   focusAtStart = () => {
     if (this.props.innerRef.current) {
@@ -110,8 +110,6 @@ class DocumentEditor extends React.Component<Props> {
     const normalizedTitle =
       !title && readOnly ? document.titleWithDefault : title;
 
-    console.log(this.ref.current);
-
     return (
       <Flex auto column>
         {readOnly ? (