As a developer I want to have the pagebuilder content as an AST so that I don't have to parse the HTML to an AST to render with React.

paales commented 1 year ago

Description

Currently PWA Studio and GraphCommerce need to build a completely custom HTML parser to extract all content from the pagebuilder pages. In GraphCommerce we've abandoned this approach as this is way too complex to get stable / bug free.

Expected behavior

I'd like to get a JSON object that represents the structure of the Pagebuilder content with an additional query field for related information;

Maybe something like this would be nice:

This idea is based on Hygraph's embeddings functionality, see example query

This covers the same use cases:

There is an AST which describes the deeply nested structure
Each each item has related information described here.

type ComplexTextValue {
  """
  Text that can contain HTML tags.
  """
  html: String! # Already present
  pagebuilder_tree: PageBuilderTree
  pagebuidler_content: [ContentTypeInterface]
}

"""
Scalar representing a tree that describes the tree how content should be rendered.
"""
type PageBuilderTree {
  """
  Same ID as ContentTypeInterface.id
  """
  id: ID
  """
  The children of the node.
  """
  children: [PageBuilderTree]
}

interface ContentTypeInterface {
  id: ID!
}

"""
Based on https://github.com/magento/magento2-page-builder/blob/develop/app/code/Magento/PageBuilder/view/adminhtml/pagebuilder/content_type/products.xml
"""
type ProductsContentType implements ContentTypeInterface {
  id: ID!
  text_align: String
  border_style: String
  show_arrows: Boolean!
  show_dots: Boolean!
  #... etc.
  products: [ProductInterface!]!
}

Benefits

Parsing the current html document is very brittle and requires a DOM to actually parse. In PWA studio this is done with the browser, but on the server, something like jsdom is required. This is memory and CPU intensive.

The currently rendered html contains product information, but this product information doesn't follow the GraphQL spec and thus requires completely custom renderers to get information in product listings. This is very constraining when deciding how to render it and isn't extendable.

This creates a clear separation of the actual tree how the pagebuilder content types are layed out and actually fetching information for all block items.

Additional information

No response

Release note

No response

m2-assistant[bot] commented 1 year ago

Hi @paales. Thank you for your report. To speed up processing of this issue, make sure that the issue is reproducible on the vanilla Magento instance following Steps to reproduce. To deploy vanilla Magento instance on our environment, Add a comment to the issue:

@magento give me 2.4-develop instance - upcoming 2.4.x release
For more details, review the Magento Contributor Assistant documentation.
Add a comment to assign the issue: @magento I am working on this
To learn more about issue processing workflow, refer to the Code Contributions.

Join Magento Community Engineering Slack and ask your questions in #github channel. :warning: According to the Magento Contribution requirements, all issues must go through the Community Contributions Triage process. Community Contributions Triage is a public meeting. :clock10: You can find the schedule on the Magento Community Calendar page. :telephone_receiver: The triage of issues happens in the queue order. If you want to speed up the delivery of your contribution, join the Community Contributions Triage session to discuss the appropriate ticket.

softcommerceltd commented 5 months ago

We've extended pagebuilders's functionality in order to serve CMS (page & block) content as an AST. https://github.com/softcommerceltd/magento-graphcommerce-cms

magento / magento2