From cca0ada25e86168b1246bfaf364b9a77968e369b Mon Sep 17 00:00:00 2001
From: lianahus <liana@ethereum.org>
Date: Tue, 6 Sep 2022 15:52:57 +0200
Subject: [PATCH 1/2] do not show localhost explorer if it is not required

---
 .../workspace/src/lib/remix-ui-workspace.tsx  | 151 +++++++++---------
 1 file changed, 74 insertions(+), 77 deletions(-)

diff --git a/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx b/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx
index 0977cee871..de157c1feb 100644
--- a/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx
+++ b/libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx
@@ -309,83 +309,80 @@ export function Workspace () {
         <div className='h-100 remixui_fileExplorerTree' onFocus={() => { toggleDropdown(false) }}>
           <div className='h-100'>
           { (global.fs.browser.isRequestingWorkspace || global.fs.browser.isRequestingCloning) && <div className="text-center py-5"><i className="fas fa-spinner fa-pulse fa-2x"></i></div>}
-            { !(global.fs.browser.isRequestingWorkspace || 
-              global.fs.browser.isRequestingCloning) &&
-              (global.fs.mode === 'browser') && (currentWorkspace !== NO_WORKSPACE) && 
-              <div className='h-100 remixui_treeview' data-id='filePanelFileExplorerTree'>
-                <FileExplorer
-                  name={currentWorkspace}
-                  menuItems={['createNewFile', 'createNewFolder', 'publishToGist', canUpload ? 'uploadFile' : '']}
-                  contextMenuItems={global.fs.browser.contextMenu.registeredMenuItems}
-                  removedContextMenuItems={global.fs.browser.contextMenu.removedMenuItems}
-                  files={global.fs.browser.files}
-                  fileState={global.fs.browser.fileState}
-                  expandPath={global.fs.browser.expandPath}
-                  focusEdit={global.fs.focusEdit}
-                  focusElement={global.fs.focusElement}
-                  dispatchCreateNewFile={global.dispatchCreateNewFile}
-                  modal={global.modal}
-                  dispatchCreateNewFolder={global.dispatchCreateNewFolder}
-                  readonly={global.fs.readonly}
-                  toast={global.toast}
-                  dispatchDeletePath={global.dispatchDeletePath}
-                  dispatchRenamePath={global.dispatchRenamePath}
-                  dispatchUploadFile={global.dispatchUploadFile}
-                  dispatchCopyFile={global.dispatchCopyFile}
-                  dispatchCopyFolder={global.dispatchCopyFolder}
-                  dispatchPublishToGist={global.dispatchPublishToGist}
-                  dispatchRunScript={global.dispatchRunScript}
-                  dispatchEmitContextMenuEvent={global.dispatchEmitContextMenuEvent}
-                  dispatchHandleClickFile={global.dispatchHandleClickFile}
-                  dispatchSetFocusElement={global.dispatchSetFocusElement}
-                  dispatchFetchDirectory={global.dispatchFetchDirectory}
-                  dispatchRemoveInputField={global.dispatchRemoveInputField}
-                  dispatchAddInputField={global.dispatchAddInputField}
-                  dispatchHandleExpandPath={global.dispatchHandleExpandPath}
-                  dispatchMoveFile={global.dispatchMoveFile}
-                  dispatchMoveFolder={global.dispatchMoveFolder}
-                  />
-              </div>
-            }
-            {
-              global.fs.localhost.isRequestingLocalhost ? <div className="text-center py-5"><i className="fas fa-spinner fa-pulse fa-2x"></i></div>
-                : <div className='h-100 filesystemexplorer remixui_treeview'>
-                  { global.fs.mode === 'localhost' && global.fs.localhost.isSuccessfulLocalhost &&
-                      <FileExplorer
-                        name='localhost'
-                        menuItems={['createNewFile', 'createNewFolder']}
-                        contextMenuItems={global.fs.localhost.contextMenu.registeredMenuItems}
-                        removedContextMenuItems={global.fs.localhost.contextMenu.removedMenuItems}
-                        files={global.fs.localhost.files}
-                        fileState={[]}
-                        expandPath={global.fs.localhost.expandPath}
-                        focusEdit={global.fs.focusEdit}
-                        focusElement={global.fs.focusElement}
-                        dispatchCreateNewFile={global.dispatchCreateNewFile}
-                        modal={global.modal}
-                        dispatchCreateNewFolder={global.dispatchCreateNewFolder}
-                        readonly={global.fs.readonly}
-                        toast={global.toast}
-                        dispatchDeletePath={global.dispatchDeletePath}
-                        dispatchRenamePath={global.dispatchRenamePath}
-                        dispatchUploadFile={global.dispatchUploadFile}
-                        dispatchCopyFile={global.dispatchCopyFile}
-                        dispatchCopyFolder={global.dispatchCopyFolder}
-                        dispatchPublishToGist={global.dispatchPublishToGist}
-                        dispatchRunScript={global.dispatchRunScript}
-                        dispatchEmitContextMenuEvent={global.dispatchEmitContextMenuEvent}
-                        dispatchHandleClickFile={global.dispatchHandleClickFile}
-                        dispatchSetFocusElement={global.dispatchSetFocusElement}
-                        dispatchFetchDirectory={global.dispatchFetchDirectory}
-                        dispatchRemoveInputField={global.dispatchRemoveInputField}
-                        dispatchAddInputField={global.dispatchAddInputField}
-                        dispatchHandleExpandPath={global.dispatchHandleExpandPath}
-                        dispatchMoveFile={global.dispatchMoveFile}
-                        dispatchMoveFolder={global.dispatchMoveFolder}
-                      />
-                  }
-                </div>
-            }
+          { !(global.fs.browser.isRequestingWorkspace || global.fs.browser.isRequestingCloning) &&
+            (global.fs.mode === 'browser') && (currentWorkspace !== NO_WORKSPACE) && 
+            <div className='h-100 remixui_treeview' data-id='filePanelFileExplorerTree'>
+              <FileExplorer
+                name={currentWorkspace}
+                menuItems={['createNewFile', 'createNewFolder', 'publishToGist', canUpload ? 'uploadFile' : '']}
+                contextMenuItems={global.fs.browser.contextMenu.registeredMenuItems}
+                removedContextMenuItems={global.fs.browser.contextMenu.removedMenuItems}
+                files={global.fs.browser.files}
+                fileState={global.fs.browser.fileState}
+                expandPath={global.fs.browser.expandPath}
+                focusEdit={global.fs.focusEdit}
+                focusElement={global.fs.focusElement}
+                dispatchCreateNewFile={global.dispatchCreateNewFile}
+                modal={global.modal}
+                dispatchCreateNewFolder={global.dispatchCreateNewFolder}
+                readonly={global.fs.readonly}
+                toast={global.toast}
+                dispatchDeletePath={global.dispatchDeletePath}
+                dispatchRenamePath={global.dispatchRenamePath}
+                dispatchUploadFile={global.dispatchUploadFile}
+                dispatchCopyFile={global.dispatchCopyFile}
+                dispatchCopyFolder={global.dispatchCopyFolder}
+                dispatchPublishToGist={global.dispatchPublishToGist}
+                dispatchRunScript={global.dispatchRunScript}
+                dispatchEmitContextMenuEvent={global.dispatchEmitContextMenuEvent}
+                dispatchHandleClickFile={global.dispatchHandleClickFile}
+                dispatchSetFocusElement={global.dispatchSetFocusElement}
+                dispatchFetchDirectory={global.dispatchFetchDirectory}
+                dispatchRemoveInputField={global.dispatchRemoveInputField}
+                dispatchAddInputField={global.dispatchAddInputField}
+                dispatchHandleExpandPath={global.dispatchHandleExpandPath}
+                dispatchMoveFile={global.dispatchMoveFile}
+                dispatchMoveFolder={global.dispatchMoveFolder}
+                />
+            </div>
+          }
+          { global.fs.localhost.isRequestingLocalhost && <div className="text-center py-5"><i className="fas fa-spinner fa-pulse fa-2x"></i></div> }
+          { (global.fs.mode === 'localhost' && global.fs.localhost.isSuccessfulLocalhost) &&
+            <div className='h-100 filesystemexplorer remixui_treeview'>
+              <FileExplorer
+                name='localhost'
+                menuItems={['createNewFile', 'createNewFolder']}
+                contextMenuItems={global.fs.localhost.contextMenu.registeredMenuItems}
+                removedContextMenuItems={global.fs.localhost.contextMenu.removedMenuItems}
+                files={global.fs.localhost.files}
+                fileState={[]}
+                expandPath={global.fs.localhost.expandPath}
+                focusEdit={global.fs.focusEdit}
+                focusElement={global.fs.focusElement}
+                dispatchCreateNewFile={global.dispatchCreateNewFile}
+                modal={global.modal}
+                dispatchCreateNewFolder={global.dispatchCreateNewFolder}
+                readonly={global.fs.readonly}
+                toast={global.toast}
+                dispatchDeletePath={global.dispatchDeletePath}
+                dispatchRenamePath={global.dispatchRenamePath}
+                dispatchUploadFile={global.dispatchUploadFile}
+                dispatchCopyFile={global.dispatchCopyFile}
+                dispatchCopyFolder={global.dispatchCopyFolder}
+                dispatchPublishToGist={global.dispatchPublishToGist}
+                dispatchRunScript={global.dispatchRunScript}
+                dispatchEmitContextMenuEvent={global.dispatchEmitContextMenuEvent}
+                dispatchHandleClickFile={global.dispatchHandleClickFile}
+                dispatchSetFocusElement={global.dispatchSetFocusElement}
+                dispatchFetchDirectory={global.dispatchFetchDirectory}
+                dispatchRemoveInputField={global.dispatchRemoveInputField}
+                dispatchAddInputField={global.dispatchAddInputField}
+                dispatchHandleExpandPath={global.dispatchHandleExpandPath}
+                dispatchMoveFile={global.dispatchMoveFile}
+                dispatchMoveFolder={global.dispatchMoveFolder}
+              />
+            </div>
+          }
           </div>
         </div>
       </div>

From e5a1e2cdaf253e6bee28d6d6da8fb5abdb68e1d0 Mon Sep 17 00:00:00 2001
From: lianahus <liana@ethereum.org>
Date: Tue, 6 Sep 2022 16:23:13 +0200
Subject: [PATCH 2/2] fixing scroll issue

---
 libs/remix-ui/app/src/lib/remix-app/style/remix-app.css      | 2 +-
 .../vertical-icons-panel/src/lib/components/IconList.tsx     | 5 +++--
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/libs/remix-ui/app/src/lib/remix-app/style/remix-app.css b/libs/remix-ui/app/src/lib/remix-app/style/remix-app.css
index 8c321b9145..d177ce8bcf 100644
--- a/libs/remix-ui/app/src/lib/remix-app/style/remix-app.css
+++ b/libs/remix-ui/app/src/lib/remix-app/style/remix-app.css
@@ -8,7 +8,7 @@ pre {
   overflow-x: auto;
 }
 .remixIDE            {
-  width              : 100vw;
+  width              : 100%;
   height             : 100vh;
   overflow           : hidden;
   flex-direction     : row;
diff --git a/libs/remix-ui/vertical-icons-panel/src/lib/components/IconList.tsx b/libs/remix-ui/vertical-icons-panel/src/lib/components/IconList.tsx
index b41a417ddd..4716ac47f9 100644
--- a/libs/remix-ui/vertical-icons-panel/src/lib/components/IconList.tsx
+++ b/libs/remix-ui/vertical-icons-panel/src/lib/components/IconList.tsx
@@ -12,7 +12,7 @@ interface OtherIconsProps {
 
 function IconList ({ verticalIconsPlugin, itemContextAction, icons, theme }: OtherIconsProps) {
   return (
-    <div id="otherIcons">
+    <div id="otherIcons" className="position-relative">
       {
         icons
           .map(p => (
@@ -25,7 +25,8 @@ function IconList ({ verticalIconsPlugin, itemContextAction, icons, theme }: Oth
                 p.profile.name
               }
             />
-          ))}
+          ))
+      }
     </div>
   )
 }