.tip

A cookie read inside a deeply nested component makes everything above it dynamic, or fails the build under Cache Components. Read it in the page and pass the value down as a prop, and the rest of the tree can be cached.

const theme = (await cookies()).get("theme")?.value ?? "dark";
return <Shell theme={theme} />;

The rule holds more generally: request specific reads belong at the edge of the tree, not in the leaves.