60 lines
1.6 KiB
TypeScript
60 lines
1.6 KiB
TypeScript
import dynamic from 'next/dynamic'
|
|
import React from 'react'
|
|
import Split from 'react-split'
|
|
import { useSnapshot } from 'valtio'
|
|
import state from '../../state'
|
|
import { getSplit, saveSplit } from '../../state/actions/persistSplits'
|
|
|
|
const DeployEditor = dynamic(() => import('../../components/DeployEditor'), {
|
|
ssr: false
|
|
})
|
|
|
|
const Accounts = dynamic(() => import('../../components/Accounts'), {
|
|
ssr: false
|
|
})
|
|
|
|
const LogBox = dynamic(() => import('../../components/LogBox'), {
|
|
ssr: false
|
|
})
|
|
|
|
const Deploy = () => {
|
|
const { deployLogs } = useSnapshot(state)
|
|
return (
|
|
<Split
|
|
direction="vertical"
|
|
gutterSize={4}
|
|
gutterAlign="center"
|
|
sizes={getSplit('deployVertical') || [40, 60]}
|
|
style={{ height: 'calc(100vh - 60px)' }}
|
|
onDragEnd={e => saveSplit('deployVertical', e)}
|
|
>
|
|
<main style={{ display: 'flex', flex: 1, position: 'relative' }}>
|
|
<DeployEditor />
|
|
</main>
|
|
<Split
|
|
direction="horizontal"
|
|
sizes={getSplit('deployHorizontal') || [50, 50]}
|
|
minSize={[320, 160]}
|
|
gutterSize={4}
|
|
gutterAlign="center"
|
|
style={{
|
|
display: 'flex',
|
|
flexDirection: 'row',
|
|
width: '100%',
|
|
height: '100%'
|
|
}}
|
|
onDragEnd={e => saveSplit('deployHorizontal', e)}
|
|
>
|
|
<div style={{ alignItems: 'stretch', display: 'flex' }}>
|
|
<Accounts />
|
|
</div>
|
|
<div>
|
|
<LogBox title="Deploy Log" logs={deployLogs} clearLog={() => (state.deployLogs = [])} />
|
|
</div>
|
|
</Split>
|
|
</Split>
|
|
)
|
|
}
|
|
|
|
export default Deploy
|