// frontend/src/pages/manufacturing/firmware/FirmwareManagerPage.jsx
// Firmware Manager — wrapper page with PageHeader and two tabs:
//   "Firmware Files"  → FirmwareManager
//   "Flashing Assets" → FlashAssetManager

import { useState } from 'react'
import PageHeader from '@/components/ui/PageHeader'
import Tabs from '@/components/ui/Tabs'
import FirmwareManager from './FirmwareManager'
import FlashAssetManager from '@/pages/engineering/manufacturing/FlashAssetManager'
import FirmwareApiPage from './FirmwareApiPage'

const TABS = [
  { key: 'firmware', label: 'Firmware Files'  },
  { key: 'assets',   label: 'Flashing Assets' },
  { key: 'api',      label: 'Firmware API'    },
]

export default function FirmwareManagerPage() {
  const [activeTab, setActiveTab] = useState('firmware')

  return (
    <div className="page-wrapper">
      <PageHeader
        title="Firmware Manager"
        subtitle="Manage firmware releases and flash assets for all board types"
      />

      <Tabs tabs={TABS} active={activeTab} onChange={setActiveTab} variant="line" />

      {activeTab === 'firmware' && <FirmwareManager />}
      {activeTab === 'assets'   && <FlashAssetManager embedded />}
      {activeTab === 'api'      && <FirmwareApiPage />}
    </div>
  )
}
