diff --git a/packages/nextjs/package.json b/packages/nextjs/package.json index ba1781005454..0fd11be7bce3 100644 --- a/packages/nextjs/package.json +++ b/packages/nextjs/package.json @@ -37,7 +37,7 @@ }, "peerDependencies": { "next": "^10.0.8 || ^11.0 || ^12.0 || ^13.0", - "react": "15.x || 16.x || 17.x || 18.x", + "react": "16.x || 17.x || 18.x", "webpack": ">= 4.0.0" }, "peerDependenciesMeta": { diff --git a/packages/nextjs/src/index.types.ts b/packages/nextjs/src/index.types.ts index 28b6314c5225..58c8ac33da29 100644 --- a/packages/nextjs/src/index.types.ts +++ b/packages/nextjs/src/index.types.ts @@ -30,6 +30,10 @@ export declare function flush(timeout?: number | undefined): PromiseLike): React.ReactNode => { + if (!props.children) { + return null; + } + + if (typeof props.children === 'function') { + return (props.children as () => React.ReactNode)(); + } + + // since Next.js >= 10 requires React ^16.6.0 we are allowed to return children like this here + return props.children as React.ReactNode; +}; + +/** + * A passthrough error boundary wrapper for the server that doesn't depend on any react. Error boundaries don't catch + * SSR errors so they should simply be a passthrough. + */ +export function withErrorBoundary

>( + WrappedComponent: React.ComponentType

, +): React.FC

{ + return WrappedComponent as React.FC

; +} + +/** + * Just a passthrough since we're on the server and showing the report dialog on the server doesn't make any sense. + */ +export function showReportDialog(): void { + return; +} const globalWithInjectedValues = global as typeof global & { __rewriteFramesDistDir__: string; diff --git a/packages/react/src/errorboundary.tsx b/packages/react/src/errorboundary.tsx index 907f7e029314..7e68416a67ce 100644 --- a/packages/react/src/errorboundary.tsx +++ b/packages/react/src/errorboundary.tsx @@ -1,4 +1,4 @@ -import type { ReportDialogOptions, Scope} from '@sentry/browser'; +import type { ReportDialogOptions, Scope } from '@sentry/browser'; import { captureException, showReportDialog, withScope } from '@sentry/browser'; import { isError, logger } from '@sentry/utils'; import hoistNonReactStatics from 'hoist-non-react-statics';