Any way to set static props on page components?

Developer Support
1

Hi,
In my project, I used a Layout component by wrapping a Component with it in _app.jsx

// pages/_app.jsx
<Layout>
    <Component />
</Layout>

I am curious, if there is any way to attach a static property to Page Component from Plasmic Studio. It will help me simplify my solution.

Feature similar to meta prop but instead it attach a static prop to the Page component.

For example, inside our Layout component we want to conditionally render stuff based on Page Component static property isAuthenticated

<Layout isAuthenticated={Component.isAuthenticated}>
    <Component />
</Layout>
2

hmm not at the moment… :thinking_face:

3

Can we expect it in the near future as it plays a key role, particularly in Nextjs codegen, in passing static properties to parent Layout component in _app.jsx which helps us achieve a persistent layout and we can render different variants of that Layout in different pages.

Currently, the workaround I did is to maintain a mapping of static properties for each page in the code. Something like this

"/": {
  isAuth: true
},
"/login": {
  isAuth: false
}

Essentially a json that stores static properties for each page. In the Layout component I get the particular static properties by the url path the user is at the moment.

Following would help simplify it and open new ideas to experiment around Page Component and Layouts in Nextjs specifically.

  1. Meta Static Prop
  2. An option in the studio to help us define default static prop values for any new page that we add in the studio
4

@chungwu Can you please share an update on this?
Can we expect it in future releases?

A Meta Prop of static type, which will allow us to define static property on Page components

5

Probably not soon… One thing you could do is to mount all the authenticated pages under the same prefix (/auth/blah, etc), so you could figure it out from the url. Definitely not ideal though :confused: