import React from 'react';
import {Outlet, useLocation} from 'react-router-dom';
import Sidebar from '@/common/components/Sidebar';
import ProfileMenu from '@/common/components/ProfileMenu';

const getPageTitle = (pathname) => {
    switch (pathname) {
        case '/dashboard':
            return 'Dashboard';
        case '/machines':
            return 'Machines';
        case '/servers':
            return 'Servers';
        case '/settings':
            return 'Settings';
        case '/admin/users':
            return 'User Management';
        case '/admin/settings':
            return 'System Settings';
        default:
            return 'Dashboard';
    }
};

const Root = () => {
    const location = useLocation();
    const pageTitle = getPageTitle(location.pathname);

    return (
        <div className="layout">
            <Sidebar/>
            <div className="main">
                <header className="topbar">
                    <h3>{pageTitle}</h3>
                    <div className="grow"></div>
                    <ProfileMenu/>
                </header>
                <Outlet/>
            </div>
        </div>
    );
};

export default Root;