diff --git a/desktop/app/src/ui/components/elements-inspector/elements.tsx b/desktop/app/src/ui/components/elements-inspector/elements.tsx
index 11d5b6bbb..0c9a3f1dd 100644
--- a/desktop/app/src/ui/components/elements-inspector/elements.tsx
+++ b/desktop/app/src/ui/components/elements-inspector/elements.tsx
@@ -223,6 +223,7 @@ type ElementsRowProps = {
   style?: Object;
   contextMenuExtensions: Array<ContextMenuExtension>;
   decorateRow?: DecorateRow;
+  forwardedRef: React.Ref<HTMLDivElement> | null;
 };
 
 type ElementsRowState = {
@@ -324,6 +325,7 @@ class ElementsRow extends PureComponent<ElementsRowProps, ElementsRowState> {
       even,
       matchingSearchQuery,
       decorateRow,
+      forwardedRef,
     } = this.props;
     const hasChildren = element.children && element.children.length > 0;
 
@@ -378,6 +380,7 @@ class ElementsRow extends PureComponent<ElementsRowProps, ElementsRowState> {
 
     return (
       <ElementsRowContainer
+        ref={forwardedRef}
         buildItems={this.getContextMenu}
         key={id}
         level={level}
@@ -465,6 +468,7 @@ export class Elements extends PureComponent<ElementsProps, ElementsState> {
   static defaultProps = {
     alternateRowColor: true,
   };
+  _outerRef = React.createRef<HTMLDivElement>();
   constructor(props: ElementsProps, context: Object) {
     super(props, context);
     this.state = {
@@ -514,6 +518,22 @@ export class Elements extends PureComponent<ElementsProps, ElementsState> {
     return {flatElements, flatKeys, maxDepth};
   }
 
+  _calculateScrollTop(
+    parentHeight: number,
+    parentOffsetTop: number,
+    childHeight: number,
+    childOffsetTop: number,
+  ): number {
+    const childOffsetMid = childOffsetTop + childHeight / 2;
+    if (
+      parentOffsetTop < childOffsetMid &&
+      childOffsetMid < parentOffsetTop + parentHeight
+    ) {
+      return parentOffsetTop;
+    }
+    return childOffsetMid - parentHeight / 2;
+  }
+
   selectElement = (key: ElementID) => {
     this.props.onElementSelected(key);
   };
@@ -651,6 +671,25 @@ export class Elements extends PureComponent<ElementsProps, ElementsState> {
         childrenCount={childrenCount}
         contextMenuExtensions={contextMenuExtensions || []}
         decorateRow={decorateRow}
+        forwardedRef={
+          selected == row.key
+            ? (selectedRow) => {
+                if (!selectedRow || !this._outerRef.current) {
+                  return;
+                }
+                const outer = this._outerRef.current;
+                outer.scrollTo(
+                  0,
+                  this._calculateScrollTop(
+                    outer.offsetHeight,
+                    outer.scrollTop,
+                    selectedRow.offsetHeight,
+                    selectedRow.offsetTop,
+                  ),
+                );
+              }
+            : null
+        }
       />
     );
   };
@@ -658,7 +697,10 @@ export class Elements extends PureComponent<ElementsProps, ElementsState> {
   render() {
     return (
       <ElementsBox>
-        <ElementsContainer onKeyDown={this.onKeyDown} tabIndex={0}>
+        <ElementsContainer
+          onKeyDown={this.onKeyDown}
+          tabIndex={0}
+          ref={this._outerRef}>
           {this.state.flatElements.map(this.buildRow)}
         </ElementsContainer>
       </ElementsBox>
diff --git a/desktop/app/src/ui/components/table/ManagedTable.tsx b/desktop/app/src/ui/components/table/ManagedTable.tsx
index 11971de0e..57d745396 100644
--- a/desktop/app/src/ui/components/table/ManagedTable.tsx
+++ b/desktop/app/src/ui/components/table/ManagedTable.tsx
@@ -431,15 +431,15 @@ export class ManagedTable extends React.Component<
       highlightedRows.add(row.key);
     } else if (e.shiftKey && this.props.multiHighlight) {
       // range select
-      const lastItemKey = Array.from(this.state.highlightedRows).pop()!;
+      const lastItemKey = Array.from(highlightedRows).pop()!;
       highlightedRows = new Set([
         ...highlightedRows,
         ...this.selectInRange(lastItemKey, row.key),
       ]);
     } else {
       // single select
-      this.state.highlightedRows.clear();
-      this.state.highlightedRows.add(row.key);
+      highlightedRows.clear();
+      highlightedRows.add(row.key);
     }
 
     this.onRowHighlighted(highlightedRows);
diff --git a/desktop/plugins/layout/Search.tsx b/desktop/plugins/layout/Search.tsx
index 6a833a3ec..b1ed9d502 100644
--- a/desktop/plugins/layout/Search.tsx
+++ b/desktop/plugins/layout/Search.tsx
@@ -68,7 +68,7 @@ export default class Search extends Component<Props, State> {
     this.timer = setTimeout(() => this.performSearch(value), 200);
   };
 
-  onKeyDown = (e: React.KeyboardEvent) => {
+  onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
     if (e.key === 'Enter') {
       this.performSearch(this.state.value);
     }