Resolving the \"Objects are not valid as a React child\" Error

In one of my React (Next.js) applications, I encountered the following error message:

Error: Objects are not valid as a React child (found: [object Promise]).
If you meant to render a collection of children, use an array instead.

After spending some time investigating the issue, I discovered that the error occurred because I had mistakenly exported my page component with the async keyword. This mistake happened because I had copied the component from another Next.js project where the async export was allowed in the app folder:

export default async function Page() {

}

However, in the pages folder, it was not possible to export the page component as async.

To resolve this error, all I needed to do was remove the async keyword from the page component export:

export default function Page() {

}

By making this change, the error disappeared and the page rendered without any issues.