56 lines
1.7 KiB
TypeScript
56 lines
1.7 KiB
TypeScript
|
|
import { Layout } from '@arco-design/web-react'
|
||
|
|
import { OverviewPage } from './overview'
|
||
|
|
import { ProjectInspector } from '../features/projects/project-inspector'
|
||
|
|
import { ProjectRail } from '../features/projects/project-rail'
|
||
|
|
import { ProjectSidebar } from '../features/projects/project-sidebar'
|
||
|
|
import { ProjectStatusbar } from '../features/projects/project-statusbar'
|
||
|
|
import { ProjectTopbar } from '../features/projects/project-topbar'
|
||
|
|
import type { ChannelKey, Project, Theme } from '../features/projects/project-types'
|
||
|
|
|
||
|
|
const { Content } = Layout
|
||
|
|
|
||
|
|
export function ProjectPage({
|
||
|
|
activeProject,
|
||
|
|
activeChannel,
|
||
|
|
selectedItem,
|
||
|
|
theme,
|
||
|
|
onSelectProject,
|
||
|
|
onSelectChannel,
|
||
|
|
onSelectItem,
|
||
|
|
onToggleTheme,
|
||
|
|
}: {
|
||
|
|
activeProject: Project
|
||
|
|
activeChannel: ChannelKey
|
||
|
|
selectedItem: string
|
||
|
|
theme: Theme
|
||
|
|
onSelectProject: (project: Project) => void
|
||
|
|
onSelectChannel: (key: ChannelKey) => void
|
||
|
|
onSelectItem: (title: string) => void
|
||
|
|
onToggleTheme: () => void
|
||
|
|
}) {
|
||
|
|
return (
|
||
|
|
<Layout className="workbench-shell">
|
||
|
|
<ProjectTopbar theme={theme} onToggleTheme={onToggleTheme} />
|
||
|
|
|
||
|
|
<Layout className="workbench-main">
|
||
|
|
<ProjectRail activeProject={activeProject} onSelectProject={onSelectProject} />
|
||
|
|
|
||
|
|
<ProjectSidebar
|
||
|
|
activeProject={activeProject}
|
||
|
|
activeChannel={activeChannel}
|
||
|
|
onSelectChannel={onSelectChannel}
|
||
|
|
onSelectItem={onSelectItem}
|
||
|
|
/>
|
||
|
|
|
||
|
|
<Content className="stage">
|
||
|
|
<OverviewPage onSelectItem={onSelectItem} />
|
||
|
|
</Content>
|
||
|
|
|
||
|
|
<ProjectInspector activeProject={activeProject} activeChannel={activeChannel} selectedItem={selectedItem} />
|
||
|
|
</Layout>
|
||
|
|
|
||
|
|
<ProjectStatusbar />
|
||
|
|
</Layout>
|
||
|
|
)
|
||
|
|
}
|