Fix scrolling to inspected element

Summary:
When the `Scrollable` component was introduced, this functionality regressed because the `ref` was no longer set on the right component.

changelog: Fix scrolling to inspected element in Layout plugin

Reviewed By: mweststrate

Differential Revision: D21979475

fbshipit-source-id: f84d515cb1593a33d1ae0e93a01681b6e11aa623

desktop/app/src/ui/components/Scrollable.tsx

@@ -13,7 +13,7 @@ import {BackgroundProperty} from 'csstype';
 
 type Props = {children: React.ReactNode; background?: BackgroundProperty<any>};
 
-const Scrollable: React.FC<Props> = styled('div')<Props>(({background}) => ({
+const Scrollable = styled.div<Props>(({background}) => ({
   width: '100%',
   height: '100%',
   overflow: 'auto',

desktop/app/src/ui/components/elements-inspector/elements.tsx

@@ -702,11 +702,8 @@ export class Elements extends PureComponent<ElementsProps, ElementsState> {
 
   render() {
     return (
-      <Scrollable>
-        <ElementsContainer
-          onKeyDown={this.onKeyDown}
-          tabIndex={0}
-          ref={this._outerRef}>
+      <Scrollable ref={this._outerRef}>
+        <ElementsContainer onKeyDown={this.onKeyDown} tabIndex={0}>
           {this.state.flatElements.map(this.buildRow)}
         </ElementsContainer>
       </Scrollable>