Different behavior for dev and prod builds for client components within a layout

[EugeneDraitsev]

Link to the code that reproduces this issue

https://github.com/EugeneDraitsev/next-routing-issue

To Reproduce

1. Clone a repo and run yarn dev or check it on codesandbox (deployed app link)
2. Navigate between pages using the drawer (the drawer always stays open)

Recording.2024-02-11.184517.mp4

3. Do the same with yarn build and yarn start or check it on vercel
4. Navigate between pages using the drawer (the drawer always closes when navigating)

Recording.2024-02-11.184606.mp4

Current vs. Expected behavior

Expected behavior: Dev and prod work the same (in an ideal scenario the dev behavior should be correct)
Current behavior: For some reason in the prod build the <Header /> component is remounted and dev/prod behaves differently.

Btw, everything works as expected on dev and prod builds if I add 'use client' to layout.js (which is a very bad workaround).

Provide environment information

Operating System:
  Platform: win32
  Arch: x64
  Version: Windows 11 Pro
Binaries:
  Node: 20.10.0
  npm: N/A
  Yarn: N/A
  pnpm: N/A
Relevant Packages:
  next: 14.1.0
  eslint-config-next: 14.1.0
  react: 18.2.0
  react-dom: 18.2.0
  typescript: N/A
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

App Router, Routing (next/router, next/navigation, next/link)

Which stage(s) are affected? (Select all that apply)

next dev (local), next build (local), next start (local)

Additional context

No response