react to minimize

apps/remix-ide/src/app/components/panel.ts

@@ -1,16 +1,9 @@
 import React from 'react' // eslint-disable-line
 import { EventEmitter } from 'events'
 import { HostPlugin } from '@remixproject/engine-web' // eslint-disable-line
-import { Profile } from '@remixproject/plugin-utils'
+import { PluginRecord } from 'libs/remix-ui/panel/src/lib/types'
 const EventManager = require('../../lib/events')
 
-/** Abstract class used for hosting the view of a plugin */
-type PluginRecord = {
-  profile: Profile
-  view: any
-  active: boolean
-  class?: string
-}
 export class AbstractPanel extends HostPlugin {
   events: EventEmitter
   event: any

libs/remix-ui/panel/src/lib/dragbar/dragbar.tsx

@@ -20,11 +20,15 @@ const DragBar = (props: IRemixDragBarUi) => {
     setDragBarPosY(window.innerHeight - props.refObject.current.offsetHeight)
     setDragState(false)
   }
+  const handleResize = () => {
+    setDragBarPosY(window.innerHeight - props.refObject.current.offsetHeight)
+  }
+
+  useEffect(() => {
+    handleResize()
+  }, [props.hidden])
 
   useEffect(() => {
-    function handleResize () {
-      setDragBarPosY(window.innerHeight - props.refObject.current.offsetHeight)
-    }
     window.addEventListener('resize', handleResize)
     // TODO: not a good way to wait on the ref doms element to be rendered of course
     setTimeout(() =>

libs/remix-ui/panel/src/lib/main/main-panel.tsx

@@ -24,19 +24,17 @@ const RemixUIMainPanel = () => {
           profile: panel.plugin.profile,
           active: panel.active,
           view: panel.plugin.profile.name === 'tabs' ? panel.plugin.renderTabsbar() : panel.plugin.render(),
-          class: panel.plugin.profile.name + '-wrap ' + (panel.minimized ? 'minimized' : '')
+          class: panel.plugin.profile.name + '-wrap ' + (panel.minimized ? 'minimized' : ''),
+          minimized: panel.minimized
         })
       })
-      // console.log(pluginPanels)
       setPlugins(pluginPanels)
     }
   }
 
   useEffect(() => {
     renderPanels()
-    // console.log(appContext.layout)
     appContext.layout.event.on('change', () => {
-      console.log('change')
       renderPanels()
     })
   }, [])
@@ -46,7 +44,7 @@ const RemixUIMainPanel = () => {
       {Object.values(plugins).map((pluginRecord, i) => {
         return (
           <>
-            {(pluginRecord.profile.name === 'terminal') ? <DragBar key='dragbar-terminal' hidden={false} setHideStatus={() => {}} refObject={terminalRef}></DragBar> : null}
+            {(pluginRecord.profile.name === 'terminal') ? <DragBar key='dragbar-terminal' hidden={pluginRecord.minimized || false} setHideStatus={() => {}} refObject={terminalRef}></DragBar> : null}
             <RemixUIPanelPlugin
               ref={refs[i]}
               key={pluginRecord.profile.name}

libs/remix-ui/panel/src/lib/types/index.ts

@@ -5,4 +5,5 @@ export type PluginRecord = {
     view: any
     active: boolean
     class?: string
+    minimized?: boolean
   }