bunsenstraat
3 years ago
parent
c84de22696
commit
c6b6af72a9
@ -0,0 +1,15 @@ |
||||
import { Plugin } from '@remixproject/engine' |
||||
import { Profile } from '@remixproject/plugin-utils' |
||||
const EventManager = require('../../lib/events') |
||||
|
||||
const profile:Profile = { |
||||
name: 'layout', |
||||
description: 'layout' |
||||
} |
||||
export class Layout extends Plugin { |
||||
event: any |
||||
constructor () { |
||||
super(profile) |
||||
this.event = new EventManager() |
||||
} |
||||
} |
||||
@ -1,30 +0,0 @@ |
||||
import { EditorContextListener } from '@remix-project/core-plugin' |
||||
import { Plugin } from '@remixproject/engine' |
||||
import { Profile } from '@remixproject/plugin-utils' |
||||
import { MainPanel } from '../components/main-panel' |
||||
const EventManager = require('../../lib/events') |
||||
|
||||
const profile:Profile = { |
||||
name: 'mainview', |
||||
description: 'main panel' |
||||
} |
||||
export class MainViewReact extends Plugin { |
||||
fileManager: Plugin |
||||
event: any |
||||
tabProxy: Plugin |
||||
editor: Plugin |
||||
mainPanel: MainPanel |
||||
terminal: Plugin |
||||
appManager: Plugin |
||||
contextualListener: EditorContextListener |
||||
constructor (contextualListener, editor, mainPanel, fileManager, appManager, terminal) { |
||||
super(profile) |
||||
this.fileManager = fileManager |
||||
this.event = new EventManager() |
||||
this.editor = editor |
||||
this.terminal = terminal |
||||
this.appManager = appManager |
||||
this.mainPanel = mainPanel |
||||
this.contextualListener = contextualListener |
||||
} |
||||
} |
||||
@ -1 +1,2 @@ |
||||
export { default as RemixPanel } from './lib/remix-ui-panel' |
||||
export { default as RemixPluginPanel } from './lib/plugins/remix-ui-panel' |
||||
export { default as RemixUIMainPanel } from './lib/main/main-panel' |
||||
|
||||
@ -0,0 +1,6 @@ |
||||
.mainview { |
||||
display : flex; |
||||
flex-direction : column; |
||||
height : 100%; |
||||
width : 100%; |
||||
} |
||||
@ -0,0 +1,52 @@ |
||||
import AppContext from 'libs/remix-ui/app/src/lib/remix-app/context/context' |
||||
import { editor } from 'monaco-editor' |
||||
import React, { useContext, useEffect, useRef, useState } from 'react' // eslint-disable-line
|
||||
import { PluginRecord } from '../types' |
||||
import './main-panel.css' |
||||
|
||||
const RemixUIMainPanel = () => { |
||||
const appContext = useContext(AppContext) |
||||
const tabsRef = useRef<HTMLDivElement>(null) |
||||
const mainPanelRef = useRef<HTMLDivElement>(null) |
||||
const terminalRef = useRef<HTMLDivElement>(null) |
||||
const editorRef = useRef<HTMLDivElement>(null) |
||||
|
||||
useEffect(() => { |
||||
|
||||
console.log(appContext) |
||||
if(appContext) { |
||||
console.log(appContext) |
||||
tabsRef.current.appendChild(appContext.panels.tabs.renderTabsbar()) |
||||
editorRef.current.appendChild(appContext.panels.editor.render()) |
||||
mainPanelRef.current.appendChild(appContext.panels.main.render()) |
||||
terminalRef.current.appendChild(appContext.panels.terminal.render()) |
||||
console.log(appContext.panels.main.render()) |
||||
|
||||
const plugins: PluginRecord[] = [ |
||||
{ |
||||
profile: appContext.panels.tabs.profile, |
||||
active: true, |
||||
view: appContext.panels.tabs.renderTabsbar() |
||||
} |
||||
] |
||||
} |
||||
}, []) |
||||
|
||||
const components = { |
||||
tabs: <div ref={tabsRef}></div>, |
||||
editor: <div ref={editorRef}></div>, |
||||
main: <div ref={mainPanelRef}></div>, |
||||
terminal: <div ref={terminalRef}></div> |
||||
} |
||||
|
||||
|
||||
|
||||
return (<div className='mainview'> |
||||
{ components.tabs } |
||||
{ components.editor } |
||||
{ components.main } |
||||
{ components.terminal } |
||||
</div>) |
||||
} |
||||
|
||||
export default RemixUIMainPanel |
||||
@ -1,6 +1,6 @@ |
||||
/* eslint-disable jsx-a11y/anchor-has-content */ |
||||
import React, { useEffect, useRef, useState } from 'react' // eslint-disable-line
|
||||
import { PluginRecord } from './types' |
||||
import { PluginRecord } from '../types' |
||||
import './panel.css' |
||||
|
||||
export interface RemixPanelProps { |
||||
@ -1,26 +1,26 @@ |
||||
import React, { useEffect, useRef, useState } from 'react' // eslint-disable-line
|
||||
import { PluginRecord } from './types' |
||||
import { PluginRecord } from '../types' |
||||
import './panel.css' |
||||
interface panelPLuginProps { |
||||
pluginRecord: PluginRecord |
||||
} |
||||
|
||||
const RemixUIPanelPlugin = (props: panelPLuginProps) => { |
||||
const sidePanelRef = useRef(null) |
||||
const PanelRef = useRef<HTMLDivElement>(null) |
||||
const [view, setView] = useState<JSX.Element | HTMLDivElement>() |
||||
useEffect(() => { |
||||
if (sidePanelRef.current) { |
||||
if (PanelRef.current) { |
||||
if (props.pluginRecord.view) { |
||||
if (React.isValidElement(props.pluginRecord.view)) { |
||||
setView(props.pluginRecord.view) |
||||
} else { |
||||
sidePanelRef.current.appendChild(props.pluginRecord.view) |
||||
PanelRef.current.appendChild(props.pluginRecord.view) |
||||
} |
||||
} |
||||
} |
||||
}, []) |
||||
|
||||
return <div className={props.pluginRecord.active ? 'plugItIn active' : 'd-none'} ref={sidePanelRef}>{view}</div> |
||||
return <div className={props.pluginRecord.active ? `${props.pluginRecord.class} active` : 'd-none'} ref={PanelRef}>{view}</div> |
||||
} |
||||
|
||||
export default RemixUIPanelPlugin |
||||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in new issue