Allow section blocks to have nested app/theme blocks

[bakura10]

Hi,

As of today, a section can either have section block, or have theme blocks, but the two can't be mixed. I can understand the technical limitations around that, however it would be very useful for a section block to accept blocks. A typical use case would be a section-specific block (for instance a block that could have special positioning inside the section) but whose content would be driven by existing theme blocks.

The schema would be like this:

{% schema %}
{
   "name": "My section",
   "blocks": [
       {
         "type": "container",
         "blocks": [{ "type": "@theme/button" }]
       }
   ]
}
{% endschema %}

To render:

{% for block in section.blocks %}
  {% if block.type == 'container' %}
     <div class="foo">
        {% content_for block %}
     </div>
  {% endif %}
{% endfor %}

cc @benjaminsehl

[bakura10]

This is somehow related to this: #73

The complete opacity of theme blocks from the parent section is extremely limitating. If a section would allow blocks that can accept theme blocks, then at least the consuming section could access settings from the first level of blocks...

[stephanie-shopify]

Thank you for sharing this. the idea for Section blocks to accept Theme Blocks is interesting.

The team is going to revisit the decision to prevent Section and theme blocks from being in the same section.

We are curious to understand more use cases of when sections and theme blocks will need to be together. We had previously considered it to be a solution that would ease initial adoption of theme blocks while migrating from sections to theme blocks. However, it seemed like a poor choice to design an API for a single time migration. Please keep sharing your feedback, It will help us as we revisit this decision

[bakura10]

There are way too many use cases, but for instance when it does not make sense to have dedicated theme blocks for a section, but that you still want to leverage theme blocks for static elements (for instance section header). Let's take this before/after section for instance:

The section header (containing the title, text and buttons) are common to many sections and we would like to leverage a static theme block to move those settings to the appropriate theme blocks.

For the before/after we typically use blocks:

Those two blocks are not used anywhere else in a theme, it just clutter the "blocks" folder (which already become quite long) with non-reusable blocks.

[eballeste]

i might be misunderstanding your issue but is it only that you do not want to clutter the blocks folder?

if yes, you might want to adopt a naming convention for your theme blocks and make sure that they are only available to your Before/after image block through it's settings.

[bakura10]

Yes, but you clutter your blocks folder :D. For some theme blocks that are not re-usable at all, creating a dedicated theme block just make the blocks folder grow larger and larger, and it makes maintenance and code discoverability harder as you have to navigate through lot of different files. It can be nice for complex section theme blocks to split the code, but in a lot of situation, a section theme block can be as short as 10-20 lines of code, and having to splitting it into its own file just does not make sense.

[stefanroberts]

Strongly agree with @bakura10 here. It doesn't make sense to have to migrate existing blocks to new theme blocks when they really only ever get used in one section (eg. slide for the slideshow or buy-buttons for the main-product section). You'd so rarely use these outside those sections, why reform the entire structure to make them more portable elsewhere. Whereas it would be very useful to be able to insert more common elements (eg. headings, text, content cards) across the theme and integrate them into existing blocks. This would also make it much easier to adapt existing instances of Dawn and would probably be a route to including theme blocks in the next major version of Dawn without breaking users' existing settings.

[okcknet]

actually, section blocks and theme blocks must work together to combine current flexibility and abilities of section blocks with component like approach of theme blocks.

i can share an example of this need:
we can bind section blocks with link list of header to show menu related promotions. but with theme blocks, this is not possible, because theme blocks are not giving info about what is in it. if we use section blocks with theme blocks, we can use section blocks to bind and theme blocks for promotions.

also, i think this method will provide faster transition of current themes.