import { AppShell } from "@/components/app-shell"
import { SiteHeader } from "@/components/site-header"
import { DEFAULT_TENANT_ID } from "@/lib/constants"
import { DeviceBreadcrumbs } from "@/components/admin/devices/device-breadcrumbs.client"
import { DeviceTicketsHistoryClient } from "@/components/admin/devices/device-tickets-history.client"

export const runtime = "nodejs"
export const dynamic = "force-dynamic"

export default async function AdminDeviceTicketsPage({ params }: { params: Promise<{ id: string }> }) {
  const { id } = await params

  return (
    <AppShell header={<SiteHeader title="Tickets do dispositivo" lead="Histórico completo de chamados vinculados ao dispositivo." />}>
      <div className="mx-auto w-full max-w-6xl px-4 pb-12 lg:px-6">
        <DeviceBreadcrumbs
          tenantId={DEFAULT_TENANT_ID}
          deviceId={id}
          deviceHref={`/admin/devices/${id}`}
          extra={[{ label: "Tickets" }]}
        />
        <DeviceTicketsHistoryClient tenantId={DEFAULT_TENANT_ID} deviceId={id} />
      </div>
    </AppShell>
  )
}
