import { useState } from 'react'
import { TabBar } from '../../ui/Tabs'
import WorkDaySummary from './restaurant/WorkDaySummary'
import OrderHistory from './restaurant/OrderHistory'
import TrafficAnalytics from './restaurant/TrafficAnalytics'
import RevenueTrends from './restaurant/RevenueTrends'
import TableAnalytics from './restaurant/TableAnalytics'

const TABS = [
  { id: 'workday',  label: 'Ημέρες Λειτουργίας',   Component: WorkDaySummary },
  { id: 'orders',   label: 'Ιστορικό Παραγγελιών',  Component: OrderHistory },
  { id: 'traffic',  label: 'Κίνηση',                Component: TrafficAnalytics },
  { id: 'trends',   label: 'Τάσεις Εσόδων',         Component: RevenueTrends },
  { id: 'tables',   label: 'Τραπέζια',              Component: TableAnalytics },
]

export default function StorePage() {
  const [active, setActive] = useState('workday')
  const tab = TABS.find(t => t.id === active) || TABS[0]
  const { Component } = tab

  return (
    <div className="flex flex-col h-full min-h-0">
      <TabBar tabs={TABS} active={active} onChange={setActive} />
      <div className="flex-1 min-h-0 flex flex-col">
        <Component key={active} />
      </div>
    </div>
  )
}
