fixes as per @Aniket-Engg comments

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

@@ -51,7 +51,7 @@
     word-break: break-word;
   }
   .remixui_menuicon {
-    padding-right   : 30px;
+    padding-right   : 0px;
   }
   .remixui_menuicon:hover {
     transform: scale(1.3);
@@ -110,6 +110,17 @@
     width: 8rem;
   }
 
+  .remixui_menuhr {
+
+  }
+
+  .remixui_menuhr:focus,
+  .remixui_menuhr:hover {
+    color: var(--custom-select) !important;
+    text-decoration: none;
+    background-color: var(--custom-select) !important;
+  }
+
   #workspacesMenuDropdown > div.custom-dropdown-items {
     min-width: 8rem;
   }

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

@@ -318,6 +318,7 @@ export function Workspace () {
             e.stopPropagation()
             createWorkspace()
             _paq.push(['trackEvent', 'fileExplorer', 'workspaceMenu', 'workspaceCreate'])
+            hideIconsMenu(!showIconsMenu)
           }}
           className='far fa-plus pl-2'
         >
@@ -359,69 +360,70 @@ export function Workspace () {
       </div>
     </OverlayTrigger>,
     <OverlayTrigger
-      placement="right-start"
+      placement='right-start'
       overlay={
-        <Tooltip id="createWorkspaceTooltip" className="text-nowrap">
-          <span>Clone Git Repository</span>
+        <Tooltip id="workspaceRenametooltip">
+          <span>Rename Workspace</span>
         </Tooltip>
       }
     >
-      <div
-        data-id='cloneGitRepository'
-        onClick={(e) => {
+      <div onClick={(e) => {
             e.stopPropagation()
-          cloneGitRepository()
-          _paq.push(['trackEvent', 'fileExplorer', 'workspaceMenu', 'cloneGitRepository'])
+            renameCurrentWorkspace()
+            _paq.push(['trackEvent', 'fileExplorer', 'workspaceMenu', 'workspaceRename'])
             hideIconsMenu(!showIconsMenu)
           }}
+          data-id='workspaceRename'
         >
         <span
-          hidden={currentWorkspace === LOCALHOST}
-          id='cloneGitRepository'
-          data-id='cloneGitRepository'
+          hidden={currentWorkspace === LOCALHOST || currentWorkspace === NO_WORKSPACE}
+          id='workspaceRename'
+          data-id='workspaceRename'
           onClick={(e) => {
             e.stopPropagation()
-            cloneGitRepository()
-            _paq.push(['trackEvent', 'fileExplorer', 'workspaceMenu', 'cloneGitRepository'])
+            renameCurrentWorkspace()
+            _paq.push(['trackEvent', 'fileExplorer', 'workspaceMenu', 'workspaceRename'])
             hideIconsMenu(!showIconsMenu)
           }}
-          className='far fa-clone pl-2'
-        >
+          className='far fa-edit pl-2'>
         </span>
-        <span className="pl-3">{'Clone'}</span>
+        <span className="pl-3">{'Rename'}</span>
       </div>
     </OverlayTrigger>,
     <OverlayTrigger
-      placement='right-start'
+      placement="right-start"
       overlay={
-        <Tooltip id="workspaceRenametooltip">
-          <span>Rename Workspace</span>
+        <Tooltip id="createWorkspaceTooltip" className="text-nowrap">
+          <span>Clone Git Repository</span>
         </Tooltip>
       }
     >
-      <div onClick={(e) => {
+      <div
+        data-id='cloneGitRepository'
+        onClick={(e) => {
           e.stopPropagation()
-            renameCurrentWorkspace()
-            _paq.push(['trackEvent', 'fileExplorer', 'workspaceMenu', 'workspaceRename'])
+          cloneGitRepository()
+          _paq.push(['trackEvent', 'fileExplorer', 'workspaceMenu', 'cloneGitRepository'])
           hideIconsMenu(!showIconsMenu)
         }}
-          data-id='workspaceRename'
       >
         <span
-          hidden={currentWorkspace === LOCALHOST || currentWorkspace === NO_WORKSPACE}
-          id='workspaceRename'
-          data-id='workspaceRename'
+          hidden={currentWorkspace === LOCALHOST}
+          id='cloneGitRepository'
+          data-id='cloneGitRepository'
           onClick={(e) => {
             e.stopPropagation()
-            renameCurrentWorkspace()
-            _paq.push(['trackEvent', 'fileExplorer', 'workspaceMenu', 'workspaceRename'])
+            cloneGitRepository()
+            _paq.push(['trackEvent', 'fileExplorer', 'workspaceMenu', 'cloneGitRepository'])
             hideIconsMenu(!showIconsMenu)
           }}
-          className='far fa-edit pl-2'>
+          className='far fa-clone pl-2'
+        >
         </span>
-        <span className="pl-3">{'Rename'}</span>
+        <span className="pl-3">{'Clone'}</span>
       </div>
     </OverlayTrigger>,
+    <hr className="border mt-0 mb-0 remixui_menuhr" style={{ pointerEvents: 'none' }}/>,
     <OverlayTrigger
       placement="right-start"
       overlay={
@@ -504,14 +506,13 @@ export function Workspace () {
                 </span>
                 <span className="remixui_menu remixui_topmenu d-flex justify-content-between align-items-end w-75">
                   <OverlayTrigger
-                    placement="top-start"
+                    placement="top-end"
                     overlay={
                       <Tooltip id="createWorkspaceTooltip" className="text-nowrap">
                         <span>Create</span>
                       </Tooltip>
                     }
                   >
-                    <div>
                       <span
                         hidden={currentWorkspace === LOCALHOST}
                         id='workspaceCreate'
@@ -524,7 +525,6 @@ export function Workspace () {
                         className='far fa-plus remixui_menuicon d-flex align-self-end'
                         >
                       </span>
-                    </div>
                   </OverlayTrigger>
                   <Dropdown id="workspacesMenuDropdown" data-id="workspacesMenuDropdown" onToggle={() => hideIconsMenu(!showIconsMenu)} show={showIconsMenu}>
                     <Dropdown.Toggle
@@ -536,11 +536,13 @@ export function Workspace () {
                     ></Dropdown.Toggle>
                     <Dropdown.Menu as={CustomMenu} data-id="wsdropdownMenu" className='custom-dropdown-items remixui_menuwidth' align={'right'}>
                       {
-                      workspaceMenuIcons.map(m => (
+                      workspaceMenuIcons.map(m => {
+                        return (
                           <Dropdown.Item>
                             {m}
                           </Dropdown.Item>
-                      ))
+                        )
+                      })
                     }
                     </Dropdown.Menu>
                   </Dropdown>