terminals

libs/remix-ui/xterm/src/lib/components/remix-ui-xterm.tsx

@@ -15,6 +15,10 @@ const RemixUiXterm = (props: RemixUiXtermProps) => {
     const { plugin, pid, send, timeStamp } = props
     const xtermRef = React.useRef(null)
 
+    useEffect(() => {
+        console.log('render remix-ui-xterm')
+    }, [])
+
     useEffect(() => {
         console.log('remix-ui-xterm ref', xtermRef.current)
         props.setTerminalRef(pid, xtermRef.current)

libs/remix-ui/xterm/src/lib/components/remix-ui-xterminals.tsx

@@ -1,14 +1,8 @@
 import React, { useState, useEffect } from 'react' // eslint-disable-line
 import { ElectronPlugin } from '@remixproject/engine-electron'
 import RemixUiXterm from './remix-ui-xterm'
-
+import '../css/index.css'
-import {
+import { Tab, Tabs } from 'react-bootstrap'
-    ImperativePanelGroupHandle,
-    Panel,
-    PanelGroup,
-    PanelResizeHandle,
-  } from "react-resizable-panels";
-
 export interface RemixUiXterminalsProps {
     plugin: ElectronPlugin
 }
@@ -94,11 +88,13 @@ export const RemixUiXterminals = (props: RemixUiXterminalsProps) => {
 
 
     return (<>
-        <button onClick={() => {
+
+        <button className='btn border' onClick={() => {
             createTerminal()
-        }}>create terminal</button>
+        }}>open terminal</button>
 
 
+        <div className='remix-ui-xterminals-container'>
         {terminals.map((xtermState) => {
             return (
                 <div key={xtermState.pid} data-id={`remixUIXT${xtermState.pid}`}>
@@ -106,6 +102,9 @@ export const RemixUiXterminals = (props: RemixUiXterminalsProps) => {
                 </div>
             )
         })}
+        </div>
+    
+
     </>)
 }
 

libs/remix-ui/xterm/src/lib/css/index.css

@@ -0,0 +1,3 @@
+.remix-ui-xterminals-container {
+    overflow: scroll;
+}

package.json

@@ -201,7 +201,6 @@
     "react-json-view": "^1.21.3",
     "react-markdown": "^8.0.5",
     "react-multi-carousel": "^2.8.2",
-    "react-resizable-panels": "^0.0.53",
     "react-router-dom": "^6.3.0",
     "react-tabs": "^3.2.2",
     "react-zoom-pan-pinch": "^3.0.2",

yarn.lock

@@ -24017,11 +24017,6 @@ react-refresh@^0.14.0:
   resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.14.0.tgz#4e02825378a5f227079554d4284889354e5f553e"
   integrity sha512-wViHqhAd8OHeLS/IRMJjTSDHF3U9eWi62F/MledQGPdJGDhodXJ9PBLNGr6WWL7qlH12Mt3TyTpbS+hGXMjCzQ==
 
-react-resizable-panels@^0.0.53:
-  version "0.0.53"
-  resolved "https://registry.yarnpkg.com/react-resizable-panels/-/react-resizable-panels-0.0.53.tgz#d169e45f33ccb38cdc077e0f99049385e89883ca"
-  integrity sha512-lGOJF0Hh5+Y+Usi7x8btmBTi+6CQV1/RKxnj6jVrzvJ9vLbftbSoJPzymOuX8ZCFimlEwP2AKsGtQVKG/KieHA==
-
 react-router-dom@^6.3.0:
   version "6.3.0"
   resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-6.3.0.tgz#a0216da813454e521905b5fa55e0e5176123f43d"