Skip to content

SWC should transform pageProps from _app.tsx #72

@pixelpax

Description

@pixelpax

Verify Next.js canary release

  • I verified that the issue exists in the latest Next.js canary release

Describe the bug

In order to use patterns like react-query prefetch, the transform must happen in _app.tsx, as well as in the specific pages.

In this and other common patterns, _app.tsx may be passing some pageProps into global providers.

As it is currently, pageProps will be passed into global providers untransformed, leading to difficult to solve bugs.

export default function App({ Component, pageProps }: AppProps) {

     return ( <QueryClientProvider client={rssQueryClient}>
        <Hydrate state={pageProps.dehydratedState}>
              <Component {...pageProps} />
        </Hydrate>
      </QueryClientProvider>);
}

Expected behavior

I would expect pageProps to be transformed when received by _app.tsx

Reproduction link

No response

Version

"next-superjson-plugin": "^0.5.6"
"superjson": "^1.12.2",

Config

const nextConfig = {
  experimental: {
    swcPlugins: [
      [
        'next-superjson-plugin',
        {
          excluded: []
        }
      ]
    ]
  },
  output: 'standalone'
};

Additional context

An easy workaround for the time being is to do something like

  const fixedPageProps = useMemo(() => superjson.deserialize({
    json: pageProps,
    meta: pageProps._superjson
  }) as AppProps["pageProps"], [pageProps]);

and use fixedPageProps where pageProps would be inserted normally. Hopefully this is helpful for someone, though I do feel strongly that this should be solved by the SWC as default behavior.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions