Skip to content

Commit

Permalink
refactor: error boundary rendering in app-render (vercel#74259)
Browse files Browse the repository at this point in the history
  • Loading branch information
huozhi authored Dec 23, 2024
1 parent e93f27e commit 75a9dfa
Showing 1 changed file with 75 additions and 63 deletions.
138 changes: 75 additions & 63 deletions packages/next/src/server/app-render/create-component-tree.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -209,12 +209,6 @@ async function createComponentTreeInternal({
injectedJS: injectedJSWithCurrentLayout,
})
: []
const forbiddenElement = Forbidden ? (
<>
{forbiddenStyles}
<Forbidden />
</>
) : undefined

const [Unauthorized, unauthorizedStyles] =
authInterrupts && unauthorized
Expand All @@ -226,6 +220,21 @@ async function createComponentTreeInternal({
injectedJS: injectedJSWithCurrentLayout,
})
: []

const notFoundElement = NotFound ? (
<>
{notFoundStyles}
<NotFound />
</>
) : undefined

const forbiddenElement = Forbidden ? (
<>
{forbiddenStyles}
<Forbidden />
</>
) : undefined

const unauthorizedElement = Unauthorized ? (
<>
{unauthorizedStyles}
Expand Down Expand Up @@ -411,13 +420,9 @@ async function createComponentTreeInternal({
const isChildrenRouteKey = parallelRouteKey === 'children'
const parallelRoute = parallelRoutes[parallelRouteKey]

const notFoundComponent =
NotFound && isChildrenRouteKey ? (
<>
{notFoundStyles}
<NotFound />
</>
) : undefined
const notFoundComponent = isChildrenRouteKey
? notFoundElement
: undefined

const forbiddenComponent = isChildrenRouteKey
? forbiddenElement
Expand Down Expand Up @@ -709,56 +714,30 @@ async function createComponentTreeInternal({
// but it's not ideal, as it needlessly invokes the `NotFound` component and renders the `RootLayout` twice.
// We should instead look into handling the fallback behavior differently in development mode so that it doesn't
// rely on the `NotFound` behavior.
if (NotFound) {
const notFoundParallelRouteProps = {
children: (
<>
{notFoundStyles}
<NotFound />
</>
),
}
notfoundClientSegment = (
<>
{layerAssets}
<ClientSegmentRoot
Component={SegmentComponent}
slots={notFoundParallelRouteProps}
params={currentParams}
/>
</>
)
}
if (Forbidden) {
const forbiddenParallelRouteProps = {
children: forbiddenElement,
}
forbiddenClientSegment = (
<>
{layerAssets}
<ClientSegmentRoot
Component={SegmentComponent}
slots={forbiddenParallelRouteProps}
params={currentParams}
/>
</>
)
}
if (Unauthorized) {
const unauthorizedParallelRouteProps = {
children: unauthorizedElement,
}
unauthorizedClientSegment = (
<>
{layerAssets}
<ClientSegmentRoot
Component={SegmentComponent}
slots={unauthorizedParallelRouteProps}
params={currentParams}
/>
</>
)
}
notfoundClientSegment = createErrorBoundaryClientSegmentRoot({
ErrorBoundaryComponent: NotFound,
errorElement: notFoundElement,
ClientSegmentRoot,
layerAssets,
SegmentComponent,
currentParams,
})
forbiddenClientSegment = createErrorBoundaryClientSegmentRoot({
ErrorBoundaryComponent: Forbidden,
errorElement: forbiddenElement,
ClientSegmentRoot,
layerAssets,
SegmentComponent,
currentParams,
})
unauthorizedClientSegment = createErrorBoundaryClientSegmentRoot({
ErrorBoundaryComponent: Unauthorized,
errorElement: unauthorizedElement,
ClientSegmentRoot,
layerAssets,
SegmentComponent,
currentParams,
})
if (
notfoundClientSegment ||
forbiddenClientSegment ||
Expand Down Expand Up @@ -861,3 +840,36 @@ async function MetadataOutlet({
return null
}
MetadataOutlet.displayName = OUTLET_BOUNDARY_NAME

function createErrorBoundaryClientSegmentRoot({
ErrorBoundaryComponent,
errorElement,
ClientSegmentRoot,
layerAssets,
SegmentComponent,
currentParams,
}: {
ErrorBoundaryComponent: React.ComponentType<any> | undefined
errorElement: React.ReactNode
ClientSegmentRoot: React.ComponentType<any>
layerAssets: React.ReactNode
SegmentComponent: React.ComponentType<any>
currentParams: Params
}) {
if (ErrorBoundaryComponent) {
const notFoundParallelRouteProps = {
children: errorElement,
}
return (
<>
{layerAssets}
<ClientSegmentRoot
Component={SegmentComponent}
slots={notFoundParallelRouteProps}
params={currentParams}
/>
</>
)
}
return null
}

0 comments on commit 75a9dfa

Please sign in to comment.