Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Static Brands page is not working when I you go to a brand url #1830

Open
dankoz51 opened this issue Jan 2, 2025 · 0 comments
Open

Static Brands page is not working when I you go to a brand url #1830

dankoz51 opened this issue Jan 2, 2025 · 0 comments

Comments

@dankoz51
Copy link

dankoz51 commented Jan 2, 2025

Describe the bug
When navigating to the brand page on a demo store with data such as http://localhost:3001/brands/ofs we get an error on the page. If you look at the error its describing an issue between the brand page, and the static/brand page (server side)

`Error: A tree hydrated but some attributes of the server rendered HTML didn't match the client properties. This won't be patched up. This can happen if a SSR-ed Client Component used:

  • A server/client branch if (typeof window !== 'undefined').
  • Variable input such as Date.now() or Math.random() which changes each time it's called.
  • Date formatting in a user's locale which doesn't match the server.
  • External changing data without sending a snapshot of it along with the HTML.
  • Invalid HTML tag nesting.

It can also happen if the client has a browser extension installed which messes with the HTML before React loaded.

https://react.dev/link/hydration-mismatch

...
<OuterLayoutRouter parallelRouterKey="children" segmentPath={[...]} template={} ...>


<InnerScrollAndFocusHandler segmentPath={[...]} focusAndScrollRef={{apply:false, ...}}>



<HTTPAccessFallbackErrorBoundary pathname="/brands/ofs" notFound={[...]} forbidden={undefined} ...>


<InnerLayoutRouter parallelRouterKey="children" url="/brands/ofs" tree={[...]} childNodes={Map} ...>


<html
className="__variable_d65c78 font-sans"
lang="en"

To Reproduce
Steps to reproduce the behavior:

  1. Go to '../brands/ofs'
  2. Click on 'Error' in the lower left screen
  3. See error

This is in the current version of catalyst that I just built on Jan 2

Expected behavior
No Error occurs

Screenshots
Screenshot 2025-01-02 at 12 08 04 PM
Screenshot 2025-01-02 at 12 08 22 PM

Additional context
I beleive this error is caused because the ./static/page.tsx has Brands as a query where as the dynamix local page has Brand (singular) as the query. The graphql queries for each are out of sync

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant