From ce5b59d2ed71261bd5fbafb1abdf849c6d9d8926 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Hannes=20Born=C3=B6?= <hannes.borno@vercel.com>
Date: Fri, 18 Nov 2022 10:51:23 +0100
Subject: [PATCH] Remove unnecessary async function when preloading async
 components (#42957)

The fix in #42793 added an unnecessary step by returning a new async function when the result is a promise. We only have to make sure we don't get an unhandledRejection error if the promise rejects, React takes care of getting the data from the promise.

Ref: [slack thread](https://vercel.slack.com/archives/C035J346QQL/p1668528003500329?thread_ts=1668434306.364449&cid=C035J346QQL)

## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have a helpful link attached, see `contributing.md`

## Feature

- [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
- [ ] Errors have a helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm build && pnpm lint`
- [ ] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)
---
 packages/next/server/app-render.tsx | 23 ++++++-----------------
 1 file changed, 6 insertions(+), 17 deletions(-)

diff --git a/packages/next/server/app-render.tsx b/packages/next/server/app-render.tsx
index ce51949a97bb82c..fb5a2b23476dab7 100644
--- a/packages/next/server/app-render.tsx
+++ b/packages/next/server/app-render.tsx
@@ -59,23 +59,12 @@ function preloadComponent(Component: any, props: any) {
   }
   try {
     let result = Component(props)
-    if (result && result.then) {
-      result = result
-        .then((res: any) => {
-          return { success: res }
-        })
-        .catch((err: Error) => {
-          return { error: err }
-        })
-      return async () => {
-        const res = await result
-        if (res.error) {
-          throw res.error
-        }
-        if (res.success) {
-          return res.success
-        }
-      }
+    if (result && typeof result.then === 'function') {
+      // Catch promise rejections to prevent unhandledRejection errors
+      result.then(
+        () => {},
+        () => {}
+      )
     }
     return function () {
       // We know what this component will render already.