fix: Remove unnecessary onClick prop from NestedSidebar, since one can listen to container element onClick

2 files changed, 3 insertions, 16 deletions

diff --git a/packages/react-shared/src/components/nested_sidebar_menu.tsx b/packages/react-shared/src/components/nested_sidebar_menu.tsx
index f3ce5f5bf..85206569c 100644
--- a/packages/react-shared/src/components/nested_sidebar_menu.tsx
+++ b/packages/react-shared/src/components/nested_sidebar_menu.tsx
@@ -14,7 +14,6 @@ export interface NestedSidebarMenuProps {
     sectionNameToLinks: ObjectMap<ALink[]>;
     sidebarHeader?: React.ReactNode;
     shouldDisplaySectionHeaders?: boolean;
-    onMenuItemClick?: () => void;
     selectedVersion?: string;
     versions?: string[];
     onVersionSelected?: (semver: string) => void;
@@ -41,7 +40,6 @@ const styles: Styles = {
 export class NestedSidebarMenu extends React.Component<NestedSidebarMenuProps, NestedSidebarMenuState> {
     public static defaultProps: Partial<NestedSidebarMenuProps> = {
         shouldDisplaySectionHeaders: true,
-        onMenuItemClick: _.noop.bind(_),
         shouldReformatMenuItemNames: true,
     };
     public render(): React.ReactNode {
@@ -92,11 +90,7 @@ export class NestedSidebarMenu extends React.Component<NestedSidebarMenuProps, N
             return (
                 <div key={`menuItem-${finalMenuItemName}`}>
                     <Link to={link.to} shouldOpenInNewTab={link.shouldOpenInNewTab}>
-                        <MenuItem
-                            style={menuItemStyles}
-                            innerDivStyle={menuItemInnerDivStyles}
-                            onClick={this._onMenuItemClick.bind(this)}
-                        >
+                        <MenuItem style={menuItemStyles} innerDivStyle={menuItemInnerDivStyles}>
                             <span
                                 style={{
                                     textTransform: this.props.shouldReformatMenuItemNames ? 'capitalize' : 'none',
@@ -111,9 +105,4 @@ export class NestedSidebarMenu extends React.Component<NestedSidebarMenuProps, N
         });
         return menuItems;
     }
-    private _onMenuItemClick(): void {
-        if (!_.isUndefined(this.props.onMenuItemClick)) {
-            this.props.onMenuItemClick();
-        }
-    }
 }
diff --git a/packages/website/ts/components/top_bar/top_bar.tsx b/packages/website/ts/components/top_bar/top_bar.tsx
index fc13efec9..55a2a3954 100644
--- a/packages/website/ts/components/top_bar/top_bar.tsx
+++ b/packages/website/ts/components/top_bar/top_bar.tsx
@@ -309,12 +309,11 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> {
             return undefined;
         }
         return (
-            <div className="lg-hide md-hide">
+            <div className="lg-hide md-hide" onClick={this._onMenuButtonClick.bind(this)}>
                 <NestedSidebarMenu
                     sectionNameToLinks={this.props.sectionNameToLinks}
                     sidebarHeader={this.props.sidebarHeader}
                     shouldDisplaySectionHeaders={false}
-                    onMenuItemClick={this._onMenuButtonClick.bind(this)}
                     selectedVersion={this.props.docsVersion}
                     versions={this.props.availableDocVersions}
                     onVersionSelected={this.props.onVersionSelected}
@@ -328,12 +327,11 @@ export class TopBar extends React.Component<TopBarProps, TopBarState> {
         }
 
         return (
-            <div className="lg-hide md-hide">
+            <div className="lg-hide md-hide" onClick={this._onMenuButtonClick.bind(this)}>
                 <NestedSidebarMenu
                     sectionNameToLinks={this.props.sectionNameToLinks}
                     sidebarHeader={this.props.sidebarHeader}
                     shouldDisplaySectionHeaders={false}
-                    onMenuItemClick={this._onMenuButtonClick.bind(this)}
                 />
             </div>
         );