import React, { useContext, useEffect, useState } from 'react'; import PropTypes from 'prop-types'; import Link from 'next/link'; import Head from 'next/head' import { differenceInSeconds } from "date-fns"; import { useRouter } from 'next/router'; import { Layout, Menu, Popover } from 'antd'; import { SettingOutlined, HomeOutlined, LineChartOutlined, ToolOutlined, PlayCircleFilled, MinusSquareFilled, QuestionCircleOutlined, MessageOutlined, ExperimentOutlined, } from '@ant-design/icons'; import classNames from 'classnames'; import { upgradeVersionAvailable } from "../../utils/apis"; import { parseSecondsToDurationString } from '../../utils/format' import OwncastLogo from './logo'; import { ServerStatusContext } from '../../utils/server-status-context'; import adminStyles from '../../styles/styles.module.scss'; let performedUpgradeCheck = false; export default function MainLayout(props) { const { children } = props; const context = useContext(ServerStatusContext); const { online, broadcaster, versionNumber } = context || {}; const router = useRouter(); const { route } = router || {}; const { Header, Footer, Content, Sider } = Layout; const { SubMenu } = Menu; // status indicator items const streamDurationString = online ? parseSecondsToDurationString(differenceInSeconds(new Date(), new Date(broadcaster.time))) : ""; const currentThumbnail = online ? ( current thumbnail ) : null; const statusIcon = online ? : ; const statusMessage = online ? `Online ${streamDurationString}` : "Offline"; const statusIndicator = (
{statusMessage} {statusIcon}
); const statusIndicatorWithThumb = online ? ( {statusIndicator} ) : statusIndicator; // /////////////// const [upgradeVersion, setUpgradeVersion] = useState(null); const checkForUpgrade = async () => { try { const result = await upgradeVersionAvailable(versionNumber); setUpgradeVersion(result); } catch (error) { console.log("==== error", error); } }; useEffect(() => { if (!performedUpgradeCheck && !context.disableUpgradeChecks) { checkForUpgrade(); performedUpgradeCheck = true } }); const appClass = classNames({ "owncast-layout": true, [adminStyles.online]: online, }); const upgradeMenuItemStyle = upgradeVersion ? 'block' : 'none'; const upgradeVersionString = upgradeVersion || ''; return ( Owncast Admin

Owncast Admin

}> Home } title="Current stream" > Viewers } title="Chat utilities" > Chat } > Public Details Custom page content Social links Server Details Video Setup Storage } title="Utilities" > Hardware Logs Upgrade to v{upgradeVersionString} } title="Integrations" > Webhooks Access Tokens } title="Help" > Help
{statusIndicatorWithThumb}
{children}
); } MainLayout.propTypes = { children: PropTypes.element.isRequired, };