message: Make clicking on the item to execute search work
diff: * limitations under the License.
  */
  +import { IconComponent } from '@backstage/core-api';
  +import { BackstageTheme } from '@backstage/theme';
  import {
  + Badge,
  makeStyles,
  styled,
  TextField,
  Typography,
  - Badge,
  } from '@material-ui/core';
  -import { BackstageTheme } from '@backstage/theme';
  -import { IconComponent } from '@backstage/core-api';
  import SearchIcon from '@material-ui/icons/Search';
  import clsx from 'clsx';
  import React, {
  - useContext,
  - useState,
  - KeyboardEventHandler,
  forwardRef,
  + KeyboardEventHandler,
  ReactNode,
  + useContext,
  + useState,
  } from 'react';
  import { NavLink } from 'react-router-dom';
  import { sidebarConfig, SidebarContext } from './config';
  @@ -120,7 +120,7 @@ type SidebarItemProps = {
  // If 'to' is set the item will act as a nav link with highlight, otherwise it's just a button
  to?: string;
  hasNotifications?: boolean;
  - onClick?: () => void;
  + onClick?: (ev: React.MouseEvent) => void;
  children?: ReactNode;
  };
  @@ -218,10 +218,14 @@ export const SidebarSearchField = (props: SidebarSearchFieldProps) => {
  const [input, setInput] = useState('');
  const classes = useStyles();
  - const handleEnter: KeyboardEventHandler = ev => {
  - if (ev.key === 'Enter') {
  + const search = () => {
  props.onSearch(input);
  setInput('');
  + };
  +
  + const handleEnter: KeyboardEventHandler = ev => {
  + if (ev.key === 'Enter') {
  + search();
  }
  };
  @@ -229,18 +233,25 @@ export const SidebarSearchField = (props: SidebarSearchFieldProps) => {
  setInput(ev.target.value);
  };
  - const handleClick = (ev: React.MouseEvent<HTMLInputElement>) => {
  + const handleInputClick = (ev: React.MouseEvent<HTMLInputElement>) => {
  // Clicking into the search fields shouldn't navigate to the search page
  ev.preventDefault();
  + ev.stopPropagation();
  + };
  +
  + const handleItemClick = (ev: React.MouseEvent) => {
  + // Clicking on the search icon while should execute a query with the current field content
  + search();
  + ev.preventDefault();
  };
  return (
  <div className={classes.searchRoot}>
  - <SidebarItem icon={SearchIcon} to={props.to}>
  + <SidebarItem icon={SearchIcon} to={props.to} onClick={handleItemClick}>
  <TextField
  placeholder="Search"
  value={input}
  - onClick={handleClick}
  + onClick={handleInputClick}
  onChange={handleInput}
  onKeyDown={handleEnter}
  className={classes.searchContainer}
  