Remove focus logic - I think is unneeded.

app/src/ui/app-menu/app-menu.tsx

@@ -88,22 +88,6 @@ function menuPaneClassNameFromId(id: string) {
 }
 
 export class AppMenu extends React.Component<IAppMenuProps, {}> {
-  /**
-   * The index of the menu pane that should receive focus after the
-   * next render. Default value is -1. This field is cleared after
-   * each successful focus operation.
-   */
-  private focusPane: number = -1
-
-  /**
-   * A mapping between pane index (depth) and actual MenuPane instances.
-   * This is used in order to (indirectly) call the focus method on the
-   * underlying List instances.
-   *
-   * See focusPane and ensurePaneFocus
-   */
-  private paneRefs: MenuPane[] = []
-
   /**
    * A numeric reference to a setTimeout timer id which is used for
    * opening and closing submenus after a delay.
@@ -112,29 +96,6 @@ export class AppMenu extends React.Component<IAppMenuProps, {}> {
    */
   private expandCollapseTimer: number | null = null
 
-  public constructor(props: IAppMenuProps) {
-    super(props)
-    this.focusPane = props.state.length - 1
-    this.receiveProps(null, props)
-  }
-
-  private receiveProps(
-    currentProps: IAppMenuProps | null,
-    nextProps: IAppMenuProps
-  ) {
-    if (nextProps.openedWithAccessKey) {
-      // We only want to react to the openedWithAccessKey prop once, either
-      // when it goes from false to true or when we receive it as our first
-      // prop. By doing it this way we save ourselves having to go through
-      // the dispatcher and updating the value once we've received it.
-      if (!currentProps || !currentProps.openedWithAccessKey) {
-        // Since we were opened with an access key we auto set focus to the
-        // last pane opened.
-        this.focusPane = nextProps.state.length - 1
-      }
-    }
-  }
-
   private onItemClicked = (
     depth: number,
     item: MenuItem,
@@ -157,9 +118,6 @@ export class AppMenu extends React.Component<IAppMenuProps, {}> {
       this.props.dispatcher.setAppMenuState(menu =>
         menu.withOpenedMenu(item, sourceIsAccessKey)
       )
-      if (source.kind === 'keyboard') {
-        this.focusPane = depth + 1
-      }
     } else if (item.type !== 'separator') {
       // Send the close event before actually executing the item so that
       // the menu can restore focus to the previously selected element
@@ -188,7 +146,6 @@ export class AppMenu extends React.Component<IAppMenuProps, {}> {
           menu.withClosedMenu(this.props.state[depth])
         )
 
-        this.focusPane = depth - 1
         event.preventDefault()
       }
     } else if (event.key === 'ArrowRight') {
@@ -199,7 +156,6 @@ export class AppMenu extends React.Component<IAppMenuProps, {}> {
         this.props.dispatcher.setAppMenuState(menu =>
           menu.withOpenedMenu(selectedItem, true)
         )
-        this.focusPane = depth + 1
         event.preventDefault()
       }
     }
@@ -258,12 +214,6 @@ export class AppMenu extends React.Component<IAppMenuProps, {}> {
     }
   }
 
-  private onMenuPaneRef = (pane: MenuPane | null) => {
-    if (pane) {
-      this.paneRefs[pane.props.depth] = pane
-    }
-  }
-
   private onPaneMouseEnter = (depth: number) => {
     this.clearExpandCollapseTimer()
 
@@ -278,8 +228,6 @@ export class AppMenu extends React.Component<IAppMenuProps, {}> {
       // This ensures that the selection to this menu is reset.
       this.props.dispatcher.setAppMenuState(m => m.withDeselectedMenu(paneMenu))
     }
-
-    this.focusPane = depth
   }
 
   private onKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {
@@ -297,7 +245,6 @@ export class AppMenu extends React.Component<IAppMenuProps, {}> {
     return (
       <MenuPane
         key={key}
-        ref={this.onMenuPaneRef}
         className={className}
         depth={depth}
         items={menu.items}
@@ -317,10 +264,6 @@ export class AppMenu extends React.Component<IAppMenuProps, {}> {
     const menus = this.props.state
     const panes = menus.map((m, depth) => this.renderMenuPane(depth, m))
 
-    // Clear out any old references we might have to panes that are
-    // no longer displayed.
-    this.paneRefs = this.paneRefs.slice(0, panes.length)
-
     return (
       // eslint-disable-next-line jsx-a11y/no-static-element-interactions
       <div id="app-menu-foldout" onKeyDown={this.onKeyDown}>
@@ -329,31 +272,6 @@ export class AppMenu extends React.Component<IAppMenuProps, {}> {
     )
   }
 
-  /**
-   * Called after mounting or re-rendering and ensures that the
-   * appropriate (if any) MenuPane list receives keyboard focus.
-   */
-  private ensurePaneFocus() {
-    if (this.focusPane >= 0) {
-      const pane = this.paneRefs[this.focusPane]
-      if (pane) {
-        this.focusPane = -1
-      }
-    }
-  }
-
-  public componentWillReceiveProps(nextProps: IAppMenuProps) {
-    this.receiveProps(this.props, nextProps)
-  }
-
-  public componentDidMount() {
-    this.ensurePaneFocus()
-  }
-
-  public componentDidUpdate() {
-    this.ensurePaneFocus()
-  }
-
   public componentWillUnmount() {
     this.clearExpandCollapseTimer()
   }

app/src/ui/app-menu/menu-pane.tsx

@@ -95,8 +95,6 @@ interface IMenuPaneProps {
 }
 
 export class MenuPane extends React.Component<IMenuPaneProps> {
-  private paneRef = React.createRef<HTMLDivElement>()
-
   private onRowClick = (
     item: MenuItem,
     event: React.MouseEvent<HTMLDivElement>
@@ -218,7 +216,6 @@ export class MenuPane extends React.Component<IMenuPaneProps> {
         className={className}
         onMouseEnter={this.onMouseEnter}
         onKeyDown={this.onKeyDown}
-        ref={this.paneRef}
         tabIndex={-1}
         role="menu"
         aria-labelledby={this.props.ariaLabelledby}
@@ -240,10 +237,6 @@ export class MenuPane extends React.Component<IMenuPaneProps> {
       </div>
     )
   }
-
-  public focus() {
-    this.paneRef.current?.focus()
-  }
 }
 
 const supportedKeys = [