Split up config sections into pages

This commit is contained in:
Gabe Kangas
2020-10-29 10:16:13 -07:00
parent 34458c1676
commit 83de63b1e8
5 changed files with 268 additions and 150 deletions

View File

@@ -46,14 +46,14 @@ export default function MainLayout(props) {
<Sider
width={240}
style={{
overflow: 'auto',
height: '100vh',
overflow: "auto",
height: "100vh",
}}
>
<Menu
theme="dark"
defaultSelectedKeys={[route.substring(1)]}
defaultOpenKeys={['current-stream-menu', 'utilities-menu']}
defaultOpenKeys={["current-stream-menu", "utilities-menu"]}
mode="inline"
>
<h1 className={adminStyles.owncastTitleContainer}>
@@ -66,24 +66,38 @@ export default function MainLayout(props) {
<Link href="/">Home</Link>
</Menu.Item>
<SubMenu key="current-stream-menu" icon={<LineChartOutlined />} title="Stream Details">
<SubMenu
key="current-stream-menu"
icon={<LineChartOutlined />}
title="Stream Details"
>
<Menu.Item key="viewer-info">
<Link href="/viewer-info">Viewers</Link>
</Menu.Item>
<Menu.Item key="hardware-info">
<Link href="/hardware-info">Hardware</Link>
</Menu.Item>
{ broadcastActive ? (
{broadcastActive ? (
<Menu.Item key="disconnect-stream" icon={<CloseCircleOutlined />}>
<Link href="/disconnect-stream">Disconnect Stream...</Link>
</Menu.Item>
) : null}
) : null}
</SubMenu>
<SubMenu key="utilities-menu" icon={<SettingOutlined />} title="Utilities">
<SubMenu
key="utilities-menu"
icon={<SettingOutlined />}
title="Utilities"
>
<Menu.Item key="update-server-config">
<Link href="/update-server-config">Server Configuration</Link>
</Menu.Item>
<Menu.Item key="video-config">
<Link href="/video-config">Video Configuration</Link>
</Menu.Item>
<Menu.Item key="storage">
<Link href="/storage">Storage</Link>
</Menu.Item>
<Menu.Item key="update-stream-key">
<Link href="/update-stream-key">Change Stream Key</Link>
</Menu.Item>
@@ -94,19 +108,15 @@ export default function MainLayout(props) {
<Layout>
<Header className={adminStyles.header}>
<div className={adminStyles.statusIndicatorContainer}>
<span className={adminStyles.statusLabel}>
{statusMessage}
</span>
<span className={adminStyles.statusIcon}>
{statusIcon}
</span>
<span className={adminStyles.statusLabel}>{statusMessage}</span>
<span className={adminStyles.statusIcon}>{statusIcon}</span>
</div>
</Header>
<Content className={adminStyles.contentMain}>
{children}
</Content>
<Footer style={{ textAlign: 'center' }}><a href="https://owncast.online/">About Owncast</a></Footer>
<Content className={adminStyles.contentMain}>{children}</Content>
<Footer style={{ textAlign: "center" }}>
<a href="https://owncast.online/">About Owncast</a>
</Footer>
</Layout>
</Layout>
);