58 lines
1.8 KiB
JavaScript

// DashboardLayout.js
import PropTypes from 'prop-types'
import React from 'react'
import { Layout, Flex } from 'antd'
import { useLocation } from 'react-router-dom'
import ProductionSidebar from './Production/ProductionSidebar'
import InventorySidebar from './Inventory/InventorySidebar'
import ManagementSidebar from './Management/ManagementSidebar'
import DashboardNavigation from './common/DashboardNavigation'
import DashboardBreadcrumb from './common/DashboardBreadcrumb'
import DeveloperSidebar from './Developer/DeveloperSidebar'
const { Content } = Layout
const DashboardLayout = ({ children }) => {
const location = useLocation()
const isProduction = location.pathname.startsWith('/dashboard/production')
const isInventory = location.pathname.startsWith('/dashboard/inventory')
const isManagement = location.pathname.startsWith('/dashboard/management')
const isDeveloper = location.pathname.startsWith('/dashboard/developer')
return (
<Layout style={{ height: 'var(--unit-100vh)' }}>
<DashboardNavigation />
<Layout>
{isProduction ? (
<ProductionSidebar />
) : isInventory ? (
<InventorySidebar />
) : isManagement ? (
<ManagementSidebar />
) : isDeveloper ? (
<DeveloperSidebar />
) : (
<ProductionSidebar /> // Default to production sidebar
)}
<Layout style={{ padding: '24px' }}>
<Content>
<Flex vertical style={{ height: '100%' }} gap='20px'>
<Flex justify='space-between'>
<DashboardBreadcrumb style={{ margin: '16px 0' }} />
</Flex>
{children}
</Flex>
</Content>
</Layout>
</Layout>
</Layout>
)
}
DashboardLayout.propTypes = {
children: PropTypes.node.isRequired
}
export default DashboardLayout