#```tsx

1 messages · Page 1 of 1 (latest)

rich grove
#

can you show your full code

mortal hazel
# 
import React from 'react';

export default async function RootLayout({
    children,
  }: {
    children: React.ReactNode,
  }) {
  let props = <JSON Object>
  return (
      <html>
        <body>
          <Navbar />
            {React.cloneElement(children, {props: props})}
          </NextAuthProvider>
        </body>
      </html>
  )
}
rich grove
#

i dont think you have to say props

#

but uh

#

that may not be the issue

#

im also unsure if u can use cloning in a server component

mortal hazel
# 
No overload matches this call.
  The last overload gave the following error.
    Argument of type 'ReactNode' is not assignable to parameter of type 'ReactElement<any, string | JSXElementConstructor<any>>'

This is the full error ^

rich grove
#

oh

#

thats ur typing error

#

i think

#

try a JSX element

#

or

#

React element

mortal hazel
#

Nice! That did it!

Now to google how to get the prop haha

rich grove
#

you get the prop just like normally in any component

mortal hazel
#

Hm, my component is unhappy with that. I'll keep digging at it, I don't want to take all of your time!

mortal hazel
#

Okay, I gotta ask...

export default async function Home(props) {
  console.log("session", props)
  return (
    ...
  );
}

Here, the console logs
props { params: {}, searchParams: {} }

Any idea why it's doing this?

#

This is a server component as well

#

@rich grove
Sorry for the ping, it looks like Discord doesn't notify thread members of new messages
If it does then I'm extra sorry, I'm new to Discord

rich grove
#

any idea its doing what?

mortal hazel
#

It's returning a weird props { params: {}, searchParams: {} } object instead of the JSON object I'm sending it via the clone

rich grove
#

oh wait

#

is this children

mortal hazel
#

Yes

rich grove
#

oh

#

i should of noticed

#

this was a rootlayout

#

I don't think its possible for what ur trying to achieve

#

i think..

#

if it was just an array of components

#

thats one thing

#

but this is a array of components returned by a page.tsx

mortal hazel
#

Oh, I think I see what you mean

#

Shoot, can you think of any other solutions to getting the data from the layout to here?

rich grove
#

the only other way

#

is not really passing props

#

but its a clientside way using context

mortal hazel
#

Damn, I was trying to avoid that because it causes weird re-rendering issues

#

Regardless, thanks for your help. You're awesome

rich grove
#

this guy found a hacky method

#

of doing it

#

using params

#

@mortal hazel

mortal hazel
#

Oh super interesting

#

I'll give that a shot and let you know of the results!

rich grove
#

alright but again

#

this is a hacky way of doing things

#

and i suspect this logic may breakdown if u have a dynamic route ur trying to pass props to children in

mortal hazel
#

Luckily, I'm not. I kind of got it to work. I'll send another update once it's fully implemented.

rich grove
#

ok

mortal hazel
#

No luck man. I was able to get it to send params once but then after that it just decided it didn't want to work anymore. Their docs say it's impossible by design, which is frustrating.

rich grove
#

it makes sense why its impossible

#

because layouts arent a state manager

mortal hazel
#

Right, I've been considering using redux for state management but it's a beast to implement just for this.

rich grove
#

Well even if u do redux

#

its still having the same problem u said u did not want to have

rich grove
#

and honestly

#

if you want a global state manager thats easy

#

look into jotai

#

its easy to implement

#

and offers lots of neat features