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

feat!: support latest Next.js versions #7026

Merged
merged 5 commits into from
Jul 8, 2024
Merged

feat!: support latest Next.js versions #7026

merged 5 commits into from
Jul 8, 2024

Conversation

AlessioGr
Copy link
Member

@AlessioGr AlessioGr commented Jul 3, 2024

BREAKING: The minimum required Next.js version has been bumped from 15.0.0-rc.0 to 15.0.0-canary.53. This is because the way client components are represented changed somewhere between those versions, and it is not feasible to support both versions in our RSC detection logic.

Previously, Client Components in Webpack were represented as {} objects. Now, they are functions, which broke our RSC detection logic. Now, we can use the react.client.reference symbol to detect whether a component is a client or server component.

This actually uncovered another bug - this logic in getCustomViewByKey was broken:

? typeof views?.Edit?.[customViewKey] === 'object' &&

You can pass both the actual component, or an object which then contains a Component property, containing the React Component, as a custom view:
CleanShot 2024-07-03 at 15 07 38

However, since Client Components previously were objects, they incorrectly triggered this check, leading this logic to assume you passing in an object containing a component and not the actual component, which is incorrect. This resulted in it not returning a custom view. Now that components are represented as functions, this was automatically fixed and uncovered a different bug where we were passing server props to client components (fixed in 8cc5614)

Webpack: [ {}, [Function: ExampleServer] ]

*/
const clientRefSymbol = Symbol.for('react.client.reference')
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is soo nice

if (component === null || component === undefined) {
return false
}
const hasClientComponentSymbol = component.$$typeof == clientRefSymbol
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Amazing

@AlessioGr AlessioGr merged commit 1cf7d4d into beta Jul 8, 2024
45 checks passed
@AlessioGr AlessioGr deleted the fix/rsc-detection branch July 8, 2024 13:24
paulpopus pushed a commit that referenced this pull request Jul 24, 2024
…assed to Client Document Views (#7026)

**BREAKING:** The minimum required Next.js version has been bumped from
`15.0.0-rc.0` to `15.0.0-canary.53`. This is because the way client
components are represented changed somewhere between those versions, and
it is not feasible to support both versions in our RSC detection logic.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants