Use `cookies()` and `headers()` from `next/headers` in a Server Component. They read the incoming request on the server; in the browser you read cookies differently (and headers aren’t available the same way).
import { cookies, headers } from 'next/headers'
export default function Page() {
const cookieStore = cookies()
const theme = cookieStore.get('theme')?.value
const ua = headers().get('user-agent')
return <div>{theme} {ua}</div>
}