import { PageShell, PageHeader } from '@/components/page-shell'
import { BackButton } from '@/components/back-button'
import { db } from '@/lib/db'
import { listMapsForPicker } from '@/lib/maps'
import { CaptureSession } from './capture-session'

export const dynamic = 'force-dynamic'

export default async function CapturePage({
  searchParams,
}: {
  searchParams: Promise<{ at?: string }>
}) {
  const { at } = await searchParams
  // All locations as autocomplete suggestions for the location chip, ordered
  // by recency so frequently-touched paths surface first when the input is
  // empty. The custom autocomplete handles substring + segment-aware ranking.
  const [suggestions, maps] = await Promise.all([
    db.location.findMany({
      orderBy: { updatedAt: 'desc' },
      select: { id: true, path: true },
    }),
    listMapsForPicker(),
  ])

  return (
    <PageShell>
      <div className="pt-2">
        <PageHeader
          title="Capture"
          back={<BackButton fallbackHref="/" />}
        />
        <CaptureSession initialLocation={at || ''} suggestions={suggestions} maps={maps} />
      </div>
    </PageShell>
  )
}