import DashboardOverviewPage from '../common/DashboardOverviewPage'
import StatsDisplay from '../common/StatsDisplay'
import ModelHistoryDisplay from '../common/ModelHistoryDisplay'
import ObjectTable from '../common/ObjectTable'

const collapseDefaults = {
  printerStats: true,
  printerHistory: true,
  onlinePrinters: true,
  jobStats: true,
  productionStats: true,
  jobStatsDetails: true,
  jobHistory: true,
  queuedJobs: true
}

const sections = [
  {
    key: 'printerStats',
    title: 'Printer Statistics',
    className: 'no-t-padding-collapse',
    content: <StatsDisplay objectType='printer' />
  },
  {
    key: 'jobStats',
    title: 'Job Statistics',
    className: 'no-t-padding-collapse',
    content: <StatsDisplay objectType='job' />
  },
  {
    key: 'printerAndJobHistoryRow',
    type: 'row',
    columns: [
      [
        {
          key: 'printerHistory',
          title: 'Printer History',
          content: <ModelHistoryDisplay objectType='printer' />
        }
      ],
      [
        {
          key: 'jobHistory',
          title: 'Job History',
          content: <ModelHistoryDisplay objectType='job' />
        }
      ]
    ]
  },
  {
    key: 'onlinePrintersAndQueuedJobsRow',
    type: 'row',
    columns: [
      [
        {
          key: 'onlinePrinters',
          title: 'Online Printers',
          content: (
            <ObjectTable type='printer' masterFilter={{ online: true }} />
          )
        }
      ],
      [
        {
          key: 'queuedJobs',
          title: 'Queued Jobs',
          content: <ObjectTable type='job' masterFilter={{ state: 'queued' }} />
        }
      ]
    ]
  }
]

const ProductionOverview = () => {
  return (
    <DashboardOverviewPage
      pageName='ProductionOverview'
      collapseDefaults={collapseDefaults}
      sections={sections}
    />
  )
}

export default ProductionOverview