Merge pull request #3372 from ethereum/contMenu

scroll for workspaces list

libs/remix-ui/helper/src/lib/components/custom-dropdown.tsx

@@ -38,6 +38,7 @@ export const CustomIconsToggle = React.forwardRef(({ onClick, icon, className =
 // Dropdown needs access to the DOM of the Menu to measure it
 export const CustomMenu = React.forwardRef(
   ({ children, style, className, 'aria-labelledby': labeledBy }: { children: React.ReactNode, style?: React.CSSProperties, className: string, 'aria-labelledby'?: string }, ref: Ref<HTMLDivElement>) => {
+    const height = window.innerHeight * 0.6
     return (
       <div
         ref={ref}
@@ -45,7 +46,7 @@ export const CustomMenu = React.forwardRef(
         className={className}
         aria-labelledby={labeledBy}
       >
-        <ul className="list-unstyled mb-0">
+        <ul className="overflow-auto list-unstyled mb-0" style={{ maxHeight: height+'px' }}>
           {
            children
           }

libs/remix-ui/workspace/src/lib/remix-ui-workspace.tsx

@@ -451,7 +451,12 @@ export function Workspace () {
                 </div>
 
                 <Dropdown id="workspacesSelect" data-id="workspacesSelect" onToggle={toggleDropdown} show={showDropdown}>
-                  <Dropdown.Toggle as={CustomToggle} id="dropdown-custom-components" className="btn btn-light btn-block w-100 d-inline-block border border-dark form-control mt-1" icon={selectedWorkspace && selectedWorkspace.isGitRepo && !(currentWorkspace === LOCALHOST) ? 'far fa-code-branch' : null}>
+                  <Dropdown.Toggle
+                    as={CustomToggle}
+                    id="dropdown-custom-components"
+                    className="btn btn-light btn-block w-100 d-inline-block border border-dark form-control mt-1"
+                    icon={selectedWorkspace && selectedWorkspace.isGitRepo && !(currentWorkspace === LOCALHOST) ? 'far fa-code-branch' : null}
+                  >
                     { selectedWorkspace ? selectedWorkspace.name : currentWorkspace === LOCALHOST ? formatNameForReadonly("localhost") : NO_WORKSPACE }
                   </Dropdown.Toggle>