wix-style-react/src/Sidebar/SidebarItem/SidebarItem.js

wix-style-react

import React, { PureComponent } from 'react';
import { SidebarContext, SidebarItemContext } from '../SidebarAPI';

export class SidebarItem extends PureComponent {
  displayName = 'SidebarItem';

  render() {
    const { dataHook } = this.props;
    return (
      <SidebarContext.Consumer>
        {context => (
          <div
            data-hook={dataHook}
            onClick={e => {
              if (!this.props.disable) {
                if (this.props.onClick) {
                  this.props.onClick(this.props.itemKey, e);
                }
                if (!e.defaultPrevented) {
                  context.itemClicked(this.props.itemKey);
                }
              }
            }}
          >
            <SidebarItemContext.Provider
              value={{
                selected: () => context.getSelectedKey() === this.props.itemKey,
                getIsMenuExpanded: () => context.getIsMenuExpanded(),
              }}
            >
              {this.props.children}
            </SidebarItemContext.Provider>
          </div>
        )}
      </SidebarContext.Consumer>
    );
  }
}