fix: Nextjs onboarding snippets #17979
Conversation
ivanagas
changed the title
raquelmsmith
requested review from
neilkakkar
and removed request for
neilkakkar
| export function PHProvider({ children }) { | ||
| return <PostHogProvider client={posthog}>{children}</PostHogProvider> |
There was a problem hiding this comment.
I've never used Next but it seems like this PHProvider does nothing... is there a reason to create it instead of using PostHogProvider directly? Does it have to be in a providers file for some reason?
Further the PHProvider name confused me because I read it as PHP and I thought "wait isn't this JS not PHP?" 😄 I'd recommend renaming the PostHogProvider on import and using that name for this component if you are going to keep this component. But looking at this it's not defined anywhere...... how does that work? Is it Next magic?
There was a problem hiding this comment.
I've never used Next but it seems like this PHProvider does nothing... is there a reason to create it instead of using PostHogProvider directly? Does it have to be in a providers file for some reason?
Basically the use client directive makes it client-side render. It is similar to the typeof window check in the pages router. If you use it directly, it turns off server-side/static rendering all together and causes causes.
I forgot to import the PostHogProvider from the React component, I just changed the name so it isn't the same as the import. The PHProvider component is only used in that one spot.
There was a problem hiding this comment.
I'd still rename PHProvider to avoid confusion, something like CSPoshHogProvider for client side
|
Also someone said something about app vs pages router being more popular, I'm not sure which is which so if you can just make sure they are in the correct order (most popular first) that'd be 👍 |
* Fix nextjs onboarding snippets
Problem
Next.js feature flag onboarding snippets were missing a few key steps.
Changes
Added the steps and fixed a typo
How did you test this code?
Ran locally.