How to load multiple pages from api-rest storage

[hela-Ch]

Hi, can you please give me an exemple to load multiple pages from api-rest storage and the structure of the data received from the api . On my console the pages array exists but on the editor and command show-pages i have nothing. Tank you :)

[Ju99ernaut]

The data received from should be in this format https://github.com/Ju99ernaut/grapesjs-template-manager#remoterest-api. This is mostly generated by grapesjs.

[hela-Ch]

The data received from should be in this format https://github.com/Ju99ernaut/grapesjs-template-manager#remoterest-api. This is mostly generated by grapesjs.

@Ju99ernaut please each page will have this format { "id": "UUIDv4", "name": "Page name", "template": false, "thumbnail": "", "description": "No description", "gjs-assets": "[]", "gjs-pages": "[]", "gjs-styles": "[]", "updated_at": "" } or all pages will be inside gjs-pages ?? Can you please give some exemple because i tried grapesjs structure with pages and styles and you project structure without success :/ I have been stuck for 3 days For my project , when a page is opened to edit it ,i want to load also all pages from the same presentation and show them when i click the open-pages(take screenshot) button so i can switch between them thank you :)

[Ju99ernaut]

This is the structure for each site, gjs-pages is a bit different and is generated from the editor, the structure is similar to this https://grapesjs.com/docs/api/pages.html

{
"id": "UUIDv4",
"name": "Page name",
"template": false,
"thumbnail": "",
"description": "No description",
"gjs-assets": "[]",
"gjs-pages": "[]",
"gjs-styles": "[]",
"updated_at": ""
}

[Ju99ernaut]

Each site can have multiple pages, stored in gjs-pages , you switch between sites using the open-templates command and between pages in a site using open-pages, the open-pages command opens a panel on the right similar to the style manager.

[hela-Ch]

Thank you @Ju99ernaut :)

1/ . Now i have a list of pages which belong to the same presentation when i click 'take screenshot" and i can switch between them !! but my page doesn't displays on the canvas! i have the json of the component instead :/ the images below show :

• response for the initial load
• the load laravel api (get all slides which belong to the first presentation)
• what i get when a page get displayed

2/. When i tried to load an array of presentations(each presentation has x number of pages) i have nothing on the list of sites and list of pages

[Ju99ernaut]

The issue might be with storage of gjs-pages it should be a string, so maybe json encode it too.

[hela-Ch]

@Ju99ernaut i tried to json encode gjs-pages too but it didn't solve the problem

[Ju99ernaut]

I'm not really sure might be an issue with encoding the data, usually you receive the encoded string from the editor instead of encoding it backend, i.e. you receive the gjs-pages, gjs-assets and gjs-styles as strings from the editor, so you store them as strings and return them as is.

[hela-Ch]

Hello @Ju99ernaut , unfortunately i still cant find what is the problem :/ doesr the gjs-pages has the structure "gjs-pages": [{ "styles": "....", "pages: [ { id: ..., component: ..... }, { id: ..., component: ..... } ] ]} or this structure :

"gjs-pages": [{ "styles": "....", "pages: [ { id: ..., frames: [{ component: { type: 'wrapper', ...}, // GrapesJS never stored data about the wrapper, now it does html: '...', css: '...', }] }, { id: ..., frames: [{ component: { type: 'wrapper', ...}, // GrapesJS never stored data about the wrapper, now it does html: '...', css: '...', }] } ] ]} (because the data stored contains gjs-pages: frames 2/ Can i store each slide separately? Thank you :)

[Ju99ernaut]

I'm not too sure of the structure of gjs-pages, a lot of it is generated by the editor and can vary depending on configuration. In general such an issue is caused when the editor fails to parse the contents of component so it just returns the string value.

I think you can store slides separately, you can handle data storage how you want on the backend as long as you'll be able to return the correct format.