import { Metadata } from 'next'
import Breadcrumb, { BreadcrumbItemData } from '@/lib/components/Breadcrumb'
import MainContent from './MainContent'

export const metadata: Metadata = {
  title: 'Detail Agent',
}

interface PageProps {
  params: Promise<{ id: string }>
}

export default async function Page({ params }: PageProps) {
  const { id } = await params

  const breadcrumbItems: BreadcrumbItemData[] = [
    {
      name: 'Dashboard',
      href: '/',
      icon: 'dashboard',
    },
    {
      name: 'Agents',
      href: '/agents',
    },
    {
      name: id,
    },
  ]

  return (
    <div>
      <Breadcrumb items={breadcrumbItems} />

      <div className="px-4 sm:px-8 my-8">
        <MainContent agentId={id} />
      </div>
    </div>
  )
}