added pause to workspace test and refactored dragable bar

apps/remix-ide-e2e/src/tests/workspace.test.ts

@@ -42,6 +42,7 @@ module.exports = {
       .click('*[data-id="workspacesModalDialogModalDialogModalFooter-react"] .modal-ok')
       .waitForElementVisible('*[data-id="treeViewLitreeViewItemtests"]')
       .addFile('test.sol', { content: 'test' })
+      .pause(1000)
       .waitForElementVisible('*[data-id="treeViewLitreeViewItemtest.sol"]')
       .click('*[data-id="workspaceCreate"]') // create workspace_name_1
       .waitForElementVisible('*[data-id="modalDialogCustomPromptTextCreate"]')
@@ -49,6 +50,7 @@ module.exports = {
       .execute(function () { document.querySelector('*[data-id="modalDialogCustomPromptTextCreate"]')['value'] = 'workspace_name_1' })
       .click('*[data-id="workspacesModalDialogModalDialogModalFooter-react"] .modal-ok')
       .waitForElementVisible('*[data-id="treeViewLitreeViewItemtests"]')
+      .pause(1000)
       .waitForElementNotPresent('*[data-id="treeViewLitreeViewItemtest.sol"]')
       .click('*[data-id="workspacesSelect"] option[value="workspace_name"]')
       .waitForElementVisible('*[data-id="treeViewLitreeViewItemtests"]')
@@ -63,6 +65,7 @@ module.exports = {
       .execute(function () { document.querySelector('*[data-id="modalDialogCustomPromptTextRename"]')['value'] = 'workspace_name_renamed' })
       .click('*[data-id="workspacesModalDialogModalDialogModalFooter-react"] .modal-ok')
       .click('*[data-id="workspacesSelect"] option[value="workspace_name_1"]')
+      .pause(1000)
       .waitForElementNotPresent('*[data-id="treeViewLitreeViewItemtest.sol"]')
       .click('*[data-id="workspacesSelect"] option[value="workspace_name_renamed"]')
       .waitForElementVisible('*[data-id="treeViewLitreeViewItemtest.sol"]')

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

@@ -315,6 +315,9 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
 
   const mousedown = (event: MouseEvent) => {
     setSeparatorYPosition(event.clientY)
+    const leftRef = document.getElementById('dragId')
+    leftRef.style.backgroundColor = '#007AA6'
+    leftRef.style.border = '2px solid #007AA6'
     setDragging(true)
   }
 
@@ -330,6 +333,9 @@ export const RemixUiTerminal = (props: RemixUiTerminalProps) => {
   }
 
   const onMouseUp = () => {
+    const leftRef = document.getElementById('dragId')
+    leftRef.style.backgroundColor = ''
+    leftRef.style.border = ''
     setDragging(false)
   }