Hello Next.js community,

I'm encountering an issue with the sequence of execution of components in my Next.js application, specifically relating to the layout and page components in my dashboard section.

Here's the scenario:

1. I'm utilizing Kinde authentication for user registration/authentication.
2. Upon successful registration, I create the user in the dashboard/layout.tsx file, which serves as the overarching layout for my dashboard.
3. However, when I attempt to fetch the user data in the dashboard/page.tsx file, I'm not able to retrieve it at the first instance.
4. I figured out that in my case the dashboard.page.tsx is executing prior to layout.tsx, causing a timing issue where the user data isn't available when the dashboard page loads initially.

Could someone please advise on the best way to ensure that the layout component executes before the page component in Next.js? Or if there's a better approach to handling this type of authentication and data fetching setup in Next.js?

Any insights or suggestions would be greatly appreciated!