When SSR, useLayoutEffect warning in NavList

[disorn-inc]

Description

When use NavList in the nextjs project , the useLayoutEffect warning.

Warning: useLayoutEffect does nothing on the server, because its effect cannot be encoded into the server renderer's output format. This will lead to a mismatch between the initial, non-hydrated UI and the intended UI. To avoid this, useLayoutEffect should only be used in components that render exclusively on the client. See https://reactjs.org/link/uselayouteffect-ssr for common fixes. at ItemWithSubNav (/Users/***/***/***/node_modules/@primer/react/lib/NavList/NavList.js:92:3)

Steps to reproduce

1. Run the nextjs development server.
2. Refresh the browser to enter the page via SSR.
3. Check the development server log (not the browser console log).

Version

35.22.0

Browser

No response

[siddharthkp]

Hi! Thanks for taking the time to report this!

Turns out we are using React.useLayoutEffect instead of useIsomorphicLayoutEffect in the component.

Added this issue to our inbox so that it can be picked up!