How to make multipage editor ?

[Bhaliya-jigar]

Is it possible to make a multipage editor with Craft JS?

i have started with this example. i have tried to add multiple <Frame> within one <Editor> without any luck.
Should i have to create separate <Editor> for each page ?

[Bhaliya-jigar]

@prevwong , Any Idea?

[hugominas]

Hi @Bhaliya-jigar I think craft.js is agnostic on how you implement this multipage solution, and in my opinion this is great, because you can simply use it in any of your project. I can tell you for my use case, I have created one component with the Editor and just pass in the props I receive from the DB on each page request. And it works flawlessly

[Bhaliya-jigar]

@hugominas Thanks for the reply. So you are storing props for each page separately in DB, right? For me it is single field holding all page data.

[accierro]

Hi @Bhaliya-jigar. You should be able to use multiple <Editor> components on different pages/places with <Frame> in it. I am successfully using that pattern in my project. You just pass different data prop to <Frame> and based on your implementation different/ similar resolver prop to <Editor>.

[matdru]

There should be only one <Frame /> for each <Editor />. Also, when storing craft state in database, i'd advise to transform it according to your business logic so you are not tied to craft internal state too much ( for example, if craft state changes in future release, it will be painful to migrate old saved content, and so on )

[hugominas]

@matdru that is a great point how would I go about cleaning the state and rendering the stored clean state? I thought all the information in there was necessary for craft to render. Thanks in advance

[hugominas]

This is a screenshot of a one of our pages state, which properties do you think are safe to remove?

[matdru]

Realistically, when not editing content, none of events / rules / related properties are very useful, so i presume they can be stripped out, that being said, if the landing page and editor are separate ( let's say they are two different views ) we can transform state even further ( that will require using a custom renderer instead of craft to show the page, so there is extra work involved, but it gives you more power over how things are displayed )

[hugominas]

Got it, so if I remove this proprieties will they be added back when the <Frame /> loads the content? that will reduce the object size significantly!

[hugominas]

I had a quick look at the parsed object before being interpreted by Craft.js and found that all the events / rules / related are already stripped out. Awesome work guys!