Merge branch 'master' into parker

1 files changed, 7 insertions, 11 deletions

diff --git a/src/client/views/ContextMenuItem.tsx b/src/client/views/ContextMenuItem.tsx
index c3921d846..30073e21f 100644
--- a/src/client/views/ContextMenuItem.tsx
+++ b/src/client/views/ContextMenuItem.tsx
@@ -1,5 +1,5 @@
 import React = require("react");
-import { observable, action } from "mobx";
+import { observable, action, runInAction } from "mobx";
 import { observer } from "mobx-react";
 import { IconProp } from '@fortawesome/fontawesome-svg-core';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
@@ -28,18 +28,17 @@ export type ContextMenuProps = OriginalMenuProps | SubmenuProps;
 export class ContextMenuItem extends React.Component<ContextMenuProps & { selected?: boolean }> {
     @observable private _items: Array<ContextMenuProps> = [];
     @observable private overItem = false;
-    @observable private subRef = React.createRef<HTMLDivElement>();
 
-    constructor(props: ContextMenuProps | SubmenuProps) {
-        super(props);
-        if ((this.props as SubmenuProps).subitems) {
-            (this.props as SubmenuProps).subitems?.forEach(i => this._items.push(i));
+    componentDidMount() {
+        this._items.length = 0;
+        if ((this.props as SubmenuProps)?.subitems) {
+            (this.props as SubmenuProps).subitems?.forEach(i => runInAction(() => this._items.push(i)));
         }
     }
 
     handleEvent = async (e: React.MouseEvent<HTMLDivElement>) => {
         if ("event" in this.props) {
-            this.props.closeMenu && this.props.closeMenu();
+            this.props.closeMenu?.();
             let batch: UndoManager.Batch | undefined;
             if (this.props.undoable !== false) {
                 batch = UndoManager.StartBatch(`Context menu event: ${this.props.description}`);
@@ -78,9 +77,6 @@ export class ContextMenuItem extends React.Component<ContextMenuProps & { select
     }
 
     render() {
-
-
-
         if ("event" in this.props) {
             return (
                 <div className={"contextMenu-item" + (this.props.selected ? " contextMenu-itemSelected" : "")} onPointerDown={this.handleEvent}>
@@ -90,7 +86,7 @@ export class ContextMenuItem extends React.Component<ContextMenuProps & { select
                         </span>
                     ) : null}
                     <div className="contextMenu-description">
-                        {this.props.description.replace(":","")}
+                        {this.props.description.replace(":", "")}
                     </div>
                 </div>
             );