fix: make AppType generic props accessible at top level instead of pageProps

[Jah-yee]

Good day

Problem

When using AppType<MyInitialProps> with a custom type parameter, the custom props were only accessible via pageProps.propName instead of as top-level props on the App component.

From issue #42846:

Prop types defined by the generic parameter on AppType are incorrectly applied to props.pageProps instead of props itself.

Before the fix

type MyAppType = AppType<{ foo: string }>;
const MyApp: MyAppType = ({ Component, foo, pageProps }) => {
  // TS Error: Property 'foo' does not exist on type 'AppPropsType<any, { foo: string }>'
  // foo is only accessible via pageProps.foo
};

After the fix

type MyAppType = AppType<{ foo: string }>;
const MyApp: MyAppType = ({ Component, foo, pageProps }) => {
  // No error: foo is now correctly typed as a top-level prop
};

Solution

Changed AppInitialProps to spread the PageProps generic at the top level:

export type AppInitialProps<PageProps = any> = {
-  pageProps: PageProps
+  PageProps & {
+    pageProps: any
+  }
}

This ensures that when a user provides custom props via AppType<CustomProps>, those props are available directly on the App component's props, consistent with how Next.js actually passes props at runtime.

Testing

• The fix preserves the pageProps property for accessing page-level props
• The fix allows custom props (like foo in the example) to be accessed directly as top-level props
• No breaking changes to existing well-typed code

Thank you for your attention. If there are any issues or suggestions, please leave a comment and I will address them promptly.

Warmly,
RoomWithOutRoof

[nextjs-bot]

Allow CI Workflow Run

• approve CI run for commit: b057d65

Note: this should only be enabled once the PR is ready to go and can only be enabled by a maintainer

[vercel]

Suggested change

	pageProps: any
	pageProps: PageProps

AppInitialProps type change replaces pageProps: PageProps with pageProps: any, silently removing type safety for all consumers that access custom props through pageProps.