Fix home page hydration mismatch causing missing styles on initial load

[Copilot]

• Analyze the issue: Home page styles not applied on initial load
• Identify root cause: useParams in shellComponent doesn't work correctly during SSR
• Fix: Use useRouterState to access matched route params, which works during SSR
• Run linting - passed
• Run code review - addressed
• Run CodeQL security check - no issues
• Fix build failure: Remove accidental package-lock.json (project uses bun)
• Revert .gitignore change: package-lock.json should not be ignored

Summary

Fixed the issue where the home page styles weren't being applied on initial load. The root cause was using useParams in the shellComponent, which doesn't work correctly during SSR. Changed to use useRouterState which properly accesses the router state including matched route params during SSR, ensuring the body class is set correctly for CSS variables to work.

Original prompt

For some reason the home page becomes responsive only after navigating to other page and back, probably missing some config in the route

---

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Review	Updated (UTC)
hakapit	Ready	Preview	Dec 28, 2025 1:44pm

[ItamarShDev]

@copilot Hey silly goose, the build fails...
npm error code ERESOLVE
npm error ERESOLVE could not resolve
npm error
npm error While resolving: @nivo/bar@0.85.1
npm error Found: react@19.2.1
npm error node_modules/react
npm error react@"19.2.1" from the root project
npm error peer react@"^18 || ^19 || ^19.0.0-rc" from @ai-sdk/react@1.2.12
npm error node_modules/@ai-sdk/react
npm error @ai-sdk/react@"1.2.12" from ai@4.3.19
npm error node_modules/ai
npm error ai@"^4.3.19" from the root project
npm error 67 more (@floating-ui/react-dom, @radix-ui/react-accordion, ...)

[Copilot]

@copilot Hey silly goose, the build fails...
npm error code ERESOLVE
npm error ERESOLVE could not resolve...

Fixed in 8289516. The issue was that I accidentally committed a package-lock.json file during local testing with npm. Since this project uses bun, that file was causing npm dependency resolution conflicts. I've removed it and added package-lock.json to .gitignore to prevent this from happening again.

[ItamarShDev]

@copilot nothing fixed, still reproduced

if i will go to other page and back it will be fine

[ItamarShDev]

@copilot package lock should never be ignored!

[Copilot]

Reverted in 99af785. Removed package-lock.json from .gitignore.

[Copilot]

@copilot nothing fixed, still reproduced

...

Fixed in 29b8a36. The issue was that useParams doesn't work correctly during SSR in shellComponent. Changed to use useRouterState which properly accesses the matched route params during SSR, ensuring the body class is set correctly for the CSS variables to work on initial page load.