Next.js Discord

Discord Forum

Is it possible to pass in children element props?

Answered
Masai Lion posted this in #help-forum
Open in Discord
Masai LionOP
I'm currently making a user profile page on my website. I have created a directory /user/[id], where I get the user id and based on that I display their profile details. Since there are different tabs on the profile page, I decided to create a layout.js file in the /user directory, in which I put the main components that will not change and the components that will appear when the tabs are clicked. But in these components I display user data, which I get and check in layout.js. Is there any way to pass them to the children element?
Answered by B33fb0n3
Of course what M Zeeshan said and

@Masai Lion keep in mind, that your getUser function then would run twice!

To prevent having duplicate calls to your DB, make sure you wrap your function in a react cache:
const getUser = cache(() => {
  // your code
})

This will memorize the response and only execute your code in it once
View full answer

7 Replies

Giant Angora
hi @Masai Lion
you can create utility function e.g. getUser and put prisma logic in that func. and call that utility func. in both layout.tsx and page.tsx, nextjs will never send 2nd request to db via prisma in the same request life cycle
Of course what M Zeeshan said and

@Masai Lion keep in mind, that your getUser function then would run twice!

To prevent having duplicate calls to your DB, make sure you wrap your function in a react cache:
const getUser = cache(() => {
  // your code
})

This will memorize the response and only execute your code in it once
Answer
happy to help
Giant Angora
Hi @B33fb0n3
Afaik, we use cache if data process does not use fetch, i use drizzle and don’t know what prisma uses behind the scenes, but React applies request memoization to every Get request in same request life cycle and Next js cache data for sharing across requests