Skip to content

Commit

Permalink
Fix mismatch of useIsomorphicLayoutEffect logic (#61)
Browse files Browse the repository at this point in the history
After react-collapsed update we get warning in Next.js log:
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.

The reason in broken condition result
  • Loading branch information
baybara-pavel committed Apr 8, 2021
1 parent ea2efe4 commit 0c2e343
Showing 1 changed file with 1 addition and 1 deletion.
2 changes: 1 addition & 1 deletion src/utils.ts
Original file line number Diff line number Diff line change
Expand Up @@ -138,7 +138,7 @@ export function useEffectAfterMount(
* @see Docs https://reach.tech/auto-id
*/
const useIsomorphicLayoutEffect =
typeof window !== 'undefined' ? useEffect : useLayoutEffect;
typeof window !== 'undefined' ? useLayoutEffect : useEffect;
let serverHandoffComplete = false;
let id = 0;
const genId = () => ++id;
Expand Down

0 comments on commit 0c2e343

Please sign in to comment.