From 2ce65c1b3cda9addb2d0cf945195b78d9e7be398 Mon Sep 17 00:00:00 2001
From: Pritesh Nandgaonkar <prit91@fb.com>
Date: Tue, 7 Jul 2020 08:39:45 -0700
Subject: [PATCH] Solve the issue where the bottom view of Sidebar was pushed
 down

Summary: This fixes the issue raised [here](https://fb.workplace.com/groups/flippersupport/permalink/911822855965040/).

Reviewed By: nikoant

Differential Revision: D22411617

fbshipit-source-id: ca1078bf418532863823fb3748e9edea4526cbc2
---
 desktop/app/src/App.tsx | 50 +++++++++++++++++++++--------------------
 1 file changed, 26 insertions(+), 24 deletions(-)

diff --git a/desktop/app/src/App.tsx b/desktop/app/src/App.tsx
index b218561ae..dbcfcc71d 100644
--- a/desktop/app/src/App.tsx
+++ b/desktop/app/src/App.tsx
@@ -65,7 +65,7 @@ type DispatchProps = {
   setActiveSheet: typeof setActiveSheet;
 };
 
-const MainContent = styled(FlexRow)({
+const MainContent = styled(FlexColumn)({
   height: 'calc(100vh - 38px)',
 });
 
@@ -154,31 +154,33 @@ export class App extends React.Component<Props> {
     return (
       <FlexColumn grow={true}>
         <TitleBar version={version} />
-        <DoctorBar />
-        <ErrorBar />
         <Sheet>{this.getSheet}</Sheet>
         <MainContent>
-          {this.props.leftSidebarVisible && <MainSidebar2 />}
-          <PluginContent>
-            {this.props.staticView != null ? (
-              React.createElement(this.props.staticView, {
-                logger: this.props.logger,
-              })
-            ) : (
-              <PluginContainer logger={this.props.logger} />
-            )}
-            <div
-              id="flipper-out-of-contents-container"
-              style={{
-                display: 'none',
-                position: 'absolute',
-                right: 0,
-                bottom: 0,
-                left: 0,
-                top: 0,
-              }}
-            />
-          </PluginContent>
+          <DoctorBar />
+          <ErrorBar />
+          <FlexRow grow scrollable>
+            {this.props.leftSidebarVisible && <MainSidebar2 />}
+            <PluginContent>
+              {this.props.staticView != null ? (
+                React.createElement(this.props.staticView, {
+                  logger: this.props.logger,
+                })
+              ) : (
+                <PluginContainer logger={this.props.logger} />
+              )}
+              <div
+                id="flipper-out-of-contents-container"
+                style={{
+                  display: 'none',
+                  position: 'absolute',
+                  right: 0,
+                  bottom: 0,
+                  left: 0,
+                  top: 0,
+                }}
+              />
+            </PluginContent>
+          </FlexRow>
         </MainContent>
         <StatusBar />
       </FlexColumn>