fix: hydration issues #4090
fix: hydration issues #4090
Conversation
sshanzel
requested review from
rebelchris,
omBratteng,
ilasw,
capJavert,
nensidosari and
AmarTrebinjac
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
1 Skipped Deployment
|
| useEffect(() => { | ||
| setIsHydrated(true); | ||
| }, []); | ||
|
|
||
| if (!isHydrated) { | ||
| return null; | ||
| } |
There was a problem hiding this comment.
Since it is coming from useViewSize inside useFeedLayout, you can try using useViewSizeClient, it is the same hook only difference is that on the server it will always return false, it will do the same on the first render so there should be no hydration issue.
There was a problem hiding this comment.
Cool. Let me look into that.
There was a problem hiding this comment.
Yeah, it worked as intended.
There was a problem hiding this comment.
Since useFeedLayout is used in different pages, maybe just check it does not introduce some layout shifts on those pages, but it should be ok if this worked.
| @@ -139,10 +138,7 @@ export default function BookmarkFeedLayout({ | |||
| </Typography> | |||
| </FeedPageHeader> | |||
| <CustomFeedHeader | |||
| className={classNames( | |||
| 'mb-6', | |||
There was a problem hiding this comment.
The component CustomFeedHeader already has the mb-6. No need for us to add it again.
|
Tested and looks good to me! 🚀 |
Changes
Events
Did you introduce any new tracking events?
Experiment
Did you introduce any new experiments?
Manual Testing
Caution
Please make sure existing components are not breaking/affected by this PR
Preview domain
https://mi-765.preview.app.daily.dev