From 33bab3652dead7299d31bb4b203c029e4d328597 Mon Sep 17 00:00:00 2001
From: Pavel Feldman <pavel.feldman@gmail.com>
Date: Thu, 13 Jul 2023 15:14:49 -0700
Subject: [PATCH] fix(ui): bump min sidebar size (#24193)

---
 packages/trace-viewer/src/ui/uiModeView.tsx | 2 +-
 packages/web/src/components/splitView.tsx   | 6 ++++--
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/packages/trace-viewer/src/ui/uiModeView.tsx b/packages/trace-viewer/src/ui/uiModeView.tsx
index 43cd9fb83a..557937116a 100644
--- a/packages/trace-viewer/src/ui/uiModeView.tsx
+++ b/packages/trace-viewer/src/ui/uiModeView.tsx
@@ -171,7 +171,7 @@ export const UIModeView: React.FC<{}> = ({
       <div className='title'>UI Mode disconnected</div>
       <div><a href='#' onClick={() => window.location.reload()}>Reload the page</a> to reconnect</div>
     </div>}
-    <SplitView sidebarSize={250} orientation='horizontal' sidebarIsFirst={true}>
+    <SplitView sidebarSize={250} minSidebarSize={125} orientation='horizontal' sidebarIsFirst={true}>
       <div className='vbox'>
         <div className={'vbox' + (isShowingOutput ? '' : ' hidden')}>
           <Toolbar>
diff --git a/packages/web/src/components/splitView.tsx b/packages/web/src/components/splitView.tsx
index bf00e35d57..636414729d 100644
--- a/packages/web/src/components/splitView.tsx
+++ b/packages/web/src/components/splitView.tsx
@@ -22,6 +22,7 @@ export interface SplitViewProps {
   sidebarHidden?: boolean,
   sidebarIsFirst?: boolean,
   orientation?: 'vertical' | 'horizontal',
+  minSidebarSize?: number,
   children: JSX.Element | JSX.Element[] | string,
 }
 
@@ -32,9 +33,10 @@ export const SplitView: React.FC<SplitViewProps> = ({
   sidebarHidden = false,
   sidebarIsFirst = false,
   orientation = 'vertical',
+  minSidebarSize = kMinSize,
   children
 }) => {
-  const [size, setSize] = React.useState<number>(Math.max(kMinSize, sidebarSize));
+  const [size, setSize] = React.useState<number>(Math.max(minSidebarSize, sidebarSize));
   const [resizing, setResizing] = React.useState<{ offset: number, size: number } | null>(null);
 
   const childrenArray = React.Children.toArray(children);
@@ -70,7 +72,7 @@ export const SplitView: React.FC<SplitViewProps> = ({
 
           const splitView = (event.target as HTMLElement).parentElement!;
           const rect = splitView.getBoundingClientRect();
-          const size = Math.min(Math.max(kMinSize, newSize), (orientation === 'vertical' ? rect.height : rect.width) - kMinSize);
+          const size = Math.min(Math.max(minSidebarSize, newSize), (orientation === 'vertical' ? rect.height : rect.width) - minSidebarSize);
           setSize(size);
         }
       }}